翻訳は機械翻訳により提供されています。提供された翻訳内容と英語版の間で齟齬、不一致または矛盾がある場合、英語版が優先します。
crowd-line
イメージに線を描画するためのウィジェット。各行はラベルに関連付けられ、出力データには各ラインの始点と終点がレポートされます。
この Crowd HTML 要素を使用する HTML テンプレートのインタラクティブな例については、「」を参照してくださいCodePen
<crowd-line>
要素を使用する Liquid テンプレートの例を次に示します。次のコードをコピーし、拡張子 .html
でファイルに保存します。任意のブラウザでファイルを開き、このテンプレートをプレビューして操作します。その他の例については、このGitHub リポジトリ
<script src="https://assets.crowd.aws/crowd-html-elements.js"></script> <crowd-form> <crowd-line name="crowdLine" src="{{ task.input.taskObject | grant_read_access }}" header="Add header here to describe the task" labels="['car','pedestrian','street car']" > <short-instructions> <p>Read the task carefully and inspect the image.</p> <p>Choose the appropriate label that best suits the image.</p> <p>Draw a line on each objects that the label applies to.</p> </short-instructions> <full-instructions> <p>Read the task carefully and inspect the image.</p> <p>Choose the appropriate label that best suits the image. <p>Draw a line along each object that the image applies to. Make sure that the line does not extend beyond the boundaries of the object. </p> <p>Each line is defined by a starting and ending point. Carefully place the starting and ending points on the boundaries of the object.</p> </full-instructions> </crowd-line> </crowd-form>
属性
次の属性が、この要素でサポートされています。
ヘッダー
オプション。イメージの上に表示するテキスト。これは通常、ワーカーへの質問や簡単な手順になります。
initial-value
オプション。JSON オブジェクトの配列であり、各オブジェクトはコンポーネントのロード時に線を設定します。配列の各 JSON オブジェクトには、以下のプロパティが含まれます。
-
label - ラベル付けタスクの一部として線に割り当てられたテキスト。このテキストは、
<crowd-line>
要素の labels 属性で定義されたラベルの 1 つと一致する必要があります。 -
vertices - イメージの左上隅を基準とした、線の始点と終点の
x
とy
ピクセル座標。
initial-value="{ lines: [ { label: 'sideline', // label of this line annotation vertices:[ // an array of vertices which decide the position of the line { x: 84, y: 110 }, { x: 60, y: 100 } ] }, { label: 'yardline', vertices:[ { x: 651, y: 498 }, { x: 862, y: 869 } ] } ] }"
initial-value
プロパティ経由で設定された線は調整できます。ワーカーの回答が調整されたかどうかは、ワーカーの回答出力の initialValueModified
ブール値で追跡されます。
ラベル
必須。文字列の JSON 形式の配列であり、各文字列は、ワーカーが線に割り当てることのできるラベルです。
制限: 10 ラベル
label-colors
オプション。文字列の配列です。各文字列は、ラベルの 16 進数 (16 進数) コードです。
name
必須。このウィジェットの名前。これは、フォーム出力でウィジェットの入力用のキーとして使用されます。
src
必須。線を描画するイメージの URL です。
リージョン
この要素には次のリージョンが必要です。
full-instructions
線を描画する方法についての一般的な手順。
short-instructions
目立つ場所に表示されるタスク固有の重要な手順。
要素の階層
この要素には、以下の親および子要素があります。
-
親要素: crowd-form
出力
inputImageProperties
ワーカーによって注釈が付けられているイメージのディメンションを指定する JSON オブジェクト。このオブジェクトには、以下のプロパティが含まれています。
-
height - イメージの高さ (ピクセル単位)。
-
width - イメージの幅 (ピクセル単位)。
lines
線のラベルと頂点を持つオブジェクトを含む JSON 配列。
-
label - 行に与えられるラベル。
-
vertices - イメージの左上隅を基準とした、線の始点と終点の
x
とy
ピクセル座標。
例 : 要素の出力サンプル
この要素の出力サンプルを次に示します。
{ "crowdLine": { //This is the name you set for the crowd-line "inputImageProperties": { "height": 1254, "width": 2048 }, "lines": [ { "label": "yardline", "vertices": [ { "x": 58, "y": 295 }, { "x": 1342, "y": 398 } ] }, { "label": "sideline", "vertices": [ { "x": 472, "y": 910 }, { "x": 1480, "y": 600 } ] } ] } }
その他の参照資料
詳細については、以下を参照してください。