javascript - d3.js 转换（）在浏览器最小化时不起作用

Question

我用来在新数据进入时移动svg元素位置的transition()选择在打开浏览器窗口时完美运行，但是当我打开另一个选项卡或最小化窗口时，transition()函数将svg元素堆积在顶部彼此的。当我打开窗口时，我看到svg元素堆叠在一起。

然而，exit()选择移出屏幕。

Answer 1

D3使用 requestAnimationFrame来实现流畅高效的绘制。这是有关该主题的更多信息。

许多人遇到的基本问题是，当窗口/选项卡在后台时，页面渲染“进入睡眠模式”并且没有提供“动画帧”，即浏览器将停止绘制。

您可以通过使用浏览器可见性 API来控制您的绘图（例如，当页面再次可见时对图表进行完整更新）来解决该“问题” 。有关示例，请参阅相关的 MDN 页面。