Crowd HTML Elements de Augmented AI

Los siguientes Crowd HTML Elements solo están disponibles para tareas de flujos de trabajo humano de Augmented AI.

Un widget para permitir la revisión humana de un resultado de análisis de documentos de Amazon Textract.

Atributos

Los siguientes atributos son compatibles con este elemento.

header

Este es el texto que se muestra como encabezado.

src

Este es un enlace a la imagen para que la analice el trabajador.

initialValue

Establece los valores iniciales de los atributos encontrados en la interfaz de usuario de trabajo.

A continuación, se muestra un ejemplo de una entrada de initialValue:


[
            {
                "blockType": "KEY_VALUE_SET",
                "confidence": 38.43309020996094,
                "geometry": {
                    "boundingBox": {
                        "width": 0.32613086700439453,
                        "weight": 0.0942094624042511,
                        "left": 0.4833833575248718,
                        "top": 0.5227988958358765
                    },
                    "polygon": [
                        {"x": 0.123, "y": 0.345}, ...
                    ]
                }
                "id": "8c97b240-0969-4678-834a-646c95da9cf4",
                "relationships": [
                    {
                        "type": "CHILD",
                        "ids": [
                            "7ee7b7da-ee1b-428d-a567-55a3e3affa56",
                            "4d6da730-ba43-467c-a9a5-c6137ba0c472"
                        ]
                    },
                    {
                        "type": "VALUE",
                        "ids": [
                            "6ee7b7da-ee1b-428d-a567-55a3e3affa54"
                        ]
                    }
                ],
                "entityTypes": [
                    "KEY"
                ],
                "text": "Foo bar"
            },
]

blockTypes

Esto determina el tipo de análisis que pueden hacer los trabajadores. Solo se admite KEY_VALUE_SET actualmente.

claves

Esto especifica nuevas claves y el valor de texto asociado que el trabajador puede agregar. Los valores de entrada para keys pueden incluir los siguientes elementos:

importantFormKey acepta cadenas y se utiliza para especificar una sola clave.
importantFormKeyAliases se puede utilizar para especificar alias que son alternativas aceptables a las claves suministradas. Utilice este elemento para identificar ortografías o presentaciones alternativas de sus claves. Este parámetro acepta una lista de una o varias cadenas.

A continuación, se muestra un ejemplo de entrada de keys:


[
      {
        importantFormKey: 'Address',
        importantFormKeyAliases: [
          'address',
          'Addr.',
          'Add.',
        ]
      },
      {
        importantFormKey: 'Last name',
        importantFormKeyAliases: ['Surname']
      }
]

no-key-edit

Esto impide que los trabajadores editen las claves de las anotaciones transferidas mediante initialValue. Esto evita que los trabajadores editen las claves detectadas en sus documentos. Esto es necesario.

no-geometry-edit

Esto impide que los trabajadores editen los polígonos de las anotaciones transferidos mediante initialValue. Por ejemplo, esto impediría al trabajador editar el cuadro delimitador alrededor de una clave determinada. Esto es necesario.

Jerarquía de elementos

Este elemento tiene los siguientes elementos principales y secundarios.

Elementos principales: crowd-form
Elementos secundarios: full-instructions, short-instructions

Regiones

Las regiones siguientes son compatibles con este elemento. Puede usar código HTML y CSS personalizado dentro de estas regiones para dar formato a sus instrucciones para los trabajadores. Por ejemplo, utilice la sección short-instructions para proporcionar ejemplos buenos y malos de cómo completar una tarea.

full-instructions

Instrucciones generales acerca de cómo utilizar el widget.

short-instructions

Instrucciones importantes específicas de la tarea que se muestran en un lugar destacado.

Ejemplo de una plantilla de trabajador que utiliza el elemento crowd

Un ejemplo de una plantilla de trabajador que utiliza este elemento crowd se vería como se indica a continuación.


<script src="https://assets.crowd.aws/crowd-html-elements.js"></script>
{% capture s3_uri %}http://s3.amazonaws.com/{{ task.input.aiServiceRequest.document.s3Object.bucket }}/{{ task.input.aiServiceRequest.document.s3Object.name }}{% endcapture %}

