Skip to content

Show and hide traffic layers in your Mapbox GL traffic style

License

Notifications You must be signed in to change notification settings

KristofVDB1/mapbox-gl-traffic

 
 

Repository files navigation

Mapbox GL Traffic Build Status npm

Add a traffic toggle control to Mapbox GL JS.

🌐 Check the demo

demo

Usage

mapbox-gl-traffic is a Mapbox GL JS plugin that you can easily add on top of your map. Check index.html for a complete example.

Make sure to include the CSS and JS files.

When using NPM

Check how to use Mapbox GL JS in a module bundler.

npm install --save mapbox-gl @mapbox/mapbox-gl-traffic
const mapboxgl = require('mapbox-gl')
const MapboxTraffic = require('@mapbox/mapbox-gl-traffic');
const map = new mapboxgl.Map({
    container: 'map',
    style: 'mapbox://styles/mapbox/traffic-night-v2',
    center: [-77.0259, 38.9010],
    zoom: 9
});
map.on('load', () => {
    map.addControl(new MapboxTraffic());
});

Examples

API

Table of Contents

MapboxTraffic

Create a new Mapbox GL JS plugin that allows you to hide and show traffic layers in your map and an optional toggle button.

Parameters

  • options object Options to configure the plugin.
    • options.showTraffic boolean Show or hide traffic overlay by default. (optional, default false)
    • options.showTrafficButton boolean Show a toggle button to turn traffic on and off. (optional, default true)
    • options.trafficSource RegExp The traffic source regex used to determine whether a layer displays traffic or not. (optional, default /mapbox-traffic-v\d/)

toggleTraffic

Toggle visibility of traffic layer.

Develop

Run the linter and watch for changes to rebuild with browserify.

npm install
npm run test
npm run watch

Create a minified standalone build.

npm install
npm run build

About

Show and hide traffic layers in your Mapbox GL traffic style

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 95.1%
  • HTML 4.9%