为什么我的d3强制布局会爆炸

why does my d3 force layout explode

本文关键字：布局 我的 d3 为什么      更新时间：2023-09-26

我正在尝试构建一个d3力布局，它基本上是有效的，但动画的前一秒左右有点古怪。我从窗口中间开始所有节点，它们或多或少地到达我希望它们到达的位置，但它们要做的第一件事是在安定下来之前爆炸到窗口边缘或更远的地方。布局最终或多或少地按照我的意愿进行，但在当前状态下，我无法真正向客户展示它，因为一开始它有多古怪。

我试过对重力、电荷、链接距离和摩擦值感到不安，但似乎我只能通过改变条件来摆脱这种行为，这样，如果我喜欢最终结果，那里的路径就会很奇怪。如果那里的道路不古怪，那么最终的结果就不好。

   force = d3.layout.force()
    .nodes(data.nodes)
    .links(data.edges)
    .size([w, h])
    .charge( -500 )
    .gravity( 1 )
    .linkDistance([50])
    .friction(.9);

这是我对武力声明的最新修订。所以我的问题是，我是在动画开始时无意中做了一些鼓励这种爆炸性的事情，还是这只是它的工作方式，每个人都同意一开始就不要注意到那个小打嗝。

这是一个JSFiddle：http://jsfiddle.net/tsgouros/a5u62udv/同样的事情，放慢速度，这样你就可以看到一开始的混乱：http://jsfiddle.net/tsgouros/a5u62udv/1/

问题是，当您将所有节点放置在同一位置时，初始排斥力会非常强，以至于所有东西都会像您所观察到的那样爆炸。最好将所有内容初始化为随机位置，这样就不会出现这种效果。在您的情况下，可以使用w * Math.random()和h * Math.random()。

在此处完成演示。

相关文章：