我正在为此苦苦挣扎,似乎无法找到更多引用资料。
我正在使用由 Google 编写的 requestAnimFrame:
requestAnimFrame = (function() {
return window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function(/* function FrameRequestCallback */ callback, /* DOMElement Element */ element) {
window.setTimeout(callback, 1000/60);
};
})();
我有一个函数“init”来设置我的游戏。然后调用更新,这是调用渲染以绘制到 Canvas 的游戏循环。如果您忽略 requestAnimFrame - 每个单独的部分都可以正常工作。但是,一旦我调用了 requestAnimFrame,我要么得到“太多递归”错误,要么 FF 就崩溃了。
我在update()中的代码如下:
game.update = function()
{
stats.update();
fps.innerHTML = stats.getFPS();
// Render objects
game.render();
// Continue game loop
requestAnimFrame(game.update());
}
stats.update 只是更新 FPS 计数器。所以你可以看到,这个函数做的并不多。我的 game.render 函数只是在 Canvas 上绘制了一堆图 block 并且工作正常。
有什么建议吗?
谢谢!
克里斯
最佳答案
你需要传入函数,而不是调用函数的结果。换句话说,改变这个:
requestAnimFrame(game.update());
对此:
requestAnimFrame(game.update);
目前的方式是进入game.update
,执行它的操作,然后尝试计算表达式:
requestAnimFrame(game.update())
为了评估它,它首先需要评估 requestAnimFrame
的参数:
game.update()
这只是一个函数回调自身,导致无限递归,直到堆栈溢出/太多递归错误。它永远不会调用 requestAnimFrame
,因为它总是评估内部参数。
关于javascript - 游戏循环 requestAnimFrame (javascript/canvas),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5864073/