d3.js - 避免 d3.js 圆圈重叠

标签 d3.js force-layout

你可以在这个bl.ock中看到http://bl.ocks.org/3012590巴黎有很多地理引用点,大圆圈位于小圆圈上方:

enter image description here

我想要得到类似于http://vallandingham.me/vis/gates/的东西,以便圆圈与其边框紧密相连。

enter image description here

抱歉,我在这段代码中找不到答案,我错过了一些我认为的东西。

有一个简单的解决办法吗?尝试了不同的负电荷力,如果圆圈大小发生变化,就会出现问题(如果巴黎的所有圆圈都变小,那么它们彼此之间就会变得太远)?

最佳答案

如果您的目标是防止重叠,则 detecting collisions是满足该约束的更直接的方法。这将产生比排斥电荷力更精确的结果。这是另一个例子:

您不需要强制布局来完成此操作,尽管两者经常一起使用。您可以对节点进行固定次数的迭代,以解决初始化时的任何冲突。

关于d3.js - 避免 d3.js 圆圈重叠,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11339348/

相关文章:

javascript - 如何通过半径大小将节点定位在中心?

javascript - D3 Firefox 问题显示图表不正确 - 根本不显示任何 SVG

javascript - D3 可折叠树 - 缩放时跳动

javascript - d3.js svg 将符号保存到 Canvas 浏览器输出 <base href ="/">

javascript - 如何显示点击目标的源节点?

d3.js - D3 : Using node attribute for links instead of index in array

javascript - d3 力定向网络的 json 表示

d3.js - D3 力布局 : links and nodes --- z-index(? )

javascript - 如何通过 Google CAJA 传递库?

javascript - 图表中的网格线,本例中如何获取