PixiJS - 设置固定帧速率

Rew*_*ind 7 javascript frame-rate pixi.js

正如标题所说,如何为 PixiJS 设置 25 fps 的固定帧率?

这是我的设置:

g_App = new PIXI.Application(800, 600, { backgroundColor: 0x1099bb });
document.getElementById("canvas-div").appendChild(g_App.view);
Run Code Online (Sandbox Code Playgroud)

我不想做更多的框架。

Rew*_*ind 1

在 @wavemode 关于 PixiJS 使用 requestAnimationFrame 的评论之后,我想我可能必须执行以下操作。(注:如果有更好的解决方案,请留言,否则我会将其标记为答案。)

基本上,如果超过帧速率,请停止任何动画。

var g_TICK = 40; // 1000/40 = 25 frames per second
var g_Time = 0;
Run Code Online (Sandbox Code Playgroud)

然后当我们设置动画时:

// Listen for animate update
g_App.ticker.add(function (delta) {
    // Limit to the frame rate
    var timeNow = (new Date()).getTime();
    var timeDiff = timeNow - g_Time;
    if (timeDiff < g_TICK)
        return;

    // We are now meeting the frame rate, so reset the last time the animation is done
    g_Time = timeNow;

    // Now do the animation

    // rotate the container!
    // use delta to create frame-independent tranform
    container.rotation -= 0.01 * delta;
    g_Bunny0.x += 1;
});
Run Code Online (Sandbox Code Playgroud)

  • 这不是只设置动画的帧速率吗?画布的渲染怎么样?不是还有60FPS吗? (2认同)