CODEWITHSUNDEEP
javascriptjqueryjquery-pluginsjvectormap
Lethysek
Lethysek

Reputation: 39

Getting country name from jVectormap World Map

How i can get name of clicked country from jVectormap?

I using simple code, added alert to show the name of clicked country but doesn't work.

jQuery('#vmap').vectorMap({
    map: 'world_en',
    backgroundColor: '#e9e9e7',
    color: '#dfdfdd',
    hoverOpacity: 0,
    selectedColor: '#5f8b98',
    hoverColor: '#5f8b98',
    enableZoom: true,
    showTooltip: true,
    values: sample_data,
    scaleColors: ['#dfdfdd'],
    onRegionClick: function (event, code) {
    var map = $('#vmap').vectorMap('get', 'mapObject');
    var name = map.getRegionName(code);
    //ADDED ALERT TO SHOW NAME OF CLICKED COUNTRY
    alert(name);
    },
    normalizeFunction: 'polynomial'
});

Here is the documentation of using script:
http://jvectormap.com/documentation/javascript-api-v1/jvm-worldmap/

Upvotes: 0

Views: 5420

Answers (2)

Abed Putra
Abed Putra

Reputation: 1215

Use this

 onRegionClick:function(event, code) {                        
        var name = (code);                        
        alert(name);                    
        }

All Script

    jQuery('#vmap').vectorMap({
        map: 'world_en',
        backgroundColor: '#e9e9e7',
        color: '#dfdfdd',
        hoverOpacity: 0,
        selectedColor: '#5f8b98',
        hoverColor: '#5f8b98',
        enableZoom: true,
        showTooltip: true,
        values: sample_data,
        scaleColors: ['#dfdfdd'],
        //alert
        onRegionClick:function(event, code) {                         
        var name = (code);                        
        alert(name);                    
        },
        normalizeFunction: 'polynomial'
    });

Upvotes: 0

Robin
Robin

Reputation: 915

What does "it does not work" mean? Do you get an error? Or what do you get in the alert?

Not tested, but you could try to do it this way:

var mymap = new jvm.WorldMap({
  container: $('#vmap'),
  ...
  onRegionClick: function (event, code) {
    alert(mymap.getRegionName(code));
  }
});

Upvotes: 1

Related Questions