A WebGL JavaScript interactive maps library that can render Mapbox vector tiles.

Setup

Install dependencies:

$ npm install

Then build mapbox-gl by running:

$ npm run build           # build dist/mapbox-gl-dev.js
$ npm run production      # build dist/mapbox-gl.js

To serve the debug page:

$ npm start &
$ open http://localhost:3000/debug/?access_token=$MapboxAccessToken

This assumes you have the MapboxAccessToken environment variable set to a Mapbox API token from https://www.mapbox.com/account/apps/. It will watch the source files and automatically rebuild the browserify bundle whenever a change is detected.

Tests are written in tape and can run on Sauce Labs via zuul.

• npm test: local tests run in nodejs - excludes browser tests
• npm run cov: generate test coverage report - excludes browser tests
• npm run test-remote: run all tests on Sauce Labs. requires Sauce Labs credentials in your environment.
• npm run test-browser: run all tests locally in a browser.

API Documentation

npm run docs: generate API docs

Style Reference

Sprite Generation

npm run build-sprite [outname] [inputdirs]: generate an image sprite by running this script on one or more directories of PNG images.

Recommended Reading

Learning WebGL

• Greggman's WebGL articles
• WebGL reference card

GL performance

• Debugging and Optimizing WebGL applications
• Graphics Pipeline Performance

Misc

• drawing antialiased lines
• drawing text with signed distance fields
• label placement
• distance fields