algorithm - 为 'good looking' 图形布局安排节点边

Question

我遇到了论文 NodeTrix 中提出的以下图表布局:

可见的大块是节点本身(一种子图的复合节点)。

我看到边缘是某种曲线，它们之间似乎并没有相交太多。此外，节点和边之间不相交。顺便说一句，论文不会谈论它。

我希望实现这种可视化。我有以下疑问:

Q1。这是一些特定的算法来安排节点-边缘，以便图形看起来不错，如本文所示？一般还有其他算法吗？

Q2。上面显示的弯曲边缘是否也有一些特殊算法？

如果有人能直观地找出上图中的确切算法就太好了，但一些通用的类似算法也应该可以。

Answer 1

一个算法是Force-directed graph drawing .它会产生与发布的图片非常不同的输出，但它很受欢迎，可能会给你 a place开始looking .

老实说，我怀疑显示的图形是手动布局的。

编辑:回复评论

在示例中，所有节点都是方框，边开始/结束对角线到方框的边。一种方法可能是

1. 使用力方向放置盒子(或者可能是它的一些自定义版本，力取决于盒子的大小)
2. 想象一下直接在盒子中心之间的“导向边”
3. 计算引导边与框相交的位置，并将其用作实际绘制边的起点/终点。
4. 使真正的边从边开始对角线，并使用bezier curves绘制曲线。

您可能希望将其表示为某种矢量格式，具有 bezier cures built in, e.g., svg .