Spring Graph 算法 w 节点大小

Posted 2023-02-19

【中文标题】Spring Graph 算法 w 节点大小

【英文标题】：Spring Graph Algorithm w Node size

【发布时间】：2011-09-19 05:25:42

【问题描述】：

我需要做一些图形布局绘图，并且一直在研究使用类似 Spring 布局算法的东西，如实现 here 和讨论 here

但是我的节点都有一个宽度和高度（是一个实体图）。谁能解释我如何将其纳入方程式？

【参考方案1】：

查看您创建的第一个链接，第 240 行：

var repulsiveForce = this.k * this.k / d;

代表排斥势（即物理学）。该数字越大，几何状态的可能性就越小。 d 是两个节点之间的距离，this.k 是弹簧刚度。对于距离d = 0，这种潜力变得无限。

您希望将这种潜力转化为一定长度（您的盒子的大小），因此将d 替换为d - length。这意味着，斥力在距离length 处变为无限大。仍然存在问题，排斥力会随着距离而减小，小于length，必须通过一些条件来覆盖：

if (d + 0.0001 < length) repulsiveForce = bigbigNumber;

我添加了0.0001，所以排斥力永远不会变成无限，只会变大，因为计算机不能很好地处理无限。

【参考方案2】：

以Graph javascript Framework 为起点，您可以执行以下操作。我假设类Node 已被属性width 和height 扩展。然后，在函数layoutRepulsive 中，必须更改计算节点距离的表达式以尊重这些大小：

var dx = Math.max(0, Math.abs(node2.layoutPosX - node1.layoutPosX) - 0.5*(node2.width+node1.width));
var dy = Math.max(0, Math.abs(node2.layoutPosY - node1.layoutPosY) - 0.5*(node2.height+node1.height));

maximum 函数强制将 0 作为距离的最小可能值，即使它们的边界框重叠。