我读到的很多关于 d3.js 和工具提示的内容都提到了图表上的各个点。
相反，我的图表使用一条长路径进行渲染。我想知道如何将鼠标悬停方法应用于这样的路径，然后我将相应地绑定一个工具提示 div
http://jsfiddle.net/ericps/xJ3Ke/6/
svg.append("path")
.attr("class", "area")
.attr("clip-path", "url(#clip)")
.style("fill", "url(#gradient)");
您可以设置一层不可见对象来表示您想要为其提供工具提示的每个点，并向这些对象添加鼠标交互。
我已经用以下内容更新了你的 jsfiddle -
svg.selectAll("circle")
.data(data)
.enter().append("circle")
.attr("r", 5)
.style("fill","none")
.style("stroke","none")
.style("pointer-events","all")
.append("title")
.text(function(d) { return "Date: " + formatDate2(d.date) + " Value: " + d.value; });
这会向每个数据点添加一个圆形元素，并为每个圆形添加一个标题元素。请注意，"pointer-events","all"即使元素不可见也允许鼠标交互
完整的jsfiddle在这里：http://jsfiddle.net/xJ3Ke/9/
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
