@project-one/map-library
TypeScript icon, indicating that this package has built-in type declarations

7.2.7 • Public • Published

@project-one/map-library

Вспомогательная библиотека Digimap для инициализации и работы со слоями карты Mapbox

О работе с Mapbox можно почитать на Вики

Installation

npm install @project-one/map-library --save

Usage

  • Init the map
import MapController from '@project-one/map-library';

// ACCESS_TOKEN: https://docs.mapbox.com/help/how-mapbox-works/access-tokens/
const mapController = new MapController({ token: ACCESS_TOKEN, id: 'map', lang: 'ru' });
const map = mapController.render().getJSMap();
  • Add MapboxDraw to map
import MapboxDraw from '@mapbox/mapbox-gl-draw';
import { MAPBOX_DRAW_STYLES } from '@project-one/map-library';

const drawControl = new MapboxDraw({
    displayControlsDefault: false,
    styles: MAPBOX_DRAW_STYLES,
});
map.addControl(drawControl);

MapController methods

  • render - Render the map canvas. Optionnally get mapboxgl.LngLatBoundsLike param as initial map view bounds
  • getJSMap - Get mapboxgl map instance

Symbol layers

Start layer id with "digimap_" for symbol layer to prevent hiding the text.

Bad:

map.addLayer({
    id: 'drones',
    type: 'symbol',
    ...
}

Good:

map.addLayer({
    id: 'digimap_drones',
    type: 'symbol',
    ...
}

map.addLayer({
    id: 'flight',
    type: 'line',
    ...
}

Helpers

Layer

  • hideLayer - Hide the layer by layerId
  • paintZonesLayer - Show the layer. add layer to map unless map includes layer
  • addLayer - Add layer to map
  • removeLayerIfExist - Remove layer from map if map includes this
  • showMyPosition - Add map marker at my current position
  • jumpToBounds - Focus map to bounds
  • getLayerOptById - Get layer options by layerId (exclude source data).
  • addSource - Add source as @turf/turf.FeatureCollection on map
  • drawZoneLayers - Toggle layer visibility by drawCondition. Adding layer and this source unless map include this
  • updateLayerHeight - Update layer source features height

MapboxDraw Layer

  • addCircleLayer - Add circle layer to map
  • addPolygonLayer - Add polygon layer to map
  • addCorridorLayer - Add corridor (linestring) layer to map

Map helpers

  • getCurrentMPP - Function that return meters per pixel at current map zoom level
  • waitMapIsLoaded - Function that return promise. Resolved when map is loaded all styles

Feature helpers

  • convertInputFeatureToPolygon - Convert MapboxDraw figure into geojson.Feature (turf Polygon)

Constants

  • maxZoom - Map max zoom value
  • minZoom - Map min zoom value
  • zoneLayerIds - Available zone layers IDs
  • layersOrder - Order of map layers

Readme

Keywords

Package Sidebar

Install

npm i @project-one/map-library

Weekly Downloads

144

Version

7.2.7

License

ISC

Unpacked Size

270 kB

Total Files

104

Last publish

Collaborators

  • projectone
  • boolat