D3 Choropeth Map的工具提示问题

Question

我无法在地图的工具提示中显示我的数据，以下代码返回“未定义”。但是，我能够在控制台中查看我的费率。

我做错了什么？

queue()
    .defer(d3.json, "data/provincesCanada.json")
    .defer(d3.csv, "data/data.csv", function(d) { rateById.set(d.id, +d.rate);
    console.log(d.rate) })
    .await(ready);

var tip = d3.tip()
  .attr('class', 'd3-tip')
  .offset([-10, 0])
  .html(function(d) {
    return "<strong>Province</strong> : " + d.rate";
  })
  svg.call(tip);

完整代码在此处：http://bl.ocks.org/fdaudens/41a1fa381783ecd8d9ef

提前谢谢。

Answer 1

您遇到的问题是工具提示附加到省数据，而不是费率csv文件的数据。

因此d函数中的变量.html不包含您期望的内容。以下应该有效：

.html(function(d) {
  return "<strong>Province</strong> : " + rateById.get(d.id);
})

您可以在此fork of your gist中看到它的实际效果。