Mapbox GL Browser Language

Switch map language in Mapbox GL JS to the local browser language.

Usage

mapbox-gl-browser-language 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 JS files.

When using NPM

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

npm install --save mapbox-gl @mapbox/mapbox-gl-browser-language

const mapboxgl = require('mapbox-gl')
const MapboxBrowserLanguage = require('@mapbox/mapbox-gl-browser-language');
const map = new mapboxgl.Map({
    container: 'map',
    style: 'mapbox://styles/mapbox/traffic-night-v2',
    center: [-77.0259, 38.9010],
    zoom: 9
});
map.addControl(new MapboxBrowserLanguage());

API

MapboxBrowserLanguage

Create a new Mapbox GL JS plugin that modifies the layers of the map style to use the 'text-field' that matches the browser language.

Parameters

• options object Options to configure the plugin.
  • options.supportedLanguages Array<string>? List of supported languages
  • options.getLanguageField string? Function that returns the language field to use based on the browser language.

changeLanguage

Change the language field for a style.

Parameters

• style object Mapbox GL style

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