How to add a Legend to a choropleth map

[luanfonceca]

Hi folks, i managed to implement the map. But I need to implement a legend with a gradient scale of colors. I tried to implement using pure SVG, but it didin't work very well.

Do you people have some example of how to implement the Legend?

[mgorabbani]

Hi Did you able to do it? I need help with same exact thing. Can you tell me how you connect redux tooltip? I am having undifined error. Have no clue where the problem. can you take a look please?

[zimrick]

There are no built-in tools for building legends in react-simple-maps, but using the gradient approach should work. I've been planning to add an example with that, but didn't get around to it yet.

Regarding redux-tooltip, there have been some issues with it more recently. I would recommend using react-tooltip instead? There's an example of how to do this with react-simple-maps: https://github.com/zcreativelabs/react-simple-maps/tree/master/examples/with-react-tooltip.

[mgorabbani]

thanks bro! your suggestion helps!

[MihaiGitHub]

Hello we are also looking to add a legend to our map similar to the one in the picture above. Would also be nice if when hovering over a region the legend would point out where that region stands within the gradient. Any chance we could have an example of adding a legend to the map?