I have been diving into the Mapbox GL JS library lately and am super impressed and excited by the possibilities and capabilities. Currently I am looking for a solution to building choropleth maps, each based on a different indicator field which could be selected by toggle-button or dropdown.

I've come across an example that is similar to what I have in mind, but I am wondering if this might be done more efficiently with the advent of data-driven styling.

Another goal would be to generate natural breaks values (or other classification method) dynamically when an indicator field is selected based on the range of data, and then push these values to a legend.

Finally, joining data to a google sheet for field/indicator values would be amazing, but I don't know if this sort of join of the data to a google sheet is possible for polygon data. However it is done with X, Y point data in several examples here using util.getJSON.

Data-driven styling for fills example.

1 Answer 1


Here's an example of a dynamic Mapbox- GL. It uses an AJAX Get from GEOJson source. The source is merely a static .json file that is retrieved on mapload.

One thing to consider is something after mapload - like what if you move the map or zoom in so it can change the points you see? There you would use something like moveend (see mapbox gl API)

Anyway, here's the simple example :


The next step you may want to do is a database dynamic approach
- that will use an AJAX Post approach where the map will send info to, say a stored procedure, and will return map data (like points or polygons) in JSON format.

  • Sorry, I went back and re-read your question and am not sure I answered the question correctly. The above example will probably point you in the direction of AJAX loading. I can provide another example (or update the current one ) to reflect map point changes when the map is zoomed or moved. I can tell you, though, I've experienced problems in the past when I've done BIG maps w choropleth stops like the example you provided. I found the map very slow. I got around it by creating the .json map(polygons) w/ the colors included (pre-computed) - it loaded and moved way faster.
    – kremzeek
    Feb 8, 2017 at 21:26

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.