Ultimate Map
Universal api for different maps.
Examples
Common
Polygon
OSM
Api Contents
Geo
The central class of the API - it is used for get access for other classes.
Usage example
import { Geo, geo } from 'ultimap';
Constructor
| Factory | Description |
|---|
| new Geo(strategy: \<GeoStrategy>) | Create new geo-controller. |
Methods
| Method | Returns | Description |
|---|
| getStrategy() | \<GeoStrategy> | Get the current work strategy. |
| setStrategy(strategy: \<GeoStrategy>) | \<Geo> | Set the current work strategy. |
| byStrategy(strategy: \<GeoStrategy>) | \<Geo> | Create new geo-controller for the strategy. |
| isAllowed() | \<boolean> | Check is the strategy is allowed to work. |
| map | \<Map> | Create new Map controller. |
| marker | \<Marker> | Create new Marker controller. |
| polygon | \<Polygon> | Create new Polygon controller. |
| control | \<MapControlController> | Create new MapControl controller. |
| domEvent | \<DOMEvent> | Create new DOMEvent controller. |
| event | \<GeoEvent> | Create new GeoEvent controller. |
| geocoder | \<Geocoder> | Create new Geocoder controller. |
| preset | \<object> | Returns object with preset controllers. |
| Collections | \<object> | Contains object with Collections controllers and settings. |
Map
The class is used to create a map on a page and manipulate it.
Usage example
import { geo } from 'ultimap';
geo.map.create(document.getElementById('map'), {
center: [57.767131, 40.928349],
zoom: 13,
}).load();
Constructor
| Factory | Description |
|---|
| geo.map.create(el: \<HTMLElement>, options?: \<Map Options>) | Instantiates a map object given an instance of a HTML element and optionally an object literal with Map options. |
Methods
| Method | Returns | Description |
|---|
| create(element: \<HTMLElement>, options: \<Map Update Properties>) | \<Map> | |
| load() | \<Promise\<Map>> | |
| destroy() | \<Promise\<Map>> | |
| updateProperties(options: \<Map Update Properties>) | \<Promise\<Map>> | |
| hasInstance() | \<boolean> | |
| getInstance() | \<object> | |
| setCenter(coords: \<Coords constructor params>) | \<Promise\<Map>> | |
| getCenter() | \<Coords> | |
| setZoom(value: \<number>) | \<Promise\<Map>> | |
| getZoom() | \<number> | |
| setBounds(coords: \<Bounds constructor params>) | \<Promise\<Map>> | |
| getBounds() | \<Bounds> | |
| fitToViewport() | \<Promise\<Map>> | |
| addControl(control: \<object>) | \<Promise\<Map>> | |
| removeControl(control: \<object>) | \<Promise\<Map>> | |
| on(type: \<string>, fn: \<function>) | \<Map> | |
| off(type: \<string>, fn: \<function>) | \<Map> | |
Marker
Marker is used to display icons on the map.
Usage example
import { geo } from 'ultimap';
geo.marker.create([57.767131, 40.928349], {
icon: {
src: './image/map-marker-black.png',
size: [32, 32],
offset: [16, 32],
},
}).addTo(map);
Constructor
| Factory | Description |
|---|
| geo.marker.create(coords: \<Coords constructor params>, options?: \<Marker Options>) | Instantiates a Marker object given a geographical point and optionally an options object. |
Methods
| Method | Returns | Description |
|---|
| getUid() | \<string> | |
| setCoords(coords: \<Coords constructor params>) | \<Promise\<Marker>> | |
| getCoords() | \<Coords> | |
| getBounds() | \<Bounds> | |
| addTo(map: \<Map>) | \<Marker> | |
| remove() | \<Marker> | |
| getMap() | \<Map> | |
| onMap() | \<boolean> | |
| clone() | \<Marker> | |
| setEditable(value: \<boolean>) | \<Promise\<Marker>> | |
| setData(value: \<object>) | \<Promise\<Marker>> | |
| getData() | \<object> | |
| setIcon(value: \<object>) | \<Marker> | |
| setPreset(value: \<string>) | \<Marker> | |
Polygon
Polygon is used to display area on the map.
Usage example
import { geo } from 'ultimap';
geo.polygon.create([[
[57.79968313324691,40.94109504772947],
[57.77263617196502,40.87964027478026],
[57.740061158662854,40.91328590466307],
[57.74354947014791,41.01868599011228],
[57.798949924647765,41.031903916137665],
[57.79968313324691,40.94109504772947],
]], { }).addTo(map);
Constructor
| Factory | Description |
|---|
| geo.polygon.create(coords: [[<Coords constructor params>]], options?: \<Polygon Options>) | Instantiates a Polygon object given a geographical points and optionally an options object. |
Methods
| Method | Returns | Description |
|---|
| getUid() | \<string> | |
| setCoords(coords: [\<Coords constructor params>]) | \<Promise\<Polygon>> | |
| getCoords() | [\<Coords>] | |
| getBounds() | \<Bounds> | |
| addTo(map: \<Map>) | \<Polygon> | |
| remove() | \<Polygon> | |
| getMap() | \<Map> | |
| onMap() | \<boolean> | |
| clone() | \<Polygon> | |
| setEditable(value: \<boolean>) | \<Promise\<Polygon>> | |
| setData(value: \<object>) | \<Promise\<Polygon>> | |
| getData() | \<object> | |
| setStyle(style: \<Polygon style options>): | \<Promise> | |
| setPreset(value: \<string>): | \<Promise\<Polygon>> | |
| setDrawing(value: \<boolean>): | \<Promise\<Polygon>> | |
Coords
Represents a geographical point with a certain latitude and longitude.
Usage example
import { Coords } from 'ultimap';
const coords = new Coords(57.767131, 40.928349);
Constructor
| Factory | Description |
|---|
| new Coords(lat: \<number>, lng: \<number>) | Creates an object representing a geographical point with the given latitude and longitude. |
| new Coords(lat: \<string>, lng: \<string>) | Creates an object representing a geographical point with the given latitude and longitude. |
| new Coords(coords: \<array>) | Expects an array of the form [number, number]. |
| new Coords(coords: \<object>) | Expects an plain object of the form {lat: number, lng: number}. |
Methods
| Method | Returns | Description |
|---|
| toArray() | \<array> | Returns an array of the form [number, number]. |
| toLatLng() | \<object> | Returns an object of the form {lat: \<number>, lng: \<number>}. |
| toPoint() | \<object> | Returns an object of the form {x: \<number>, y: \<number>}. |
| getBounds() | \<Bounds> | Returns a new Bounds object. |
| toJson() | \<string> | Returns a string with json of the form {lat: number, lng: number}. |
| toString() | \<string> | Returns a string of the form number, number. |
Bounds
Represents a rectangular geographical area on a map.
Usage example
import { Bounds } from 'ultimap';
const bounds = new Bounds([57.767131, 40.928349], [57.867131, 40.1028349]);
Methods
| Method | Returns | Description |
|---|
| toLatLng() | \<array> | Returns an array of the form [{lat: \<number>, lng: \<number>}, {lat: \<number>, lng: \<number>}]. |
| toArray() | \<array> | Returns an array of the form [[\<number>, \<number>], [\<number>, \<number>]]. |
| toPoint() | \<array> | Returns an array of the form [{x: \<number>, y: \<number>}, {x: \<number>, y: \<number>}]. |
| toRectangle(closed: \<boolean>) | \<array> | Returns an array of rectangle points of form [\<number>, \<number>]. |
PolygonCoords
Represents an array of geographical points for polygon.
Usage example
import { PolygonCoords } from 'ultimap';
const coords = new PolygonCoords([[57.767131, 40.928349], [57.867131, 40.1028349], [57.767131, 40.928349]]);
ymapGeo.polygon.create(coords.toArray(), {}).addTo(map);
Constructor
| Factory | Description |
|---|
| new PolygonCoords(coords: \<array>) | Create polygon coords object by array of Coords constructor params. |
| PolygonCoords.createByConcaveHull(coords: \<array>) | Create concave hull of point before create object. |
| PolygonCoords.createByConvexHull(coords: \<array>) | Create convex hull of point before create object. |
Methods
| Method | Returns | Description |
|---|
| toArray() | \<array> | |
| toNormalizeArray() | \<[[[number, number]]]\> | |
| toJson(normalize: \<boolean>) | \<string> | |
| getCount() | \<number> | |
| getBounds() | \<Bounds> | |
| toSimplified() | \<PolygonCoords> | |