<crowd-form>
  <crowd-textract-analyze-document
    src="{{ s3_uri | grant_read_access }}"
    initial-value="{{ task.input.selectedAiServiceResponse.blocks }}"
    header="Review the key-value pairs listed on the right and correct them if they don't match the following document."
    no-key-edit
    no-geometry-edit
    keys="{{ task.input.humanLoopContext.importantFormKeys }}"
    block-types="['KEY_VALUE_SET']"
  >
    <short-instructions header="Instructions">
      <style>
        .instructions {
          white-space: pre-wrap;
        }
        .instructionsImage {
          display: inline-block;
          max-width: 100%;
        }
      </style>
      <p class='instructions'>Click on a key-value block to highlight the corresponding key-value pair in the document.

If it is a valid key-value pair, review the content for the value. If the content is incorrect, correct it.

The text of the value is incorrect, correct it.
<img class='instructionsImage' src="https://assets.crowd.aws/images/a2i-console/correct-value-text.png" />

A wrong value is identified, correct it.
<img class='instructionsImage' src="https://assets.crowd.aws/images/a2i-console/correct-value.png" />

If it is not a valid key-value relationship, choose No.
<img class='instructionsImage' src="https://assets.crowd.aws/images/a2i-console/not-a-key-value-pair.png" />

If you can’t find the key in the document, choose Key not found.
<img class='instructionsImage' src="https://assets.crowd.aws/images/a2i-console/key-is-not-found.png" />

If the content of a field is empty, choose Value is blank.
<img class='instructionsImage' src="https://assets.crowd.aws/images/a2i-console/value-is-blank.png" />

<b>Examples</b>
Key and value are often displayed next or below to each other.

Key and value displayed in one line.
<img class='instructionsImage' src="https://assets.crowd.aws/images/a2i-console/sample-key-value-pair-1.png" />

Key and value displayed in two lines.
<img class='instructionsImage' src="https://assets.crowd.aws/images/a2i-console/sample-key-value-pair-2.png" />

If the content of the value has multiple lines, enter all the text without line break. Include all value text even if it extends beyond the highlight box.
<img class='instructionsImage' src="https://assets.crowd.aws/images/a2i-console/multiple-lines.png" /></p>
    </short-instructions>

    <full-instructions header="Instructions"></full-instructions>
  </crowd-textract-analyze-document>
</crowd-form>

Salida

A continuación se muestra un ejemplo de resultado para este elemento. Encontrará una explicación detallada de este resultado en la documentación de la AnalyzeDocumentAPI de Amazon Textract.


{
  "AWS/Textract/AnalyzeDocument/Forms/V1": {
    blocks: [
      {
        "blockType": "KEY_VALUE_SET",
        "id": "8c97b240-0969-4678-834a-646c95da9cf4",
        "relationships": [
          {
            "type": "CHILD",
            "ids": ["7ee7b7da-ee1b-428d-a567-55a3e3affa56", "4d6da730-ba43-467c-a9a5-c6137ba0c472"]
          },
          {
            "type": "VALUE",
            "ids": ["6ee7b7da-ee1b-428d-a567-55a3e3affa54"]
          }
        ],
        "entityTypes": ["KEY"],
        "text": "Foo bar baz"
      }
    ]
  }
}

Un widget para permitir la revisión humana de un resultado de moderación de una imagen de Amazon Rekognition.

Atributos

Los siguientes atributos son compatibles con este elemento.

header

Este es el texto que se muestra como encabezado.

src

Este es un enlace a la imagen para que la analice el trabajador.

exclusion-category

Al establecer este atributo, crea un botón debajo de las categorías en la interfaz de usuario.

Cuando un usuario elige el botón, se anula la selección de todas las categorías y se desactivan.
Al elegir el botón de nuevo, se vuelven a activar las categorías para que los usuarios puedan elegirlas.
Si envía después de elegir el botón, devuelve una matriz vacía.

Jerarquía de elementos

Este elemento tiene los siguientes elementos principales y secundarios.

Elementos principales: crowd-form
Elementos secundarios: full-instructions, short-instructions

