All docs
V21.1
23.1 (CTP)
22.2
22.1
21.2
21.1
20.2
20.1
19.2
19.1
The page you are viewing does not exist in version 19.1. This link will take you to the root page.
18.2
The page you are viewing does not exist in version 18.2. This link will take you to the root page.
18.1
The page you are viewing does not exist in version 18.1. This link will take you to the root page.
17.2
The page you are viewing does not exist in version 17.2. This link will take you to the root page.
Vue
A newer version of this page is available. Switch to the current version.

projection

Specifies the map projection.

Default Value: 'mercator'
Accepted Values: 'equirectangular' | 'lambert' | 'mercator' | 'miller'
Cannot be used in themes.

You can use one of the following out-of-the-box projections:

To set a custom projection, implement two functions (from and to) that convert coordinates between geographical and UI component coordinate systems. In addition, set the projection's aspectRatio.

Custom Projection Demo Floor Plan Demo

aspectRatio

Specifies the projection's ratio of the width to the height.

Type:

Number

Default Value: 1

Extreme points of the UI component coordinate system form a square. Set this property to change the projection's form; for example, make the width more than height.

from

Converts coordinates from [x, y] to [lon, lat].

Type:

Function

Function parameters:
coordinates:

Array<Number>

Two coordinates that represent a point in the UI component coordinate system.
Each coordinate ranges from -1 to 1.

Return Value:

Array<Number>

Two coordinates that represent the same point in the dataSource coordinate system.

to

Converts coordinates from [lon, lat] to [x, y].

Type:

Function

Function parameters:
coordinates:

Array<Number>

Two coordinates that represent a point in the dataSource coordinate system.

Return Value:

Array<Number>

Two coordinates that represent the same point in the UI component coordinate system.
Each coordinate should be in the range from -1 to 1.