2

キャンバスでアニメーションの背景を実行しようとしています。現在、setTimeoutchrome にエラーが表示されていますUncaught SyntaxError: Unexpected identifier。私はそれを間違ってアニメーション化しているに違いありません。

を削除setTimeoutしてtiles(). だから私は確信しています、それは何かと関係がありますsetTimeout.

誰かが私の手がかりを持っていますか？

function createBackground(){        
        var canvas = document.createElement('canvas'),
            ctx = canvas.getContext('2d'),
            background = $('#game .background')[0],
            rect = background.getBoundingClientRect(), //returns the dimension of background
            gradient,
            m = monster.settings.monsterSize;

        canvas.width = rect.width;
        canvas.height = rect.height;

        /* create checker */
        tile_cols = canvas.width / m;
        tile_rows = canvas.height / m;

        setTimeout(tiles(ctx, m, tile_cols, tile_rows), 300);

        /* add canvas to html element */
        background.appendChild(canvas); 
    }

    function tiles(ctx, m, tile_cols, tile_rows){
        for (var i=0; i<tile_cols; i++){
            for (var j=0; j<tile_rows; j++){
                var x = Math.ceil(Math.random()*3);

                switch(x){
                    case 1:
                        ctx.fillStyle = 'black';
                        break;

                    ....

                    case 3:
                        ctx.fillStyle = '#00080E';
                        break;  
                }

                ctx.strokeStyle = 'black';
                ctx.beginPath(); 
                ...
                ctx.closePath();

                ctx.fill();
                ctx.stroke();

            };
        };      

        return this;
    }
4

1 に答える 1

4

tiles(ctx, m, tile_cols, tile_rows)の結果を の最初のパラメーターに代入していますsetTimeout

に変更します 

setTimeout(function() {
    tiles(ctx, m, tile_cols, tile_rows)
}, 300);

このタスクについては、 requestAnimationFrameを確認する必要があります。ポール・アイリッシュはそれについて良い記事を書きました。

于 2012-08-23T08:51:54.683 に答える