javascript - D3 Force Layout - 无重叠链接

Question

我有一个 D3 可视化，其中的节点使用力布局，如下所示。有些线相互交叉，这使得可视化更难理解。如何确保线条不重叠？

我试过修改力布局的参数(电荷、摩擦力、重力)，但没有成功。当前代码如下。也许我需要做一些除了修改力布局以外的事情来实现结果？

force = d3.layout.force()
              .nodes(data_nodes)
              .links(data_links)
              .charge(-3000)0
              .friction(0.6)
              .gravity(0.6)
              .size([width,height])
              .start();

Answer 1

正如 Lars Kotthoff 所说，它可以手动完成(我发现 http://bl.ocks.org/mbostock/3231298#index.html 作为灵感)，但实际上，如果我稍微改变力布局，它可以完成得更简单。

如果我让中心节点与其余节点相比具有相当强的电荷，它们将在节点周围很好地排列成一个圆圈，消除任何重叠:

.charge(function(d, i) { return i==0 ? -10000 : -500; })