エムブレム警察

このプログラムでは、「エムブレム警察」というタイトルのゲームを実装しています。プレイヤーは指で画面をスワイプすることで、プレイヤーキャラクターを移動させることができます。移動範囲は画面内に制限されており、プレイヤーキャラクターは絵文字の"👮"で表示されます。以上が、要件に基づいた1枚のHTMLファイルとして実装されたJavaScriptを含むゲームの例です。

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

了解です。以下がHTMLとJavaScriptを含むプログラムの例です。

```html
<!DOCTYPE html>
<html lang="ja">

<head>
    <meta charset="UTF-8">
    <title>エムブレム警察</title>
</head>

<body>
    <h1>エムブレム警察</h1>

const canvas = document.getElementById("gameCanvas");
        const context = canvas.getContext("2d");

// プレイヤーの初期座標
        let playerX = canvas.width / 2;
        let playerY = canvas.height / 2;

// プレイヤーの移動速度
        const playerSpeed = 5;

// タッチイベントの初期化
        canvas.addEventListener("touchstart", handleTouchStart, false);
        canvas.addEventListener("touchmove", handleTouchMove, false);

let touchX = null;
        let touchY = null;

function handleTouchStart(event) {
            event.preventDefault();
            touchX = event.touches[0].clientX;
            touchY = event.touches[0].clientY;
        }

function handleTouchMove(event) {
            event.preventDefault();
            const deltaX = event.touches[0].clientX - touchX;
            const deltaY = event.touches[0].clientY - touchY;

// プレイヤーの座標を更新
            playerX += deltaX * playerSpeed;
            playerY += deltaY * playerSpeed;

touchX = event.touches[0].clientX;
            touchY = event.touches[0].clientY;

// プレイヤーが画面外に行かないように制限
            if (playerX < 0) {
                playerX = 0;
            } else if (playerX > canvas.width) {
                playerX = canvas.width;
            }

if (playerY < 0) {
                playerY = 0;
            } else if (playerY > canvas.height) {
                playerY = canvas.height;
            }

// ゲームの描画処理を呼び出し
            drawGame();
        }

function drawGame() {
            context.clearRect(0, 0, canvas.width, canvas.height);

// プレイヤーを描画
            context.font = "30px Arial";
            context.fillText("👮", playerX, playerY);
        }

// ゲームの描画処理を呼び出し
        drawGame();
    </script>
</body>

</html>
```

このプログラムでは、「エムブレム警察」というタイトルのゲームを実装しています。プレイヤーは指で画面をスワイプすることで、プレイヤーキャラクターを移動させることができます。移動範囲は画面内に制限されており、プレイヤーキャラクターは絵文字の"👮"で表示されます。

以上が、要件に基づいた1枚のHTMLファイルとして実装されたJavaScriptを含むゲームの例です。