> For the complete documentation index, see [llms.txt](https://docs.mapbox.com/mapbox-gl-js/llms.txt) # Plugins and frameworks Mapbox GL JS plugins include features and functionality that extend the core Mapbox GL JS library. Many plugins are maintained by the Mapbox developer community and welcome questions and contributions on GitHub. > **Note: Help improve this list** > > If you know of a Mapbox GL JS plugin that should be added, removed, or updated here, let us know by using the **Share your feedback** widget on this page. ## User Interface Plugins UI plugins offer features and functionality related to map controls and other things that users can touch or interact with, like draw tools, map export tools, directions and geocoding controls, and more. --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-compare](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-compare.bc9d392.480.png) mapbox-gl-compare Enables users to compare two maps by swiping left and right. [View this project](https://github.com/mapbox/mapbox-gl-compare) [View example](https://docs.mapbox.com/mapbox-gl-js/mapbox-gl-js/example/mapbox-gl-compare/) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-controls](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-controls.d29870e.480.png) mapbox-gl-controls Adds controls for a ruler, style inspector, localization, and style switcher. [View this project](https://github.com/bravecow/mapbox-gl-controls) [View demo](https://korywka.github.io/mapbox-controls/preview/) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-directions](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-directions.0a18d63.480.png) mapbox-gl-directions Adds a control to allow users to plot driving, walking, and cycling directions on the map. Directions API calls are [billable by request](https://docs.mapbox.com/api/navigation/directions/#directions-api-pricing). [View this project](https://github.com/mapbox/mapbox-gl-directions) [View example](https://docs.mapbox.com/mapbox-gl-js/mapbox-gl-js/example/mapbox-gl-directions/) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-draw](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-draw.9e0a46a.480.png) mapbox-gl-draw Adds support for drawing and editing features on Mapbox GL JS maps. [View this project](https://github.com/mapbox/mapbox-gl-draw) [View example](https://docs.mapbox.com/mapbox-gl-js/mapbox-gl-js/example/mapbox-gl-draw/) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-context-menu](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-context-menu.4b60cf3.480.png) mapbox-gl-context-menu Add customizable context menus to Mapbox GL JS. [View this project](https://github.com/aratcliffe/mapbox-gl-contextmenu) [View demo](https://aratcliffe.github.io/mapbox-gl-contextmenu/demo/) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-elevation](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-elevation.bbe4f44.480.png) mapbox-gl-elevation Adds a control that inquiry altitude from terrain RGB tileset. [View this project](https://github.com/watergis/mapbox-gl-elevation) [View demo](https://watergis.github.io/mapbox-gl-elevation/) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-geocoder](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-geocoder.274c150.480.png) mapbox-gl-geocoder Adds a geocoder control to Mapbox GL JS. Geocoding API calls are [billable by request](https://docs.mapbox.com/api/search/geocoding/#geocoding-api-pricing). [View this project](https://github.com/mapbox/mapbox-gl-geocoder) [View example](https://docs.mapbox.com/mapbox-gl-js/mapbox-gl-js/example/mapbox-gl-geocoder/) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-infobox](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-infobox.3037075.480.png) mapbox-gl-infobox Adds a control to display an infobox or a gradient. [View this project](https://github.com/el/infobox-control) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-legend](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-legend.00f1d31.480.png) mapbox-gl-legend Adds a control that shows a legend generated from the map style. [View this project](https://github.com/watergis/mapbox-gl-legend) [View demo](https://watergis.github.io/mapbox-gl-legend/) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-opacity](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-opacity.8d3a2e8.480.png) mapbox-gl-opacity Make multiple tile layers transparent. [View this project](https://github.com/dayjournal/mapbox-gl-opacity) [View demo](https://dayjournal.github.io/mapbox-gl-opacity/) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-style-switcher](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-style-switcher.ef876a0.480.png) mapbox-gl-style-switcher Adds a control to switch between styles. [View this project](https://github.com/el/style-switcher) [View demo](https://codesandbox.io/p/sandbox/elegant-night-wi9v4) --- ![thumbnail image for Mapbox GL JS plugin mapboxgl-minimap](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-minimap.4d434f5.480.png) mapboxgl-minimap Adds a control to show a miniature overview of the current map. [View this project](https://github.com/aesqe/mapboxgl-minimap) [View demo](https://aesqe.github.io/mapboxgl-minimap/) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-globe-minimap](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-globe-minimap.334c356.480.png) mapbox-gl-globe-minimap Adds a control to show a miniature globe indicating the center point of the current map. [View this project](https://github.com/chriswhong/mapbox-gl-globe-minimap) [View demo](https://chriswhong.github.io/mapbox-gl-globe-minimap/) ## Map Rendering Plugins Map rendering plugins offer features and functionality related to things that appear on a map, like advanced custom layers, map labels, data visualizations, and more. --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-language](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-language.7cf1652.480.png) mapbox-gl-language Automatically localizes the map into the user's language. [View this project](https://github.com/mapbox/mapbox-gl-language/) [View demo](https://mapbox.github.io/mapbox-gl-language/) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-rtl-text](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-rtl-text.e58fedc.480.png) mapbox-gl-rtl-text Adds right-to-left text support to Mapbox GL JS. [View this project](https://github.com/mapbox/mapbox-gl-rtl-text) [View example](https://docs.mapbox.com/mapbox-gl-js/mapbox-gl-js/example/mapbox-gl-rtl-text/) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-traffic](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-traffic.e4b0e44.480.png) mapbox-gl-traffic Hide and show traffic layers on your map with an optional toggle button. [View this project](https://github.com/mapbox/mapbox-gl-traffic) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-animated-popup](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/mapbox-gl-animated-popup.5ce03a5.480.png) mapbox-gl-animated-popup An animated popup component for Mapbox GL JS. [View this project](https://nagix.github.io/mapbox-gl-animated-popup/) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-rain-layer](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/mapbox-gl-rain-layer.892aa4b.480.png) mapbox-gl-rain-layer An animated rain layer for Mapbox GL JS. [View this project](https://github.com/nagix/mapbox-gl-rain-layer) [View demo](https://nagix.github.io/mapbox-gl-rain-layer/) --- ![thumbnail image for Mapbox GL JS plugin deck.gl](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-deckgl.efcc0d7.480.png) deck.gl Adds advanced WebGL visualization layers to Mapbox GL JS. [View this project](https://github.com/uber/deck.gl) --- ![thumbnail image for Mapbox GL JS plugin L7](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-l7.e549192.480.png) L7 Adds large-scale WebGL-powered geospatial data visualization framework to Mapbox GL JS. [View this project](https://github.com/antvis/L7) --- ![thumbnail image for Mapbox GL JS plugin flowmap.blue](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-flowmap-blue.18cea13.480.png) flowmap.blue Render a geographic flow map visualization from a spreadsheet published on Google Sheets. [View this project](https://github.com/FlowmapBlue/flowmap.blue) --- ![thumbnail image for Mapbox GL JS plugin TextureMap](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-texturemap.d30a20b.480.png) TextureMap Textures, patterns, and shapes that make web maps work for people with color vision deficiency. Design colorblind-friendly Mapbox GL maps. [View this project](https://github.com/azavea/texturemap) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-fontawesome-markers](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-fontawesome-markers.c199497.480.png) mapbox-gl-fontawesome-markers Adds Fontawesome icons to Mapbox GL JS default Map Markers. [View this project](https://github.com/chriswhong/mapbox-gl-fontawesome-markers) [View demo](https://chriswhong.github.io/mapbox-gl-fontawesome-markers/) ## Framework Integrations Framework integration plugins can help you use Mapbox GL JS with external frameworks. --- ![thumbnail image for Mapbox GL JS plugin create-mapbox-web-app](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--create-web-app.bbc9f5f.480.png) create-mapbox-web-app A CLI tool to quickly scaffold Mapbox GL JS into popular front end frameworks. Supports: Vanilla JS, React, Angular, Vue and Svelte. Run `npm create @mapbox/web-app` to start building. [View this project](https://github.com/mapbox/create-web-app) --- ![thumbnail image for Mapbox GL JS plugin react-native](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--react-native-mapbox.cb70bdc.480.png) react-native Provides an [React Native](https://reactnative.dev/) wrapper for Mapbox GL JS. [View this project](https://github.com/rnmapbox/maps) --- ![thumbnail image for Mapbox GL JS plugin ngx-mapbox-gl](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-ngx.561f6e3.480.png) ngx-mapbox-gl Provides an [Angular](https://angular.io/) integration for Mapbox GL JS. [View this project](https://github.com/Wykks/ngx-mapbox-gl) --- ![thumbnail image for Mapbox GL JS plugin ember-mapbox-gl](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-ember.0d85b3c.480.png) ember-mapbox-gl Provides an [Ember](http://emberjs.com) integration for Mapbox GL JS. [View this project](https://github.com/kturney/ember-mapbox-gl) ## Utility Libraries Utility library plugins offer features and functionality for tasks like data processing and format conversion, synchronizing objects, or building with convenience methods. --- ![thumbnail image for Mapbox GL JS plugin turf](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-turf.3dd994f.480.png) turf Provides advanced geospatial analysis tools. [View this project](https://turfjs.org/) --- ![thumbnail image for Mapbox GL JS plugin expression-jamsession](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-expression-jamsession.7bebb6c.480.png) expression-jamsession Converts [Mapbox Studio formulas](https://www.mapbox.com/help/studio-manual-styles/#use-a-formula) into [expressions](https://docs.mapbox.com/style-spec/reference/expressions/). [View this project](https://github.com/mapbox/expression-jamsession/) --- ![thumbnail image for Mapbox GL JS plugin simplespec-to-gl-style](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-simplespec-to.251f92d.480.png) simplespec-to-gl-style Converts GeoJSON styles with ["simplestyle-spec"](https://github.com/mapbox/simplestyle-spec/) to a Mapbox GL Style. [View this project](https://github.com/mapbox/simplespec-to-gl-style) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-supported](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-supported.1baaffd.480.png) mapbox-gl-supported Determines if the current browser supports Mapbox GL JS. [View this project](https://github.com/mapbox/mapbox-gl-supported) [View example](https://docs.mapbox.com/mapbox-gl-js/mapbox-gl-js/example/check-for-support/) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-sync-move](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-sync-move.9fd8664.480.png) mapbox-gl-sync-move Syncs movement between two Mapbox GL JS maps. [View this project](https://github.com/mapbox/mapbox-gl-sync-move) --- ![thumbnail image for Mapbox GL JS plugin mapbox-choropleth](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-choropleth.b7930d3.480.png) mapbox-choropleth Create a choropleth layer from a CSV source and a geometry source. [View this project](https://github.com/stevage/mapbox-choropleth) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-utils](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-utils.82b6f0a.480.png) mapbox-gl-utils Manage layers, sources, and properties with syntactic sugar and convenience functions. [View this project](https://github.com/stevage/mapbox-gl-utils) ## Development Tools Development tool plugins offer features and functionality related to the development process, like inspection tools that give you insight into a map's performance or data sources. --- ![thumbnail image for Mapbox GL JS plugin create-mapbox-web-app](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--create-web-app.bbc9f5f.480.png) create-mapbox-web-app A CLI tool to quickly scaffold Mapbox GL JS into popular front end frameworks. Supports: Vanilla JS, React, Angular, Vue and Svelte. Run `npm create @mapbox/web-app` to start building. [View this project](https://github.com/mapbox/create-web-app) --- ![thumbnail image for Mapbox GL JS plugin mapbox-gl-framerate](https://docs.mapbox.com/mapbox-gl-js/assets/ideal-img/plugins--mapbox-gl-framerate.83d16fe.480.png) mapbox-gl-framerate A frame rate control to evaluate map rendering performance. [View this project](https://github.com/mapbox/mapbox-gl-framerate)