我正在使用d3编写模拟演示。我想展示解决方案状态的演变。
如果我在模拟循环中嵌入d3渲染,那么浏览器在结束之前不会显示任何内容。我想这很忙。
我想要实现的是在主循环中进行一些计算,一些d3更新,然后等待所有转换完成。
由于转换是异步的,我无法找到等待它们的方法。
使用setInterval来运行主循环,有点,但不是很好。
有没有“通常”的方法来实现锁定步进d3过渡计算的目标?
答案 0 :(得分:2)
是的,就像你说的那样,如果你的模拟是同步运行的(例如在一个for循环中),那么浏览器永远不会有机会呈现中间状态。
使用setInteval实际上是一个合理的解决方案,但您必须确保间隔至少与最长(基于d3的)转换一样长。
但听起来你真正想要的是通过回调或事件确切地知道转换何时结束,然后调用模拟的步进函数来推进状态。在这种情况下,请在此处阅读:Invoke a callback at the end of a transition。
虽然我从未尝试过这种方法,但我猜测如果你正在转换多个元素,那么转换的end
事件将被多次调用 - 每个转换元素一次。在这种情况下,您必须做一些工作才能将它们合并为一个事件。您可能必须“计算”调用end
事件的次数,并且只有在计数与预期的元素数匹配时才对其执行操作。或者,您可以编写条件代码以仅绑定到单个元素的转换 - 转换从最后开始或预期最后结束的元素。
希望这会有所帮助......
答案 1 :(得分:2)
使用HTML5,您还可以采用不同的方法:在单独的线程Web Worker
中进行模拟,并在每次迭代时将结果传递回主显示线程。
http://www.html5rocks.com/en/tutorials/workers/basics/
事实上,你的应用程序几乎是完美的。