3d迷路、矢印を押して移動's game

Click here for free DL of the app version that can save data.

No:29882

107

←

Prev Next

→

3d迷路、矢印を押して移動
Developer User14660｜Date and time 23/12/19 21:50:11
Build time 22.902 sec｜Game capacity 3.098KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>

<head>
    <style>
        body {
            margin: 0;
            overflow: hidden;
        }

#game-container {
            width: 100%;
            height: 100vh;
            display: flex;
            justify-content: center;
            align-items: center;
        }
    </style>
</head>

// キーの入力を処理する関数
        function handleKeyDown(event) {
            var key = event.key;
            var newPlayerX = gameState.playerX;
            var newPlayerY = gameState.playerY;

// 矢印キーの入力に応じて新しいプレーヤーの座標を計算する
            if (key === "ArrowUp" && playerY > 0) {
                newPlayerY--;
            } else if (key === "ArrowDown" && playerY < gameState.maze.length - 1) {
                newPlayerY++;
            } else if (key === "ArrowLeft" && playerX > 0) {
                newPlayerX--;
            } else if (key === "ArrowRight" && playerX < gameState.maze[0].length - 1) {
                newPlayerX++;
            }

// 新しいプレーヤーの座標が通路の場合、プレーヤーの座標を更新する
            if (gameState.maze[newPlayerY][newPlayerX] === 0) {
                gameState.playerX = newPlayerX;
                gameState.playerY = newPlayerY;
            }

// プレーヤーの座標を描画する
            draw();
        }

// ゲームの表示を更新する関数
        function draw() {
            var gameContainer = document.getElementById("game-container");
            var display = "";

// 迷路を表示する
            for (var i = 0; i < gameState.maze.length; i++) {
                for (var j = 0; j < gameState.maze[0].length; j++) {
                    if (i === gameState.playerY && j === gameState.playerX) {
                        // プレーヤーを表示する
                        display += "🚶";
                    } else if (gameState.maze[i][j] === 1) {
                        // 壁を表示する
                        display += "⬛";
                    } else {
                        // 通路を表示する
                        display += "⬜";
                    }
                }
                display += "<br/>";
            }

gameContainer.innerHTML = display;
        }

// キーボードのイベントリスナーを登録する
        document.addEventListener("keydown", handleKeyDown);

// ゲームの表示を初期化する
        draw();
    </script>
</body>

</html>