/mapbox-gl-draw-geospatial-tools

Advanced tools for geospatial edit and analysis based on Mapbox Gl Draw

Primary LanguageJavaScriptMIT LicenseMIT

NPM Develop Release

Mapbox GL Draw Geospatial Tools

Advanced tools for geospatial edit and analysis based on MapboxGL-Draw.

Internally multiple Mapbox GL Draw plugins are used:

An Image showing toolbar

Or, See Example

Install

npm install @map.ir/mapbox-gl-draw-geospatial-tools

or use CDN:

<script src="https://unpkg.com/@map.ir/mapbox-gl-draw-geospatial-tools"></script>

Usage

geospatial-tools provides MapboxDrawPro class, a wrapper for Mapbox Draw so you can use it just like you would use Mapbox Draw.

import mapboxGl from 'mapbox-gl';
import MapboxDrawPro from '@map.ir/mapbox-gl-draw-geospatial-tools';

const map = new mapboxgl.Map({
    container: 'map', // container id
    style: 'mapbox://styles/mapbox/streets-v11',
    center: [-91.874, 42.76], // starting position
    zoom: 12, // starting zoom
});

const draw = new MapboxDrawPro(option);

MapboxDrawPro supported all options and methods of MapboxGL-Draw

See API.md for complete reference.

also, you can customize options of internally used plugins which are as below in default:

{
    userProperties: true,
    // aditional-tools
    union: true,
    copy: true,
    buffer: true,
    bufferSize: 0.5,
    bufferUnit: 'kilometers',
    bufferSteps: 64,
    length: true,
    lengthUnit: 'kilometers',
    showLength: true,
    area: true,
    showArea: true,

    // snap-mode
    snap: true,
    snapOptions: {
        snapPx: 15,
        snapToMidPoints: true,
    },
    guides: false,
}

License

MIT © map-ir