crowd-instance-segmentation - Amazon SageMaker

crowd-instance-segmentation

Widget permettant d'identifier les instances individuelles d'objets spécifiques au sein d'une image et de créer une superposition colorée pour chaque instance étiquetée.

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 la <crowd-instance-segmentation>. 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.

<script src="https://assets.crowd.aws/crowd-html-elements.js"></script> <crowd-form> <crowd-instance-segmentation name="annotatedResult" src="{{ task.input.taskObject | grant_read_access }}" header="Please label each of the requested objects in this image" labels="['Cat', 'Dog', 'Bird']" > <full-instructions header="Segmentation Instructions"> <ol> <li><strong>Read</strong> the task carefully and inspect the image.</li> <li><strong>Read</strong> the options and review the examples provided to understand more about the labels.</li> <li><strong>Choose</strong> the appropriate label that best suits the image.</li> </ol> </full-instructions> <short-instructions> <p>Use the tools to label all instances of the requested items in the image</p> </short-instructions> </crowd-instance-segmentation> </crowd-form>

Utilisez un modèle semblable au suivant pour permettre aux employés d'ajouter leurs propres catégories (étiquettes).

<script src="https://assets.crowd.aws/crowd-html-elements.js"></script> <crowd-form> <crowd-instance-segmentation id="annotator" name="myTexts" src="{{ task.input.taskObject | grant_read_access }}" header="Click Instructions to add new labels." labels="['placeholder']" > <short-instructions> <h3>Add a label to describe each type of object in this image.</h3> <h3>Cover each instance of each object with a segmentation mask.</h3> <br> <h3> Add new label </h3> <crowd-input name="_customLabel" id="customLabel"></crowd-input> <crowd-button id="addLabel">Add</crowd-button> <br><br><br> <h3> Manage labels </h3> <div id="labelsSection"></div> </short-instructions> <full-instructions> Describe your task in more detail here. </full-instructions> </crowd-instance-segmentation> </crowd-form> <script> document.addEventListener('all-crowd-elements-ready', function(event) { document.querySelector('crowd-instance-segmentation').labels = []; }); function populateLabelsSection() { labelsSection.innerHTML = ''; annotator.labels.forEach(function(label) { const labelContainer = document.createElement('div'); labelContainer.innerHTML = label + ' <a href="javascript:void(0)">(Delete)</a>'; labelContainer.querySelector('a').onclick = function() { annotator.labels = annotator.labels.filter(function(l) { return l !== label; }); populateLabelsSection(); }; labelsSection.appendChild(labelContainer); }); } addLabel.onclick = function() { annotator.labels = annotator.labels.concat([customLabel.value]); customLabel.value = null; populateLabelsSection(); }; </script>

Attributes

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

header

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

labels

Tableau de chaînes au format JSON, chacune étant une étiquette qu'une application de travail peut attribuer à une instance d'un objet dans l'image. Les applications de travail peuvent générer des couleurs de superposition différentes pour chaque instance correspondante en sélectionnant « add instance » (ajouter une instance) sous l'étiquette dans l'outil.

nom

Nom de ce widget. Il est utilisé comme clé pour l'étiquetage des données dans la sortie du formulaire.

src

URL de l'image à étiqueter.

initial-value

Objet JSON contenant les mappages de couleurs d'une tâche de segmentation d'instance précédente et un lien vers la sortie de l'image de superposition par la tâche précédente. Incluez ceci lorsque vous souhaitez qu'un travail humain vérifie les résultats d'une tâche d'étiquetage antérieure et l'adapte si nécessaire.

L'attribut ressemble à ce qui suit :

initial-value="{ "instances": [ { "color": "#2ca02c", "label": "Cat" }, { "color": "#1f77b4", "label": "Cat" }, { "color": "#d62728", "label": "Dog" } ], "src": {{ "S3 file URL for image" | grant_read_access }} }"

Hiérarchie des éléments

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

Régions

Les régions suivantes sont prises en charge par cet élément.

full-instructions

Instructions générales concernant la procédure de segmentation des images.

short-instructions

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

Sortie

La sortie suivante est prise en charge par cet élément.

labeledImage

Objet JSON contant un PNG encodé en Base64 des étiquettes.

Instances

Tableau JSON contenant les objets avec les étiquettes et les couleurs des instances.

  • color : valeur hexadécimale de la couleur RGB de l'étiquette dans l'labeledImage PNG.

  • label : étiquette donnée à la ou aux superpositions utilisant cette couleur. Cette valeur peut se répéter, car les différentes instances de l'étiquette sont identifiées par leur couleur unique.

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.

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

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

[ { "annotatedResult": { "inputImageProperties": { "height": 533, "width": 800 }, "instances": [ { "color": "#1f77b4", "label": "<Label 1>": }, { "color": "#2ca02c", "label": "<Label 1>": }, { "color": "#ff7f0e", "label": "<Label 3>": }, ], "labeledImage": { "pngImageData": "<Base-64 Encoded Data>" } } } ]

Voir aussi

Pour plus d’informations, consultez les rubriques suivantes.