d3js用箭头强制布局多个弧

时间:2016-07-11 13:36:21

标签: javascript d3.js svg force-layout

我的问题基于以下示例: http://bl.ocks.org/mbostock/1153292

如果我使用相同的源和目标创建两个链接,请说

{source: "Microsoft", target: "HTC", type: "licensing"},
{source: "Microsoft", target: "HTC", type: "suit"},

然后两个链接将相互叠加,只有一个链接可见。如何重写代码,以便在这种情况下,两个链接将形成一个循环,就像两个具有反向源和目标的链接一样,例如

{source: "Microsoft", target: "Motorola", type: "suit"},
{source: "Motorola", target: "Microsoft", type: "suit"},

1 个答案:

答案 0 :(得分:0)

好的,我自己找到了这个解决方案。在

function linkArc(d) {
  var dx = d.target.x - d.source.x,
      dy = d.target.y - d.source.y,
      dr = Math.sqrt(dx * dx + dy * dy);
  return "M" + d.source.x + "," + d.source.y + "A" + dr + "," + dr + " 0 0,1 " + d.target.x + "," + d.target.y;
}

如果" 0 0,1 "部分更改为" 0 0,0 ",则会更改弧的手征性,因此需要使用if语句来区分具有相同源和目标的两个链接的情况。

相关问题