Bad Identifier error with the initial-value attribute of the crowd-semantic-segmentation widget in Amazon Mechanical Turk

Question

I am trying to create a Human Intelligence Task (HIT) on the Amazon Mechanical Turk (MTurk) platform, where I would like workers to update semantic segmentation mask that have been created by an algorithm.

Here you can see an example of the autogenerated mask: Sample Image

As you can see, there is a little bit of 'noise' in the mask, that could easily be fixed by workers within a few minutes. I have set-up a semantic segmentation HIT using the crowd-semantic-segmentation widget before on MTurk, which works perfectly fine. In the documentation (https://docs.aws.amazon.com/sagemaker/latest/dg/sagemaker-dg.pdf#sms-ui-template-crowd-semantic-segmentation) , I see that there is an optional argument initial-value, specified as:

A JSON object containing the color mappings of a prior semantic segmentation job and a link to the overlay image output by the prior job. Include this when you want a human worker to verify the results of a prior labeling job and adjust it if necessary.

This is exactly what I am looking for. When I put the example code in my html file to test the syntax of this option,

  initial-value='{
"labelMappings": {
    "Bird": {
      "color": "#ff7f0e"
    },
    "Cat": {
      "color": "#2ca02c"
    },
    "Cow": {
      "color": "#d62728"
    },
    "Dog": {
      "color": "#1f77b4"
    }
  },
"src": {{ "S3 file URL for image" | grant_read_access }}

}'

I get the following bad identifier error:

I would like to point the src attribute to a variable that links to all auto-generated mask images in my S3 bucket. With the "${image_url}" variable, I am able to use a CSV input file containing multiple image file URLs. Now, I try to substitute the "S3 file URL for image" with a "${mask_url}" variable that points to all 'noisy auto-generated masks' in my S3 bucket. I keep getting the same error message for this code:

My HTML code for the HIT can be found below. Can someone help me correctly set-up the initial-value option of the crowd-semantic-segmentation widget, with a variable pointing to the 'prior labeling jobs' that are auto-generated by my algorithm?

Thanks in advance!

EDIT 23/07 Based on the answer of Amazon Mechanical Turk, I have altered my HTML code to the following:

  <crowd-semantic-segmentation
    src="${image_url}"
    labels="['Background', 'Face', 'Hair', 'Beard', 'Brows', 'Eyes', 'Nose', 'Upper Lip', 'Lower Lip', 'Mouth', 'Body Skin', 'Ears', 'Ear Rings', 'Hat', 'Clothes' ]"
    name="annotatedResult"
    header="Color all facial features, clothes and background in the image"
    initial-value='{
    "labelMappings": {
        "Background": {
          "color": "#000000"
        },
        "Clothes": {
          "color": "#00ff00"
        },
      },
    "src" = "${mask_url}" 
    }'
  >

Now, I get a different error:

I am probably mixing up the usage of : and =, " .. " and '{ .. }'. At this point, I am completely lost at the correct usage of the initial-value attribute. Could you please have another look at the correct code and be very precise in the usage of quotes, brackets, colons and equal sign?

Answer 1

Mechanical Turk templates use the ${variableName} syntax to parse variables so your reference to {{ "${mask_url}" | grant_read_access }} is not being parsed correctly.

Similar to how you are injecting the image url itself,

<crowd-semantic-segmentation
 src="${image_url}"
…>

You need to do the same with the mask url in the initial-value attribute:

<crowd-semantic-segmentation
…
initial-value=“
labelMappings: […],
src=“${mask_url}”
…>

Note that the grant_read_access filter is now gone. The grant_read_access filter is used in Amazon SageMaker Ground Truth to provide access to non-public S3 buckets but this functionality isn’t supported in MTurk templates, this means your mask image will need to be publicly accessible.​ If you need your S3 bucket to remain private then I would direct you towards using SageMaker Ground Truth.