HTML5 Canvas重影动画问题？

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

来源

2012-11-06 Russell Asher

你能更具体吗？举例说明？ – Shmiddty

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

我用帆布我的游戏（在建）：http://www.dacheng.me/dBoom

随意浏览的JS源代码！

来源

2012-11-06 19:58:08 Dacheng

你怎样清理整个画布？ –

context.clearRect（0，0，canvas.width，canvas.height）; – Dacheng

我也在我的代码中完成了这项工作。我要检查是否它的Windows上运行我的Mac Pro导致此刷新率问题。 –

我想你要找的是什么窗口缓冲：

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

基本上想法是使用那些让你切换被绘制完成后，交换两个不同的窗口/画布元素完全画出“框架”之间。这项技术被用于OpenGL以及今天存在的几乎任何其他合法图形程序。

来源

2012-11-06 17:31:20 TMan

我看到很多人在这个想法中混合了requestanimation框架。我想知道IE浏览器如何实现这一目标，因为webgl不在IE中 –

我并不是暗示使用webgl，只是将窗口缓冲的概念从你所说的，可能已经用'requestanimation'框架完成了 - 虽然我是不确定。 – TMan

我只是想知道我可以采取什么措施摆脱这一点，或者如果它的画布具体问题。 –

HTML5 Canvas重影动画问题？

回答

相关问题