Coordinates
General utilities and types for working with and manipulating geographic information or geometries.
LngLat
A LngLat object represents a longitude and latitude coordinate, measured in degrees. These coordinates are based on the WGS84 (EPSG:4326) standard.
SDK JS uses longitude, latitude coordinate order (as opposed to latitude, longitude) to match the GeoJSON specification.
Any SDK JS method that accepts a LngLat object as an argument or option can also accept an Array of two numbers and will perform an implicit conversion. This flexible type is documented as LngLatLike.
Example
const ll = new maptilersdk.LngLat(-123.9749, 40.7736);
ll.lng; // = -123.9749
API reference
Related examples
Point
A Point represents x and y screen coordinates in pixels.
Example
const p1 = new Point(-77, 38); // a PointLike which is a Point
const p2 = [-77, 38]; // a PointLike which is an array of two numbers
API reference
LngLatBounds
A LngLatBounds object represents a geographical bounding box, defined by its southwest and northeast points in longitude and latitude.
If no arguments are provided to the constructor, a null bounding box is created.
Any SDK JS method that accepts a LngLatBounds object as an argument or option can also accept an Array of two LngLatLike constructs and will perform an implicit conversion. This flexible type is documented as LngLatBoundsLike.
Example
const sw = maptilersdk.LngLat(-73.9876, 40.7661);
const ne = maptilersdk.LngLat(-73.9397, 40.8002);
const llb = new maptilersdk.LngLatBounds(sw, ne);
API reference
LngLatLike
A LngLat object, an array of two numbers representing longitude and latitude, or an object with lng and lat or lon and lat properties.
Example
const v1 = new maptilersdk.LngLat(-122.420679, 37.772537);
const v2 = [-122.420679, 37.772537];
const v3 = {lon: -122.420679, lat: 37.772537};
API reference
PointLike
A Point or an array of two numbers representing x and y screen coordinates in pixels.
Example
const p1 = new Point(-77, 38); // a PointLike which is a Point
const p2 = [-77, 38]; // a PointLike which is an array of two numbers
API reference
LngLatBoundsLike
A LngLatBounds object, an array of LngLatLike objects in [sw, ne] order, or an array of numbers in [west, south, east, north] order.
Example
const v1 = new maptilersdk.LngLatBounds(
new maptilersdk.LngLat(-73.9876, 40.7661),
new maptilersdk.LngLat(-73.9397, 40.8002)
);
const v2 = new maptilersdk.LngLatBounds([-73.9876, 40.7661], [-73.9397, 40.8002])
const v3 = [[-73.9876, 40.7661], [-73.9397, 40.8002]];
API reference
MercatorCoordinate
A MercatorCoordinate object represents a projected three-dimensional position.
MercatorCoordinate uses the Web Mercator projection (EPSG:3857) with slightly different units:
- The size of 1 unit is the width of the projected world instead of the “mercator meter”
- The origin of the coordinate space is at the northwest corner instead of the middle
For example, MercatorCoordinate(0, 0, 0) is the northwest corner of the mercator world and MercatorCoordinate(1, 1, 0) is the southeast corner. If you are familiar with vector tiles, it may be helpful to think of the coordinate space as the 0/0/0 tile with an extent of 1.
The z dimension of MercatorCoordinate is conformal. A cube in the mercator coordinate space would be rendered as a cube.
Example
const nullIsland = new maptilersdk.MercatorCoordinate(0.5, 0.5, 0);
API reference
Related examples
EdgeInsets
An EdgeInsets object represents screen space padding applied to the edges of the viewport. This shifts the apparent center or the vanishing point of the map. This is useful for adding floating UI elements on top of the map and having the vanishing point shift as UI elements resize.