如何在地球仪d3.js上显示国家/地区名称

tkqqtvp1  于 2022-11-12  发布在  其他
关注(0)|答案(1)|浏览(178)

我目前正在使用d3.js,基本上想显示一个地球仪,当鼠标悬停在各个国家的上方时,它会在div中显示名称。但目前我无法输出名称,因此我不知道如何访问名称,所以我可以在鼠标悬停时输出它们。
这里我需要考虑什么?我想从csv文件中输出国家的名称。
这是我的地球仪:
第一个

6l7fqoea

6l7fqoea1#

一种方法是将CSV名称推送到geoJSON对象中。

loadData[1].forEach(row => {
    const foundGeometry = loadData[0].features.find(e => e.id === row.code);
    if (foundGeometry) foundGeometry.properties.countryName = row.name;
});

然后,假设您有一个div,只需执行以下操作:

div.html(d.properties.countryName);

请注意,这是D3 v6,因此datum必须是mouseOver函数中的第二个参数:

let mouseOver = function(event, d) {

下面是包含这些更改的代码:
第一个

相关问题