使用.attr（）添加数据属性时出现“ TypeError：未定义不是对象”

Question

我正在创建条形图，将鼠标悬停在每个条形上时需要显示工具提示。工具提示必须包含带有栏的日期信息的数据属性。使用.attr（“ data-date”，d => d [0]）我将该属性添加到了条形图，但是在工具提示中使用它时却显示了错误。 （如果删除第53行，工具提示会正常工作。）

a

感谢您的帮助。 小提琴：http://jsfiddle.net/s1tpyuoc/

Answer 1

让我们简化代码并查看拥有的内容：

selection.on("mouseover", (d, i) => {
    tooltip.attr("data-date", d => d[0]);
})

您可能认为这会将d的第一个元素设置为"data-date"的{​​{1}}属性。但事实并非如此：tooltip方法的回调中的第二个d与选择的attr相同

d

而且，由于没有绑定到selection.on("mouseover", (d, i) => { //this datum... -------^ tooltip.attr("data-date", d => d[0]); //...is not the same of this---^ }) 的数据，因此内部tooltip是d。

这里的解决方案是简单地删除该行，或者出于任何原因要设置该属性，执行以下操作：

undefined

这是更新的JSFiddle：http://jsfiddle.net/vxq9gcwr/