javascript - D3 强制布局 : How to maintain a given minimum distance between nodes?

Question

我正在使用强制布局。通过在 div 元素内单击来创建新的 d3 节点。节点在单击时创建。节点是大小为 50 像素 x 50 像素的矩形。创建节点后，我立即将其固定属性设置为 true，这样它就不会自行移动。我不是在调用 force.drag。可以通过按住 ctrl 键并拖动节点来移动节点。可以通过将鼠标(不按住 ctrl 键)从一个节点拖动到另一个节点来创建边。

现在，我想添加以下功能。任何两个节点之间的最近距离应大于某个最小值。您可以为最小距离假设任何正值。让我们假设 100 像素。当创建的任何新节点离现有节点太近时，节点应移动，以使任意两个节点之间的距离大于 100 像素。同样，当一个节点移动并与另一个节点靠得太近时，节点也应移动以保持至少 100 像素的距离。

没有条件限制节点向哪个方向移动。一种方法是检查坐标和距离，然后计算要移动哪些节点、移动多少、朝什么方向移动并相应地执行代码。但是，在 d3 中有更简单的方法吗？

Answer 1

考虑仅使用 force.linkDistance() 和 force.linkStrength() 来实现这一点。 linkDistance 表示您的最小距离约束，而 linkStrength(在 [0, 1] 的范围内)确定链接距离的“刚性”程度，或者模拟可以覆盖多少 linkDistance。

force.linkDistance

force.linkStrength