HTML5 Canvas Ghosting动画问题？

Question

我一直在寻找关于如何使用javascript和请求动画框架进行正确的HTML5动画的大量教程，甚至在演示中看起来动画看起来像是重绘的图像会留下一个背后的幻影图像第二个。但后来我看到像微软这样的游戏移植了剪切绳索似乎解决了这个问题。有没有人知道如何使这种画布效果不那么明显？

Answer 1

我猜你遇到的问题是在上一张图像被清除之前正在重新绘制新图像。我建议确保画布已清除，或者至少是重新绘制图像的区域。虽然，我尝试清除整个画布而不是清除画布的特定部分，并且达到一定的尺寸（大约800x600），清除整个画布的速度更快。

我在我的（进行中）游戏中使用canvas：http://www.dacheng.me/dBoom

随意浏览JS源代码！

Answer 2

我认为您正在寻找的是窗口缓冲：

http://en.wikipedia.org/wiki/Multiple_buffering

基本上，我们的想法是使用两个不同的窗口/画布元素，这些元素在完全绘制后互换，以便您在完全绘制的“帧”之间切换。这种技术用于OpenGL和几乎今天存在的任何其他合法图形程序。