如何防止d3.js强制布局在恢复/重启时的脉动/弹跳

Question

我有一个d3强制布局,我偶尔会在用户交互中恢复,以使节点移动一点.不幸的是,每次恢复时,这都会产生不希望的(对我来说)弹跳/脉动所有节点的效果.这就好像重力暂时增加了几分之一秒,将所有节点向内拉.

要重新创建,请打开此页面http://bl.ocks.org/mbostock/raw/4062045/,然后force.resume()在控制台中运行.你可以在任何迈克博斯托克的力量bl.ocks例子中看到这种效果.

有办法防止这种情况吗？我试图将所有节点设置为固定一点直到重力恢复正常,但它没有用.

Answer 1

您可以在绘图之前运行前 x 个刻度。这会阻止弹出窗口：

  const simulation = d3.forceSimulation(nodes)
      .force("link", forceLink)
      .force("charge", forceNode)
      .force("center",  d3.forceCenter())
      .tick(2000) // tick 2000 times (enough for the system to rest)
      .on("tick", ticked)
  

;