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

No:23826

←

Prev Next

→

電車が飛ぶ
Developer User11163｜Date and time 23/11/3 22:12:37
Build time 81.769 sec｜Game capacity 2.077KB｜

Script

ご要望の通り、以下にあるシンプルなゲームを作成しました。

電車が飛ぶゲーム

このゲームでは、「電車」を矢印キーで操作し、画面内を移動させることができます。電車は黒い四角で表現され、キーの入力に応じて左右上下に移動します。このプログラムを1枚のHTMLファイルとして保存し、ウェブブラウザで開くことでゲームをプレイすることができます。また、スマートフォンでも遊ぶことができます。ご希望のゲームとして遊べるプログラムが作成できたかと思います。何か他の要望があればお知らせください。

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

ご要望の通り、以下にあるシンプルなゲームを作成しました。

```html
<!DOCTYPE html>
<html>
<head>
  <title>電車が飛ぶ</title>
</head>
<body>
  <h1>電車が飛ぶゲーム</h1>
  <canvas id="gameCanvas" width="400" height="600"></canvas>
  
  <script>
    // ゲームのコンテキストを取得
    const canvas = document.getElementById("gameCanvas");
    const ctx = canvas.getContext("2d");
    
    // 電車の初期座標
    let trainX = 200;
    let trainY = 550;
    
    // 矢印キーのイベントハンドラを追加
    document.addEventListener("keydown", moveTrain);
    
    // 電車を描画する関数
    function drawTrain() {
      ctx.fillStyle = "black";
      ctx.fillRect(trainX, trainY, 40, 40);
    }
    
    // キー入力に応じて電車を移動する関数
    function moveTrain(event) {
      if (event.key === "ArrowLeft" && trainX > 0) {
        trainX -= 10;
      } else if (event.key === "ArrowRight" && trainX < 360) {
        trainX += 10;
      } else if (event.key === "ArrowUp" && trainY > 0) {
        trainY -= 10;
      } else if (event.key === "ArrowDown" && trainY < 560) {
        trainY += 10;
      }
    }
    
    // ゲームループ
    function gameLoop() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      
      drawTrain();
      
      requestAnimationFrame(gameLoop);
    }
    
    // ゲームループを開始
    gameLoop();
  </script>
</body>
</html>
```

このゲームでは、「電車」を矢印キーで操作し、画面内を移動させることができます。電車は黒い四角で表現され、キーの入力に応じて左右上下に移動します。

このプログラムを1枚のHTMLファイルとして保存し、ウェブブラウザで開くことでゲームをプレイすることができます。また、スマートフォンでも遊ぶことができます。

ご希望のゲームとして遊べるプログラムが作成できたかと思います。何か他の要望があればお知らせください。