【问题标题】:Prevent node overlap in force directed graph防止力有向图中的节点重叠
【发布时间】:2014-06-08 17:11:57
【问题描述】:

我为社交网络分析构建了一个力有向图。

我面临的问题是节点不断相互重叠,

如何防止力有向图中的节点重叠?

这是我的code with dummy data

下面是我的力有向图的图像

如何消除这些节点的重叠?以及如何在链接之间保持至少一些距离以使链接正确可见?

【问题讨论】:

  • @Josh 我已将var q = d3.geom.quadtree(graph.nodes), i = 0, n = nodes.length; while (++i < n) q.visit(collide(graph.nodes[i])); 放入我的图表中,但它仍然是一样的。
  • 你也可以简单地在你的力布局上增加“charge”参数,并可能使其成为节点类型的函数(这样较大的图标比较小的图标更能相互推开)。但是,考虑到您拥有的链接数量,您可能仍然会有重叠的线条。
  • @AmeliaBR 谢谢。它通过增加费用起作用。您也可以提供您的评论作为答案,以便我接受。因此,这将对其他人有益。

标签: javascript d3.js overlap force-layout


【解决方案1】:

有两种方法可以避免 d3 强制布局中的重叠。

首先是调整force object的参数,其中最相关的是“charge”参数。具有负“电荷”值的节点将其他节点推开(与具有正值的节点相比,将其他节点拉得更近),您可以增加电荷量以产生更大的推动力。

“充电”的默认值为 -30,因此您可以从那里调整它,直到获得您想要的效果。没有简单的公式可以确定您想要的值,因为它还取决于其他参数和图表中的链接数量。

如果由于任何原因调整费用对您不起作用(例如,如果您希望节点彼此靠近 - 不相互排斥 - 但仍然不重叠),那么您可以手动检查对于重叠节点,如 Josh 在 cmets 中建议的 this Mike Bostock example

【讨论】:

猜你喜欢
  • 2016-01-20
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-11-09
  • 2018-09-26
  • 2019-04-23
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多