d3.js 力图：链接过多地传播图

Question

我想在力导向图中显示一组节点。这些节点几乎完全是父子关系（几乎是一棵树）。有一些节点有很多子节点，而其他大多数节点都是叶子。 这产生了一个由几个相互连接的节点“岛”组成的结构。问题是，这些“岛”不断散开，特别是当节点被拖动时。

在这里提琴：https://jsfiddle.net/50oz3xtr/ 我一直在尝试以下块中的不同设置：

var simulation = d3.forceSimulation()
.force("link", d3.forceLink().id(function(d) { return d.id; }))
.force("charge", d3.forceManyBody())
.force("center", d3.forceCenter(width / 2, height / 2));

但没有运气（力量，距离最小......）

我的问题是： - 我怎样才能在链接上设置“最大长度”，所以图表不会传播太多？ - 有没有办法为链接设置“固定”长度？

Answer 1

您可以做的是在模拟将尝试优化到的每个链接上设置“理想”长度。

为此，请将距离方法链接到“链接”力的末尾 - api reference

例如

.force("link", d3.forceLink().id(function(d) { return d.id; }).distance({x}));

您还可以将函数传递给距离方法，该方法允许您在逐个链接的基础上改变理想距离。

另外，请记住，您有不止一种力作用于此，因此其他力可能会“干扰”您的链接力。我会考虑在每个链接上使用“强度”设置，并考虑使用“碰撞”力而不是多体。

使用每个力的参数应该会得到你想要的结果。