view.map

Adds a map to your task.

Use this component to set the targets for the tasks with the markers, select the areas with polygons. Specify the position and colors for the elements on the map.

You can set the following map properties: scale, position of the map center, label, and hint for Tolokers.

View example in the sandbox.

Component properties

Name

Type

Description

type*

"view.map"

Set component type

label

string

Label above the component.

center*

string

Determines the position of the map center. Specify the coordinates in the string format, for example, "29.748713,-95.404287", or use the data.location component to set the center of the map to the Toloker's current position.

hint

string

Hint text.

markers

array

Specifies the markers present on the map.

markers[]

object

The list of the markers set on the map.

markers[].color

string

Determines the marker color. Use the hexadecimal values preceded by the # sign to specify the color.

markers[].label

string

The label for the marker that tells Tolokers what this marker is for and helps distinguish it from other markers.

markers[].position*

string

Determines the marker position. Specify the coordinates in the string format, for example, "29.748713,-95.404287", or use the data.location component to set the marker to the Toloker's current position.

polygons

array

Specifies the polygonal objects that you can use to select areas on the map.

polygons[]

object

The list of the polygonal selection areas on the map.

polygons[].color

string

Determines the polygonal selection area color. Use the hexadecimal values preceded by the # sign to specify the color.

polygons[].points

array

The list of the polygonal selection area points.

polygons[].points[]

string

Determines the position and shape of the polygonal selection areas. Specify the coordinates in the string format, for example, "29.748713,-95.404287".

validation

condition

Validation based on condition.

zoom

integer

The map initial scale. Use the values from 0 to 19. Bigger values give a more detailed map view.