2

我正在尝试绘制 y 轴坐标基于时间的图形布局 - 是否有任何已知的算法可以实现这一点？我研究了 dagre，但似乎排名系统完全基于网络中的边缘。

多个节点可能具有相同或相似的 Y 坐标，因此想法是水平间隔节点以避免节点重叠，同时保持平衡的布局。有点像附加的图像（未显示所有边缘）。根据 Reingold & Tilford 或 Sugiyama 算法，最好尽量减少重叠边缘。有任何想法吗？我已经尝试使用 D3 强制导向布局并固定 y 坐标，它确实有效（尽管有点跳跃），但这种方法的规模不会超过几百个节点。我需要处理最多 5000 个节点和 5000 个边，这意味着实际渲染很可能需要使用 html 画布而不是 svg。

更新：下面应该更好地了解我想要实现的目标（实际上需要一些边缘交叉，但这是一般的想法）。

在此处输入图像描述

以上可以从以下 JSON 生成：

nodes: [
{id:1, date: 1531600000, duration: 3600, preds: []},
{id:2, date: 1531603600, duration: 0, preds: [1]},
{id:3, date: 1531603600, duration: 0, preds: [2]},
{id:4, date: 1531603600, duration: 7200, preds: [3]},
{id:5, date: 1531610800, duration: 7200, preds: [4]},
{id:6, date: 1531618000, duration: 0, preds: [5,8]},
{id:7, date: 1531603600, duration: 3600, preds: [1]},
{id:8, date: 1531607200, duration: 3600, preds: [7]},
{id:9, date: 1531600000, duration: 0, preds: []},
{id:10, date: 1531600000, duration: 0, preds: [9]},
{id:11, date: 1531610800, duration: 0, preds: [10,8]},
{id:12, date: 1531610800, duration: 0, preds: [12]}
]

4

0 回答 0