Amazon Web Services 文档中描述的 Amazon Web Services 服务或功能可能因区域而异。要查看适用于中国区域的差异，请参阅 中国的 Amazon Web Services 服务入门 (PDF)。

crowd-line

用于在图像上绘制线条的小部件。每条线都与一个标签相关联，输出数据将报告每条线的起点和终点。

请参阅在 CodePen 中使用此 Crowd HTML 元素的 HTML 模板的交互式示例。

以下是使用 <crowd-line> 元素的 Liquid 模板的示例。复制以下代码，并保存到具有 .html 扩展名的文件中。在任何浏览器中打开该文件，进行预览并与该模板进行交互。有关更多示例，请参阅该 GitHub 存储库。

属性

此元素支持以下属性。

header

可选。要在图像上方显示的文本。通常是一个针对工作人员的问题或简单说明。

initial-value

可选。一个 JSON 对象数组，其中每个对象在组件加载时都设置一条直线。数组中的每个 JSON 对象包含以下属性：

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 来跟踪工作人员答案是否已调整过。

labels

必需。一个 JSON 格式的字符串数组，其中每个字符串都是工作人员可以分配给直线的一个标签。

限制：10 个标签

label-colors

可选。字符串数组。每个字符串都是标签的十六进制代码。

name

必需。此小部件的名称。它用作小部件输入（以输出格式表示）的密钥。

src

必需。要在其上绘制直线的图像的 URL。

区域

此元素需要以下区域。

full-instructions

有关如何绘制直线的一般说明。

short-instructions

在醒目位置显示的重要的任务特定说明。

元素层次结构

此元素具有以下父元素和子元素。

输出

inputImageProperties

一个 JSON 对象，它指定正在由工作人员注释的图像的维度。此对象包含以下属性。

lines

一个 JSON 数组，其中包含具有直线标签和顶点的对象。

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

另请参阅

有关更多信息，请参阅下列内容。