【问题标题】:d3js Force layout multiple arcs with arrowsd3js 用箭头强制布局多个弧
【发布时间】:2016-11-13 11:40:17
【问题描述】:

我的问题基于以下示例: 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"},

【问题讨论】:

标签: javascript d3.js svg force-layout


【解决方案1】:

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

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 语句来区分两个链接具有相同源和目标的情况。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2019-09-02
    • 2018-12-26
    • 2014-02-15
    • 1970-01-01
    • 2019-01-08
    • 2012-06-22
    • 2015-12-04
    相关资源
    最近更新 更多