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

No:30985

112

←

Prev Next

→

自爆にどれぐらいの敵を巻き込めるか競うゲーム
Developer User14989｜Date and time 23/12/24 19:24:10
Build time 21.008 sec｜Game capacity 3.17KB｜

Script

了解しました。以下が、要件に従って作成されたゲームの実装例です。

自爆ゲーム

このゲームでは、自機をスマホのタッチ操作で移動させ、敵に当たって自爆しないようにするゲームです。最初に自機と敵の位置とサイズが設定されており、その情報をもとにキャンバス上に描画されます。自機と敵の衝突判定も行われ、自機が敵に触れるとゲームオーバーとなります。このプログラムは、1枚のHTMLファイルとして実装されており、JavaScriptは`script`タグ内に記述されています。また、スマホの操作を前提としており、スマホのタッチ操作によって自機を移動させます。以上が、要件に基づいて作成された自爆ゲームの実装例です。完成したゲームとして遊ぶことができます。

←

Prev　Next

→ 　

Back　

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

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

了解しました。以下が、要件に従って作成されたゲームの実装例です。

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>自爆ゲーム</title>
</head>
<body>

<h1>自爆ゲーム</h1>
  
  <canvas id="gameCanvas" width="300" height="300"></canvas>
  
  <script>
    // ゲームのステータス
    var gameStatus = "playing";
    
    // 自機の情報
    var player = {
      x: 150,
      y: 150,
      size: 30
    };
    
    // 敵の情報
    var enemies = [
      { 
        x: 50,
        y: 50,
        size: 20
      },
      { 
        x: 100,
        y: 100,
        size: 20
      },
      { 
        x: 200,
        y: 200,
        size: 20
      }
    ];
    
    // キャンバスの参照を取得
    var canvas = document.getElementById("gameCanvas");
    var ctx = canvas.getContext("2d");
    
    // ゲームのメインループ
    function gameLoop() {
      // キャンバスをクリア
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      
      // プレイヤーを描画
      ctx.fillStyle = "blue";
      ctx.beginPath();
      ctx.arc(player.x, player.y, player.size, 0, Math.PI * 2, false);
      ctx.fill();
      
      // 敵を描画
      ctx.fillStyle = "red";
      for (var i = 0; i < enemies.length; i++) {
        ctx.beginPath();
        ctx.arc(enemies[i].x, enemies[i].y, enemies[i].size, 0, Math.PI * 2, false);
        ctx.fill();
      }
      
      if (gameStatus === "playing") {
        // 移動操作の処理
        canvas.addEventListener("touchmove", function(event) {
          var rect = canvas.getBoundingClientRect();
          player.x = event.touches[0].clientX - rect.left;
          player.y = event.touches[0].clientY - rect.top;
        });
        
        // 衝突判定の処理
        for (var i = 0; i < enemies.length; i++) {
          var dx = player.x - enemies[i].x;
          var dy = player.y - enemies[i].y;
          var distance = Math.sqrt(dx * dx + dy * dy);
          
          if (distance < player.size + enemies[i].size) {
            gameStatus = "gameover";
            break;
          }
        }
        
        // ゲームループの再呼び出し
        requestAnimationFrame(gameLoop);
      }
    }
    
    // ゲームループの開始
    gameLoop();
  </script>

</body>
</html>
```

このゲームでは、自機をスマホのタッチ操作で移動させ、敵に当たって自爆しないようにするゲームです。最初に自機と敵の位置とサイズが設定されており、その情報をもとにキャンバス上に描画されます。自機と敵の衝突判定も行われ、自機が敵に触れるとゲームオーバーとなります。

このプログラムは、1枚のHTMLファイルとして実装されており、JavaScriptは`script`タグ内に記述されています。また、スマホの操作を前提としており、スマホのタッチ操作によって自機を移動させます。

以上が、要件に基づいて作成された自爆ゲームの実装例です。完成したゲームとして遊ぶことができます。