Dropdown On Choropleth?

Is it possible to add a dropdown to a choropleth map to change what data is used for an array of z values?

If so, are there any examples of how to do this?

yes: https://codepen.io/etpinard/pen/bYywdG?editors=0010

I think I was writing Plot.ly JS in an older style from your documentation. I used your example and the code loads the JSON data amazingly faster now, thanks! But for some reason ā€œlocationmode: 'USA-statesā€ isnā€™t working now (it was before) and itā€™s displaying it as a global choropleth.

Hereā€™s my code: https://codepen.io/dholger/pen/XVMmyy

Iā€™m assuming a slider works with the choropleth the same way your dropdown example does? Thanks!

You must have made a typo somewhere. Thereā€™s no reason for it to have stopped working. Unfortunately I canā€™t really help you as I donā€™t have access to your data arrays.

I donā€™t believe itā€™s a typo? Because I copied everything from how the code was previously structured.

The old codeā€™s ā€œlocationmode: ā€˜USA-statesā€™ā€ property works and just shows the US: https://codepen.io/dholger/pen/gomdVe

But itā€™s longer and doesnā€™t load as fast as the style of your example. And Iā€™m working off your dropdown example for the other z values.

Thanks for your help!

Any ideas? Just added "locationmode: ā€˜USA-statesā€™ to your example on CodePen. It still displayed as a global map, although you could plot the boundaries of US states.

Would love for it to appear like the US choropleth from my earlier example. Like the one demoed in the documentation: https://plot.ly/javascript/choropleth-maps/#usa-choropleth-map

Iā€™ve found a solution by adding the geo property ā€œscope: ā€˜usaā€™ā€ to only show the US, per your example on codepen: https://codepen.io/etpinard/pen/JKPxQo. Thanks!

1 Like