我们如何为d3数据地图创建一个onclick事件?

How can we create an onclick event for a d3 data map?

本文关键字：一个 onclick 事件 创建 d3 地图 数据 我们      更新时间：2023-09-26

我正在建立一个d3数据地图:http://datamaps.github.io/

当我点击一个国家时，我想让边框改变颜色。我如何分配一个onclick事件的d3路径使用数据地图?svg路径似乎缺少CSS ID以及任何标识钩子。

您可以使用JQuery "done:function"并指定on("click")，如下所示:

 done: function(datamap) {
        datamap.svg.selectAll('.datamaps-subunit').on('click', function(geography) {
            alert(geography.properties.name);
        });
    }

详情请参阅https://github.com/markmarkoh/datamaps

您将需要done回调以及updateChoropleth函数。例如，要将每个国家变成黑色，您可以这样做:

done: function(datamap) {
  datamap.svg.selectAll('.datamaps-subunit').on('click', function(geography) {
      var m = {};
      m[geography.id] = '#000000';
      datamap.updateChoropleth(m);
  });
}
相关文章：