Приложение: полный код всех проектов

  1. Проект 1. Содержит ли изображение определенный объект?
  2. Проект 2. Выделить объект на изображении
  3. Проект 3. Верно ли выделены объекты на изображении?

Проект 1. Содержит ли изображение определенный объект?

Спецификации:

Входные данные:
{
  "image": {
    "type": "url",
    "hidden": false,
    "required": true
  }
}
Скопировано
Выходные данные:
{
  "result": {
    "type": "string",
    "hidden": false,
    "required": true
  }
}
Скопировано
Входные данные:
{
  "image": {
    "type": "url",
    "hidden": false,
    "required": true
  }
}
Скопировано
Выходные данные:
{
  "result": {
    "type": "string",
    "hidden": false,
    "required": true
  }
}
Скопировано

Блок HTML:

{{img src=image width="100%" height="400px"}}
<div>Есть ли на картинке <b>дорожный знак</b>?<div>
<div> {{field type="radio" name="result" value="OK" label="Да" hotkey="1"}}
{{field type="radio" name="result" value="BAD" label="Нет" hotkey="2"}}
{{field type="radio" name="result" value="404" label="Ошибка загрузки" hotkey="3"}}</div>
Скопировано

Блок JavaScript:

exports.Task = extend(TolokaHandlebarsTask, function(options) {
    TolokaHandlebarsTask.call(this, options);
}, {
    onRender: function() {
        // DOM element for task is formed (available via #getDOMElement())
    },
    onDestroy: function() {
        // Task is completed. Global resources can be released (if used)
    }
});

function extend(ParentClass, constructorFunction, prototypeHash) {
    constructorFunction = constructorFunction || function() {};
    prototypeHash = prototypeHash || {};
    if (ParentClass) {
        constructorFunction.prototype = Object.create(ParentClass.prototype);
    }
    for (var i in prototypeHash) {
        constructorFunction.prototype[i] = prototypeHash[i];
    }
    return constructorFunction;
}
Скопировано

Проект 2. Выделить объект на изображении

Спецификации:

Входные данные:

{
  "image": {
    "type": "url",
    "hidden": false,
    "required": true
  }
}
Скопировано

Выходные данные:

{
  "result": {
    "type": "string",
    "hidden": false,
    "required": true
  }
}
Скопировано

Входные данные:

{
  "image": {
    "type": "url",
    "hidden": false,
    "required": true
  }
}
Скопировано

Выходные данные:

{
  "result": {
    "type": "string",
    "hidden": false,
    "required": true
  }
}
Скопировано

Блок HTML:

{{field type="image-annotation" name="result" src=image}}
Скопировано

Блок JavaScript:

  1. Подключите библиотеку $TOLOKA_ASSETS/js/image-annotation.js (нажмите в блоке Интерфейс задания на странице проекта).

  2. exports.Task = extend(TolokaHandlebarsTask, function (options) {
      TolokaHandlebarsTask.call(this, options);
    }, {
      onRender: function() {
        // DOM element for task is formed (available via #getDOMElement())
      },
      onDestroy: function() {
        // Task is completed. Global resources can be released (if used)
      }
    });
    
    function extend(ParentClass, constructorFunction, prototypeHash) {
      constructorFunction = constructorFunction || function () {};
      prototypeHash = prototypeHash || {};
      if (ParentClass) {
        constructorFunction.prototype = Object.create(ParentClass.prototype);
      }
      for (var i in prototypeHash) {
        constructorFunction.prototype[i] = prototypeHash[i];
      }
      return constructorFunction;
    }
    
    Скопировано

Блок CSS:

.image-annotation-editor__shape-polygon {
display: none;
}
.image-annotation-editor__annotation-layer {
height: max-content;
}
Скопировано

Проект 3. Верно ли выделены объекты на изображении?

Спецификации:

Входные данные:

{
  "image": {
    "type": "url",
    "hidden": false,
    "required": true
  },
  "selection": {
    "type": "json",
    "hidden": false,
    "required": false
  },
  "assignment_id": {
    "type": "string",
    "hidden": true,
    "required": true
  }
}
Скопировано

Выходные данные:

{
  "result": {
    "type": "string",
    "hidden": false,
    "required": true
  }
}
Скопировано

Входные данные:

{
  "image": {
    "type": "url",
    "hidden": false,
    "required": true
  },
  "selection": {
    "type": "json",
    "hidden": false,
    "required": false
  },
  "assignment_id": {
    "type": "string",
    "hidden": true,
    "required": true
  }
}
Скопировано

Выходные данные:

{
  "result": {
    "type": "string",
    "hidden": false,
    "required": true
  }
}
Скопировано

Блок HTML:

{{field type="image-annotation" name="object" annotations=selection}}
 {{field type="radio" name="result" value="OK" label="Верно" hotkey="1"}}
  {{field type="radio" name="result" value="BAD" label="Неверно" hotkey="2"}}
Скопировано

Блок JavaScript:

exports.Task = extend(TolokaHandlebarsTask, function(options) {
    TolokaHandlebarsTask.call(this, options);
}, {
    onRender: function() {
        // DOM element for task is formed (available via #getDOMElement())
    },
    onDestroy: function() {
        // Task is completed. Global resources can be released (if used)
    }
});

function extend(ParentClass, constructorFunction, prototypeHash) {
    constructorFunction = constructorFunction || function() {};
    prototypeHash = prototypeHash || {};
    if (ParentClass) {
        constructorFunction.prototype = Object.create(ParentClass.prototype);
    }
    for (var i in prototypeHash) {
        constructorFunction.prototype[i] = prototypeHash[i];
    }
    return constructorFunction;
}
Скопировано
Блок CSS:
/* disable polygon-editor controls */
.image-annotation-editor__shape-polygon {
  display: none;
}
.image-annotation-editor__annotation-layer {
  height: max-content;
}
Скопировано