如何在d3图形中添加标签到边 [英] How to add label to edges in d3 graph

问题描述

请参阅
http://bl.ocks.org/rkirsling/5001347

它显示一些节点和它们之间的边。你能告诉我们添加什么代码，以及边缘有标签的地方。您可以假定标签的任何合适的位置，您也可以假设任何标签文本。
谢谢。

It shows some nodes and the edges between them. Can you tell what code to add in that and where so that the edges have labels. You can assume any suitable location for the labels and you can also assume any label text. Thank you.

推荐答案

您可以添加标签，就像为链接添加路径一样。所有你需要做的是根据链接连接的两个节点的位置计算位置。代码看起来像这样。

You can add labels just as you add the paths for the links themselves. All you need to do is calculate the position according to the positions of the two nodes the link connects. The code would look something like this.

svg.selectAll("text").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.something; });

请注意，在 tick 也需要更新标签的位置。

Note that in your tick function, you would also need to update the position of the labels.

这篇关于如何在d3图形中添加标签到边的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！