0

as the title says I want to use JVectorMap and colour regions with one set of data but display label of another value

          $(function(){

$('#world-map-gdp').vectorMap({
  map: 'world_mill_en',
      backgroundColor: 'transparent',
  series: {
    regions: [{
      values: gdpData,

      scale: ['#FFDD00', '#FF0000'],
      normalizeFunction: 'polynomial'
    }]
  },
  onRegionLabelShow: function(e, label, code){
    label.html(label.html()+' (U.S. troops present are '+gdpData[code]+')');
  }
});
      });

then this is a sample of the data I am calling

var gdpData  = {
"US" :3011302, 75,
"IQ" :0, 74,
"IR" :0, 73,
"IF" :0, 72,
"JP" :54437, 71,
"DE" :49104, 70,
"GB" :13062, 69,
"IT" :11963, 68,

so basically I want to colour the US using the value of 75 on the scale and show the value of 3011302 when I hover over.

it would be greatly appreciated if someone out there could lend a hand. thanks.

1 Answers1

0

You should use two sample of data:

var dataForLabel = {
"US" :3011302,
"IQ" :0,
"IR" :0,
"IF" :0,
"JP" :54437,
"DE" :49104,
"GB" :13062,
"IT" :11963 }

var dataForScale = {
"US" :75,
"IQ" :74,
"IR" :73,
"IF" :72,
"JP" :71,
"DE" :70,
"GB" :69,
"IT" :68 }

Then

regions: [{
  values: dataForScale,
  //...

And

onRegionLabelShow: function(e, label, code){
    label.html(label.html()+' (U.S. troops present are '+dataForLabel[code]+')');
}
Forster
  • 81
  • 1
  • 8