Crowd-line - Amazon SageMaker

Crowd-line

Widget pour tracer des lignes sur une image. Chaque ligne est associée à une étiquette, et les données en sortie indiquent les points de départ et de fin de chaque ligne.

Consultez un exemple interactif d'un modèle HTML qui utilise cet élément HTML Crowd dans CodePen.

Voici un exemple de modèle Liquid qui utilise l'élément <crowd-line>. Copiez le code suivant et enregistrez-le dans un fichier avec l'extension .html. Ouvrez le fichier dans n'importe quel navigateur pour prévisualiser et interagir avec ce modèle. Pour plus d'exemples, consultez ce référentiel 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>

Attributes

Les attributs suivants sont pris en charge par cet élément.

header

Facultatif. Texte à afficher au-dessus de l'image. Il s'agit généralement d'une question ou d'une instruction simple pour l'employé.

initial-value

Facultatif. Tableau d'objets JSON, chaque objet définissant un cadre de délimitation lorsque le composant est chargé. Chaque objet JSON du tableau comprend les propriétés suivantes :

  • label : texte attribué à la ligne en tant que partie de la tâche d'étiquetage. Ce texte doit correspondre à l'une des étiquettes définies dans l'attribut labels de l'élément <crowd-line>.

  • vertices : les coordonnées de pixel x et y des points de départ et de fin de la ligne, par rapport au coin supérieur gauche de l'image.

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 } ] } ] }"

Les lignes définies au moyen de la propriété initial-value peuvent être ajustées. L'ajustement d'une réponse d'employé est suivi au moyen d'un booléen initialValueModified dans la sortie de la réponse d'employé.

labels

Obligatoire. Tableau de chaînes au format JSON, chaque chaîne étant une étiquette qu'un employé peut attribuer à une ligne.

Limit : 10 étiquettes

label-colors

Facultatif. Tableau de chaînes. Chaque chaîne est un code hexadécimal (hex) pour une étiquette.

nom

Obligatoire. Nom de ce widget. Il est utilisé en tant que clé pour la saisie du widget dans la sortie du formulaire.

src

Obligatoire. L'URL de l'image sur laquelle tracer des lignes.

Régions

Les régions suivantes sont requises par cet élément.

full-instructions

Instructions générales sur la façon de tracer des lignes.

short-instructions

Instructions importantes spécifiques à la tâche qui s'affichent à un endroit bien visible.

Hiérarchie des éléments

Les éléments parents et enfants de cet élément sont les suivants :

Sortie

inputImageProperties

Objet JSON qui spécifie les dimensions de l'image en cours d'annotation par l'employé. Cet objet contient les propriétés suivantes.

  • height : hauteur de l'image, en pixels.

  • width : largeur de l'image, en pixels.

lines

Tableau JSON contenant des objets avec les étiquettes et les sommets des lignes.

  • label : étiquette donnée à une ligne.

  • vertices : les coordonnées de pixel x et y des points de départ et de fin de la ligne, par rapport au coin supérieur gauche de l'image.

Exemple : Exemples de sorties de l'élément

L'exemple suivant est une sortie de cet élément.

{ "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 } ] } ] } }

Voir aussi

Pour plus d’informations, consultez les rubriques suivantes.