D3地图数据标签没有正确显示

D3 Map data label not correctly showing

本文关键字：显示 地图 数据 标签 D3      更新时间：2023-09-26

我试图显示一个地图，当鼠标悬停在它显示的状态名称和数据绑定到我的数据对象指定的状态

Codepen: http://codepen.io/jacob_johnson/pen/ORqwEL?editors=1010

我的问题是让数据正确显示后的状态名称文本-我只是得到一个未定义的变量。数据根本什么都没有显示。我不知道如何正确地获得这些数据，因为我认为这种方法会起作用。下面是它调用数据的方式:

... AT LINE 353 of CODEPEN LINK
.on("mousemove", function(d) {
        var html = "";
        html += "<div class='"tooltip_kv'">";
        html += "<span class='"tooltip_key'">";
        html += id_name_map[d.id];
        html += "</span>";
        html += "<span class='"tooltip_value'">";
        html += valueById.get(d.id);
        html += "";
        html += "</span>";
        html += "</div>";
        $("#tooltip-container").html(html);
        $(this).attr("fill-opacity", "0.8");
        $("#tooltip-container").show(); ...

我不明白为什么它显示未定义。如有任何帮助，我将不胜感激。

谢谢。

您没有正确访问数据的属性。

data.forEach(function(d) {
  // d doesn't have the properties MAP_STATE and MAP_VALUE
  var id = name_id_map[d[MAP_STATE]];  // change to d[0][0]
  valueById.set(id, +d[MAP_VALUE]);  // change to d[1][1]
});

也改变了量化方法。这应该能解决你的问题

相关文章：