【问题标题】:D3 force layout graph causes slowness in firefox browserD3 强制布局图导致 Firefox 浏览器运行缓慢
【发布时间】:2013-04-24 00:02:24
【问题描述】:

我有一个动态力图,每 3 分钟运行一次(使用 setInterval 我正在调用更新,按以下顺序开始)

  • viz.update(); //attach new data from server like viz.path.data(data.links),
  • viz.nodes.data(..)
  • viz.enter(); // viz.path.enter().append("path")
  • viz.exit(); // path.exit().remove()
  • force.start();

当我将浏览器打开一段时间后,浏览器速度变慢,并且当我拖动节点时节点移动缓慢。我在这里错过了什么吗..

帮助表示赞赏。 谢谢。

【问题讨论】:

  • 你能发布一个工作小提琴来帮助你吗?
  • 我们在谈论多少个节点?如果您一直在获取新节点,那么您很快就会遇到各种性能限制。
  • 您对 Chrome/Chromium 有同样的问题吗?我发现 d3.js 在那里运行得更好(以使用更多内存为代价)
  • 节点数接近 100。另外,我不会一直获取新节点。一开始如果它是 90,在下一次重新加载时,它的范围会在 90 - 100 之间。

标签: d3.js force-layout


【解决方案1】:

Firefox 中的 SVG 性能比 Webkit/Chrome 和 IE10 慢。

在 Firefox 中的性能仍然不错。您可以尝试一些方法。

  • 确保您没有留下未使用/空的元素(如 s),并妥善清理所有内容。太多的元素会很快影响你的表现。
  • 减少使用不透明度的节点数量,尽量少用。
  • 减少元素的数量。

我也做过一件事,但不确定是否有帮助,就是在再次调用 force.start() 之前调用 force.stop()。

【讨论】:

  • 我现在正在使用 d3 和 angular 处理一组复杂的交互式图表。除了 IE
猜你喜欢
  • 2014-05-17
  • 1970-01-01
  • 2013-07-15
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-08-10
  • 1970-01-01
  • 2011-10-11
相关资源
最近更新 更多