同时使用英国皇家空军和setInterval在同一时间运行帆布动画 [英] Canvas animations running at the same time using both rAF and setInterval
问题描述
我有不同组件的动画。
- 一个人走
- 气体填充室
每一个组件都工作得很好时，他们都是靠自己，但是当我尝试这两个都结合起来，则动画只是不工作。
Each of these components works well when they are on their own but when i try to combine the two then the animation just doesnt work at all.
动画的当前状态，燃气工程，因为它应该。然而，男子闪烁进出来看，在某些时候，他是无处可看。
The current state of the animation, the gas works as it should. However the man flickers in and out of view and at some point he is nowhere to be seen.
推荐答案
这里的问题是，你绘制男子每200毫秒，但在画布的其余部分尽快绘制为浏览器已准备就绪，由于 requestAnimationFrame（油漆）; ，这将清除该男子
The problem here is that you're drawing the man every 200 ms, but the rest of the canvas is drawn as soon as the browser is ready, due to requestAnimationFrame(paint);, which will clear the man.
解决方案如下：
- 移动你的助行器的所有东西画成的paint（） - 函数
- 移动从 animationFrames 所有变量的声明 DY 来沃克（）之外 - 的功能，你希望他们是全球性的和函数内不是本地的（既然你会绘制男子在paint（） - 功能）
The solution this:
- move all the painting stuff of your walker into the paint()-function
- move the declaration of all the variables from animationFrames to dy to outside the walker()-function, you want them to be global and not local to within the function (since you'll be drawing the man in the paint()-function)
这篇关于同时使用英国皇家空军和setInterval在同一时间运行帆布动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
