当鼠标悬停在d3.layout.force的链接上时显示提示信息

Question

如何在D3有向图布局中通过鼠标悬停实现链接的工具提示？我正在修改D3力导向图示例，因此使用以下代码设置节点工具提示非常简单：

    node.append("title")
        .text(function(n) {
            return n.id;
        });

尝试使用类似的技术处理链接并没有产生鼠标悬停提示：

    var link = svg.selectAll("line.link")
        .data(json.links)
        .enter().append("line")
        .attr("class", "link")
        .style("stroke-width", function(d) {
            return 4;
        });

link.append("title")
    .text(function(n) {
            return n.info;
        });

- softweave

Answer 1

您可以在Mike Bostock在Google Groups线程中提出的不同解决方案中找到答案“在d3.svg.line上单击或移动鼠标时显示值”

- Paolo Bozzola

Answer 2

我认为您需要结合以下两个答案：d3js：_on()_没有将当前数据对象发送到onmouse函数和使用svg路径生成的柱状图添加工具提示。两者都有可供尝试的jsFiddles。

- Superboggly

Answer 3

将链接标题设置为上面所示确实会导致鼠标悬停工具提示——只要您让鼠标在链接的任何部分悬停几秒钟。

- softweave