AWS Regiones

Este elemento admite AWS las siguientes regiones. Puede usar código HTML y CSS personalizado dentro de estas regiones para dar formato a sus instrucciones para los trabajadores. Por ejemplo, utilice la sección short-instructions para proporcionar ejemplos buenos y malos de cómo completar una tarea.

full-instructions

Instrucciones generales acerca de cómo utilizar el widget.

short-instructions

Instrucciones importantes específicas de la tarea que se muestran en un lugar destacado.

Ejemplo de plantilla de trabajador con el elemento crowd

Un ejemplo de una plantilla de trabajador que utiliza el elemento crowd sería el siguiente.


<script src="https://assets.crowd.aws/crowd-html-elements.js"></script>
{% capture s3_uri %}http://s3.amazonaws.com/{{ task.input.aiServiceRequest.image.s3Object.bucket }}/{{ task.input.aiServiceRequest.image.s3Object.name }}{% endcapture %}

<crowd-form>
  <crowd-rekognition-detect-moderation-labels
    categories='[
      {% for label in task.input.selectedAiServiceResponse.moderationLabels %}
        {
          name: "{{ label.name }}",
          parentName: "{{ label.parentName }}",
        },
      {% endfor %}
    ]'
    src="{{ s3_uri | grant_read_access }}"
    header="Review the image and choose all applicable categories."
  >
    <short-instructions header="Instructions">
      <style>
        .instructions {
          white-space: pre-wrap;
        }
      </style>
      <p class='instructions'>Review the image and choose all applicable categories.
If no categories apply, choose None.

<b>Nudity</b>
Visuals depicting nude male or female person or persons

<b>Graphic Male Nudity</b>
Visuals depicting full frontal male nudity, often close ups

<b>Graphic Female Nudity</b>
Visuals depicting full frontal female nudity, often close ups

<b>Sexual Activity</b>
Visuals depicting various types of explicit sexual activities and pornography

<b>Illustrated Nudity or Sexual Activity</b>
Visuals depicting animated or drawn sexual activity, nudity or pornography

<b>Adult Toys</b>
Visuals depicting adult toys, often in a marketing context

<b>Female Swimwear or Underwear</b>
Visuals depicting female person wearing only swimwear or underwear

<b>Male Swimwear Or Underwear</b>
Visuals depicting male person wearing only swimwear or underwear

<b>Partial Nudity</b>
Visuals depicting covered up nudity, for example using hands or pose

<b>Revealing Clothes</b>
Visuals depicting revealing clothes and poses, such as deep cut dresses

<b>Graphic Violence or Gore</b>
Visuals depicting prominent blood or bloody injuries

<b>Physical Violence</b>
Visuals depicting violent physical assault, such as kicking or punching

<b>Weapon Violence</b>
Visuals depicting violence using weapons like firearms or blades, such as shooting

<b>Weapons</b>
Visuals depicting weapons like firearms and blades

<b>Self Injury</b>
Visuals depicting self-inflicted cutting on the body, typically in distinctive patterns using sharp objects

<b>Emaciated Bodies</b>
Visuals depicting extremely malnourished human bodies

<b>Corpses</b>
Visuals depicting human dead bodies

<b>Hanging</b>
Visuals depicting death by hanging</p>
    </short-instructions>

    <full-instructions header="Instructions"></full-instructions>
  </crowd-rekognition-detect-moderation-labels>
</crowd-form>

Salida

A continuación se muestra un ejemplo de resultado para este elemento. Para obtener más información sobre este resultado, consulte la documentación de la API de Amazon DetectModerationRekognition Labels.


{
  "AWS/Rekognition/DetectModerationLabels/Image/V3": {
    "ModerationLabels": [
        { name: 'Gore', parentName: 'Violence' },
        { name: 'Corpses', parentName: 'Violence' },
    ]
  }
}

Aviso JavaScript está desactivado o no está disponible en su navegador.

Para utilizar la documentación de AWS, debe estar habilitado JavaScript. Para obtener más información, consulte las páginas de ayuda de su navegador.

Convenciones del documento

SageMaker Multitud de elementos HTML

Augmented AI