1

キャンバスと簡単なアニメーションをいじっています - マップをレンダリングするための簡単なクラスがありました。

 var Map = Class.extend({
        init: function () {
            //Setup stuff       
        },
        DrawMap: function (canvas, camera) {
            //Render the map
        }
    });

私のコアアプリケーションコードもクラスにあります

 var App = Class.extend({

        init: function (canvas) {
             //Load Stuff
        },

        GameLoop: function () {
            this.map.DrawMap(this.canvas, this.camera);
        }

    });

以下のコードを使用すると、これは正常に機能し、マップがレンダリングされます。

    var canvasMap = document.getElementById('cmap');

    app = new App(canvasMap);

    setInterval(function () {
        app.GameLoop();
    }, 100);

ただし、これは理想的ではないことを理解しており、これに変換しようとしています (http://paulirish.com/2011/requestanimationframe-for-smart-animation/)。コードを調整しました。

上記のコードをインデックス ページに追加しました

window.requestAnimFrame = (function () {
    return window.requestAnimationFrame ||
                          window.webkitRequestAnimationFrame ||
                          window.mozRequestAnimationFrame ||
                          window.oRequestAnimationFrame ||
                          window.msRequestAnimationFrame ||
                          function (/* function */callback, /* DOMElement */element) {
                              window.setTimeout(callback, 1000 / 60);
                          };

そして、初期化コードを変更しました（以前は Set Interval to を使用していました）

    var canvasMap = document.getElementById('cmap');

    app = new App(canvasMap);

    requestAnimFrame(function() { app.GameLoop(); });

ここで、いくつかのデバッグに基づいて、App.GameLoop メソッドが 1 回呼び出されます (ゲーム ループ メソッドにログを追加しました)。そして、再び呼び出されません。これは、JS オブジェクトを使用した経験があるためだと思います。私のバックグラウンドは C# なので、これは私にとって比較的新しいものです。

これが一度だけ呼び出される理由は何ですか?

4

1 に答える 1

0

これを修正しました。再帰を見逃しました。

   var initAll = function () {
        $(document).ready(function() {

            var canvasMap = document.getElementById('cmap');

            app = new App(canvasMap);
            mainLoop();
        });
    };

    var mainLoop  = function() {
               requestAnimFrame(mainLoop);
                app.GameLoop();
    };
于 2012-06-16T13:58:30.570 に答える