0

请参见

bl.ocks.org/rkirsling/5001347

单击画布中的任意位置。它创建一个新节点。将鼠标从一个节点拖到另一个节点。它在节点之间创建一个箭头。我希望在创建箭头后将文本显示为箭头的标签。文本应仅附加到该箭头。在其中添加什么代码以及在哪里添加？

请参阅我提到的示例 (bl.ocks.org/rkirsling/5001347) 中的以下代码行：

link = {source: source, target: target, left: false, right: false};
    link[direction] = true;
    links.push(link);

在那之后，我添加了以下内容

linkLabels = svg.selectAll("link").data(links).enter()
    .append("text")
.attr("x", function(d) { return d.source.x + (d.target.x - d.source.x)/2; })
    .attr("y", function(d) { return d.source.y + (d.target.y - d.source.y)/2; })
.text(function(d) {return (d.source.id + "-" + d.target.id);});

它附加文本，但问题是每次创建链接时，它都会将文本附加到该链接以及所有其他链接。因此，文本多次附加到许多链接。我希望文本只应附加到刚刚创建的链接。怎么做？我什至用“.link”替换了“链接”，但现在没有显示任何文字。

4

1 回答 1

0 
linkLabels = svg.selectAll("link").data(links).enter()

您确定要计算<link>元素的数据连接吗？这些用于样式表等。也许你的意思是 svg <line>？还是一.link堂课？

如果不是这样简单，可能是您调用 .data()，它会返回所有新的数据连接。尝试将键函数作为第二个参数传递给 .data() 以匹配您的数据和元素最初的匹配方式。像下面这样简单的东西可以做到：

通过不传入此函数，您将按索引将所有数据与元素配对，这与此相同：

   .data(force.links(), function(d, i) { return i })

您现有的联接可能已经以某种方式匹配，而不是按索引。

D3.js API - selection.data()

于 2013-11-01T06:21:28.187 回答