CODEWITHSUNDEEP
javascriptjqueryjvectormap
user1371896
user1371896

Reputation: 2230

country code conversion issue in jvector map

I am trying to use jvectormap and it takes input in the format ISO 3166-1 alpha-2 country codes.

My input is in the form of country names. I have checked for name to code converters in JavasSript, but there are not any.

I was wondering how the conversion is possible, so that I can match my input with the jvectormap input. Any ideas?

Check the link: http://jsfiddle.net/sprugman/fkRnC/7/

The jvectormap input model is like

var gdpData = {
"US": 25,
"CA": 50,
"RU": 100,
"AO": 200,
"AG": 200,
"AR": 400,
"BR":200 
 };

and also is google geochart better than this one??

Upvotes: 3

Views: 2495

Answers (2)

Mads Hansen
Mads Hansen

Reputation: 66723

You can generate a new map keyed off the country names using the world_mill_en map and the country name values from the name properties:

//Clone the world map that uses ISO-2 keys
var countriesByName = $.extend(true, {}, jvm.WorldMap.maps['world_mill_en']);

countriesByName.paths = {}; //clear the paths

$.each(jvm.WorldMap.maps['world_mill_en'].paths, function(key, obj){
   //create new path entries, keyed by the country name
   countriesByName.paths[obj.name] = obj; 
});  

//Add this new data map, to be loaded
$.fn.vectorMap('addMap', 'world_mill_en_byName',countriesByName);

Then load your data keyed off country names and reference the newly created map:

//data with country name as key
var gdpData = {
    "United States of America": 25,
    "Canada": 50,
    "Russia": 100,
    "Angola": 200,
    "Argentina": 400
};

$(function() {
    $('#map').vectorMap({
        map: 'world_mill_en_byName', //load up the map with country name as key
        backgroundColor: '#eeeeee',
        regionStyle: {
            initial: {
                fill: '#cccccc'
            }
        },
        series: {
            regions: [{
                values: gdpData,
                scale: ['#C8EEFF', '#0071A4'],
                min: 0,
                max: 400,
                normalizeFunction: 'polynomial'}]
        },
        hoverOpacity: 0.7,
        hoverColor: false
    });

    var mapObj = $('#map').vectorMap('get', 'mapObject');
    var steps = 4;
    for (var i = 0; i <= steps; i++) {
        var val = 400 / steps * i;
        var color = mapObj.series.regions[0].scale.getValue(val);
        $('#key').append('<div style="background-color:' + color + ';">' + val + ' - ' + color + '</div>');
    }
});

Applied to the jsfiddle that you had posted: http://jsfiddle.net/hansenmc/fkRnC/8/​

Upvotes: 2

bjornd
bjornd

Reputation: 22943

It's a common request, but it's really hard to solve this problem once and forever just because there are numerous variants to write the names of the countries and even country region. So the solution here could be converting of the names of the countries to country codes using data from wikipedia or any other source.

Upvotes: 1

Related Questions