为什么我的 d3 force 布局会爆炸

Question

我正在尝试构建一个 d3 强制布局，它大部分都在工作，但动画的第一秒左右有点古怪。我在窗口中间开始所有节点，它们或多或少地到达我想要它们的位置，但他们做的第一件事就是在安顿下来之前冲到窗口边缘或更远。布局最终或多或少地做了我想要它做的事情，但我无法在当前状态下真正向客户展示它，因为一开始它是多么古怪。

我尝试过对重力、电荷、linkDistance 和摩擦值进行了很多调整，但似乎我只能通过改变条件来摆脱这种行为，这样如果我喜欢最终结果，那么路径就是古怪。如果那里的路径不古怪，那么最终的结果就是不好。

   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/

Answer 1

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

完整的演示here。