如何重新分配图形元素以最大化可读性?

问题描述 投票:2回答:1

我有一个由节点组成的图。每个节点可以有多个父级和/或子级。我想显示该图和节点之间的连接。

但是我不知道如何重新分配节点以最大程度地提高可读性。目前,我面临以下问题:

  • 节点连接彼此交叉太多,即使这是不必要的,也可以逃避
  • 节点之间的连接在视觉上太长
  • 某些连接具有相同的角度,因此它们重叠并成为一条线
  • i列与i-2列之间的连接(并且更远)有时会直接穿过i-1列中的元素

此外,由于列的数量有限,我也只能垂直移动节点,而不能水平移动节点。

为了使自己更容易,我尝试将节点放置为网格状模式。而且我设法按列对它们进行分组。但是随后我需要以某种方式遍历各列,并将它们与其他列进行比较以重新安排内容。而且我不知道从哪里开始。

UPD:我可能是错的,但是我觉得我的图对齐问题与某种最短路径的典型图问题有某种联系。除了在我的情况下,应该同时计算多个路径,并且某些节点只能传递一次。

在下面的图片中,您可以看到我只是通过在纸上涂一些东西(从左到右的方向显示了父子连接)而做出的几乎理想的重新分配。

graph graph-theory graph-algorithm rectangles
1个回答
0
投票

您可以实现force directed drawing。或者,您可以使用已经支持强制方向绘制的图形绘制库,例如D3的force directed layout

enter image description here

© www.soinside.com 2019 - 2024. All rights reserved.