I must admit that I am new to jQuery and JS but I really like the cool things you can do with jVectorMap. But so far I failed to add one thing: On mouseover/hover normally the name of the state or country is shown. Is it possible to add the related data (e.g. the GDP value)? And / or is it possible to add a legend with the color values of the countries/states? Thanks a lot! Claus

I must admit that I am new to jQuery and JS but I really like the cool things you can do with jVectorMap. But so far I failed to add one thing: On mouseover/hover normally the name of the state or country is shown. Is it possible to add the related data (e.g. the GDP value)? And / or is it possible to add a legend with the color values of the countries/states? Thanks a lot! Claus

• javascript
• jquery
• svg
• mapping
• jvectormap

1 Answer 1

Using the data visualization example you could add in a callback function to show the related figure for the chosen state code. So if your data looked like:

var gdpData = {"ca":34.56 ...}

Then you could do something like...

$('#map').vectorMap({
    colors: colors,
    hoverOpacity: 0.7,
    hoverColor: false,
    onLabelShow: function(event, label, code){
       label.text(label.text() + " (" + gdpData[code] + ")");
    }
});