5

キャンバス (& js) でアイソメトリック html5 ゲームを開発しています。私のグリッドは、列 (​​x) と行 (y) で構成されています。

現在、私のプレーヤーはマップを歩くことができますが、座標から座標へとジャンプします。

スプライト アニメーションを使用して、タイルからタイルへとスムーズに移動させようとしています。しかし、私にはその方法がわかりませんし、このメカニズムを説明している記事も見つかりません。もう一度あなたに頼ります!

したがって、これを行う方法を知っているか、これを説明する記事やチュートリアルを知っていれば、それは素晴らしいことです!

前もって感謝します、

ニック・ヴァーハイエン

更新: プレーヤーを歩くために現在使用しているコード

Player.move = function(direction)
{
 var newX = Player.positionX;
 var newY = Player.positionY;

 switch( direction )
 {
    case 'up':
        Player.moveDirection = 'up';
        newY--;
    break;
    case 'down':
        Player.moveDirection = 'down';
        newY++;
    break;
    case 'left':
        Player.moveDirection = 'left';
        newX--;
    break;
    case 'right':
        Player.moveDirection = 'right';
        newX++;
    break;
}

Player.positionX = newX;
Player.positionY = newY;
}

注: プレイヤーが移動している方向を保存しているので、正しい画像を表示できます。

また、EaselJS のようなライブラリは使用していません。ドキュメントや例がほとんどないという単純な理由で、自分ですべてを理解しなければなりません。

4

1 に答える 1

4

時間ベースの移動を使用する必要があります。次の記事を参照してください。

canvas を使用して JavaScript でビットマップ スプライト アニメーションを実行する

于 2012-03-29T13:44:29.383 に答える