mapbox-gl-draw.js
Adds support for drawing and editing features on mapbox-gl.js maps.
Requires mapbox-gl-js@0.27.0 or higher.
Installing
npm install mapbox-gl-draw
Draw ships with CSS, make sure you include it in your build. It can be found on our CDN or at require('mapbox-gl-draw/dist/mapbox-gl-draw.css').
<link rel='stylesheet' href='https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-draw/v0.16.0/mapbox-gl-draw.css' type='text/css' />Usage in your application
When using modules
var mapboxgl = require('mapbox-gl');
var MapboxDraw = require('mapbox-gl-draw');When using a CDN
<script src='https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-draw/v0.16.0/mapbox-gl-draw.js'></script>Example setup
mapboxgl.accessToken = 'YOUR_ACCESS_TOKEN';
var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/streets-v8',
center: [40, -74.50],
zoom: 9
});
var Draw = new MapboxDraw();
map.addControl(Draw)See API.md for complete reference.
Developing and testing
Install dependencies, build the source files and crank up a server via:
git clone git@github.com:mapbox/mapbox-gl-draw.git
npm install
npm start & open http://localhost:9966/debug/?access_token=<token>
Testing
npm run test
Publishing
To github and npm
npm version (major|minor|patch)
git push --tags
git push
npm publish
To add to CDN add the js and css files from the dist folder to mapbox-gl-plugins.
Naming actions
We're trying to follow standards when naming things. Here is a collection of links where we look for inspriation.