@mapbox/mapbox-gl-traffic
DefinitelyTyped icon, indicating that this package has TypeScript declarations provided by the separate @types/mapbox__mapbox-gl-traffic package

1.0.2 • Public • Published

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.addControl(new MapboxTraffic());

Examples

API

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/)

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

Package Sidebar

Install

npm i @mapbox/mapbox-gl-traffic

Weekly Downloads

2,575

Version

1.0.2

License

BSD-3-Clause

Last publish

Collaborators

  • mbx-npm-ci-production
  • mbx-npm-ci-staging
  • mbx-npm-advanced-actions-production
  • mbx-npm-advanced-actions-staging
  • mbx-npm-09-production
  • mbx-npm-08-production
  • mbx-npm-07-production
  • mbx-npm-06-production
  • mbx-npm-05-production
  • mbx-npm-04-production
  • mbx-npm-03-production
  • mbx-npm-02-production
  • mbx-npm-01-production
  • mbx-npm-02-staging
  • mapbox-npm-01
  • mapbox-npm-02
  • mapbox-npm-07
  • mapbox-npm-03
  • mapbox-npm-04
  • mapbox-npm-09
  • mapbox-npm-05
  • mapbox-npm-06
  • mapbox-npm-08
  • mapbox-npm-advanced-actions
  • mapbox-npm-ci
  • mapbox-npm
  • mapbox-admin
  • mapbox-machine-user