Datamaps D3 完成功能 Link

Question

我希望如果你点击 Datamaps (D3) 中的 link，你会得到一个特殊的 Link，但这应该是可能的，如果变量 blogentries >0 或已设置。

我的代码：

<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>

谢谢你的帮助

Answer 1

尝试

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

编辑

您必须将地图填充数据放在一个单独的变量中，并使用 geography.id 获取 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);
      }
    });
  }
});

Datamaps D3 完成功能 Link

Datamaps D3 done function Link

javascript

d3.js

datamaps