Datamaps D3 done function Link

Question

I want that if you click to a link in Datamaps (D3), you get to a special Link, but this should be just possible, if the variable blogentries is >0 or is set.

My Code:

 <script> var map = new Datamap({ element: document.getElementById('worldmap'), responsive: true, geographyConfig: { highlightOnHover: false, popupOnHover: false }, fills: { 'VISITED': '#13304F', defaultFill: '#d6e5f5' }, data: { 'FIN': { fillKey: 'VISITED', blogentries: 1 }, 'AUT': { fillKey: 'VISITED', blogentries: 1 }, }, done: function(datamap) { datamap.svg.selectAll('.datamaps-subunit').on('click', function(geography) { if (data.blogentries > 0) { window.location = "https://www.link.com/" + (geography.properties.name); } }); } }); // Pure JavaScript window.addEventListener('resize', function() { map.resize(); }); // Alternatively with d3 d3.select(window).on('resize', function() { map.resize(); }); // Alternatively with jQuery $(window).on('resize', function() { map.resize(); }); </script> 

Thx for your help

Answer 1

try

if (d3.select(geography).datum().blogentries > 0) {
    // ....
}

Edit

You have to put the map-fill-data in a separate variable and use the geography.id to get the value for blogentries

var mapData = {
  'FIN': {
    fillKey: 'VISITED',
    blogentries: 1
  },
  'AUT': {
    fillKey: 'VISITED',
    blogentries: 1
  },
};
var map = new Datamap({
  element: document.getElementById('worldmap'),
  responsive: true,
  geographyConfig: {
    highlightOnHover: false,
    popupOnHover: false
  },
  fills: {
    'VISITED': '#13304F',
    defaultFill: '#d6e5f5'
  },
  data: mapData,
  done: function(datamap) {
    datamap.svg.selectAll('.datamaps-subunit').on('click', function(geography) {
      if (mapData[geography.id] && mapData[geography.id].blogentries > 0) {
        window.location = "https://www.test.com/" + (geography.properties.name);
      }
    });
  }
});