crowd-alert - Amazon SageMaker

crowd-alert

Message qui informe l'employé d'une situation en cours.

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-alert>. 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> <div id="errorBox"></div> <crowd-keypoint src="{{ task.input.taskObject | grant_read_access }}" labels="['Item A', 'Item B', 'Item C']" header="Please locate the centers of each item." name="annotatedResult"> <short-instructions> Describe your task briefly here and give examples </short-instructions> <full-instructions> Give additional instructions and good/bad examples here </full-instructions> </crowd-keypoint> </crowd-form> <script> var num_obj = 1; document.querySelector('crowd-form').onsubmit = function(e) { const keypoints = document.querySelector('crowd-keypoint').value.keypoints || document.querySelector('crowd-keypoint')._submittableValue.keypoints; const labels = keypoints.map(function(p) { return p.label; }); // 1. Make sure total number of keypoints is correct. var original_num_labels = document.getElementsByTagName("crowd-keypoint")[0].getAttribute("labels"); original_num_labels = original_num_labels.substring(2, original_num_labels.length - 2).split("\",\""); var goalNumKeypoints = num_obj*original_num_labels.length; if (keypoints.length != goalNumKeypoints) { e.preventDefault(); errorBox.innerHTML = '<crowd-alert type="error" dismissible>You must add all keypoint annotations and use each label only once.</crowd-alert>'; errorBox.scrollIntoView(); return; } // 2. Make sure all labels are unique. labelCounts = {}; for (var i = 0; i < labels.length; i++) { if (!labelCounts[labels[i]]) { labelCounts[labels[i]] = 0; } labelCounts[labels[i]]++; } const goalNumSingleLabel = num_obj; const numLabels = Object.keys(labelCounts).length; Object.entries(labelCounts).forEach(entry => { if (entry[1] != goalNumSingleLabel) { e.preventDefault(); errorBox.innerHTML = '<crowd-alert type="error" dismissible>You must use each label only once.</crowd-alert>'; errorBox.scrollIntoView(); } }) }; </script>

Attributes

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

dismissible

Commutateur booléen qui, s'il est présent, autorise la fermeture du message par l'employé.

type

Chaîne qui spécifie le type de message à afficher. Les valeurs possibles sont « info » (information) (par défaut), « success » (réussite), « error » (erreur) et « warning » (avertissement).

Hiérarchie des éléments

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

  • Éléments parents: crowd-form

  • Éléments enfants : aucun

Voir aussi

Pour plus d’informations, consultez les rubriques suivantes.