元素之间的链接悬停

Linked hover between elements

本文关键字：悬停 链接 之间 元素      更新时间：2023-09-26
如何使用

d3 检索和使用非 svg DOM 元素的 title 属性？

在

我正在处理的这个 D3 示例中，当用户将鼠标悬停在焦点国家/地区上时，相应的标题框也会进入悬停状态：

http://bl.ocks.org/wboykinm/6967409

但是，当我尝试以另一种方式重复它（悬停标题框时更改正确国家/地区的状态）时，我得到"无法读取未定义的属性"。在这一点上，我已经尝试了几十种方式定义它，它只是没有返回国家/地区名称值。问题似乎源于这一行：

b.on("mouseover", function(d) {
  d3.selectAll("[title=" + d.title + "]").classed("countryActive",true);
});

其中"b"是每个标题框：

b = d3.selectAll(".mminfo");

如果有人能指出一定是一个非常基本的语法错误，我会很兴奋。谢谢！

问题是您尝试访问绑定到元素的数据（通过 d ），而没有绑定元素。也就是说，未定义d，因为您手动创建.mminfo元素，而不使用 D3 .data().enter()模式。

标题位于这些元素的属性中，因此您需要更改的只是d.title this.title。这里的工作示例。

相关文章：