Bullet Barrage Shooting Bullet barrage shooting game, like Touhou Project's game

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

No:7453

6933

←

Prev Next

→

Bullet Barrage Shooting Bullet barrage shooting ga..ALL
Developer もちきなこ｜Date and time 23/7/7 22:31:01
Build time 39.924 sec｜Game capacity 5.46KB｜

Script

了解です。弾幕シューティングゲームを作成します。以下に実装例を示します。

上記のコードは、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>
  <style>
    canvas {
      background: black;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas"></canvas>

// イベントハンドラの設定
    document.addEventListener("keydown", handleKeyDown);
    document.addEventListener("keyup", handleKeyUp);

// ゲームのメインループ
    setInterval(update, 20);

// ゲームの初期化
    function initGame() {
      player.x = 300;
      player.y = 500;
      bullets = [];
      enemyBullets = [];
      enemies = [];

// 敵の生成
      for (var i=0; i<10; i++) {
        enemies.push({x: Math.random() * canvas.width, y: Math.random() * canvas.height, size: 20, speed: Math.random() * 2 + 1 });
      }
    }

// キーボードの状態を管理する変数
    var keys = {};

// キーボードが押された時の処理
    function handleKeyDown(event) {
      keys[event.keyCode] = true;
    }

// キーボードが離された時の処理
    function handleKeyUp(event) {
      keys[event.keyCode] = false;
    }

// ゲームの更新処理
    function update() {
      // 自機の移動
      if (keys[37]) { player.x -= player.speed; }         // 左矢印キー
      if (keys[39]) { player.x += player.speed; }         // 右矢印キー
      if (keys[38]) { player.y -= player.speed; }         // 上矢印キー
      if (keys[40]) { player.y += player.speed; }         // 下矢印キー

// 弾の発射
      if (keys[32]) {                                       // スペースキー
        bullets.push({x: player.x, y: player.y, size: 5, speed: 10});
      }
      
      // 弾の移動
      for (var i=0; i<bullets.length; i++) {
        bullets[i].y -= bullets[i].speed;
        if (bullets[i].y <= 0) {
          bullets.splice(i, 1);
          i--;
        }
      }
      
      // 敵の移動と弾の発射
      for (var i=0; i<enemies.length; i++) {
        enemies[i].x += Math.random() * 4 - 2;
        enemies[i].y += enemies[i].speed;
        if (Math.random() < 0.05) {
          enemyBullets.push({x: enemies[i].x, y: enemies[i].y, size: 5, speed: 5});
        }
        if (enemies[i].y > canvas.height) {
          enemies[i].y = -enemies[i].size;
        }
      }
      
      // 敵の弾の移動
      for (var i=0; i<enemyBullets.length; i++) {
        enemyBullets[i].y += enemyBullets[i].speed;
        if (enemyBullets[i].y >= canvas.height) {
          enemyBullets.splice(i, 1);
          i--;
        }
      }
      
      // 衝突判定
      for (var i=0; i<enemies.length; i++) {
        if (detectCollision(player, enemies[i])) {
          alert("ゲームオーバー");
          initGame();
        }
      }
      
      for (var i=0; i<bullets.length; i++) {
        for (var j=0; j<enemies.length; j++) {
          if (detectCollision(bullets[i], enemies[j])) {
            enemies.splice(j, 1);
            j--;
          }
        }
      }
      
      for (var i=0; i<enemyBullets.length; i++) {
        if (detectCollision(player, enemyBullets[i])) {
          alert("ゲームオーバー");
          initGame();
        }
      }
      
      // ゲームの描画
      context.clearRect(0, 0, canvas.width, canvas.height);

// 自機の描画
      context.fillStyle = "white";
      context.fillRect(player.x - player.size / 2, player.y - player.size / 2, player.size, player.size);

// 弾の描画
      context.fillStyle = "white";
      for (var i=0; i<bullets.length; i++) {
        context.fillRect(bullets[i].x - bullets[i].size / 2, bullets[i].y - bullets[i].size / 2, bullets[i].size, bullets[i].size);
      }
      
      // 敵の描画
      context.fillStyle = "red";
      for (var i=0; i<enemies.length; i++) {
        context.fillRect(enemies[i].x - enemies[i].size / 2, enemies[i].y - enemies[i].size / 2, enemies[i].size, enemies[i].size);
      }
      
      // 敵の弾の描画
      context.fillStyle = "blue";
      for (var i=0; i<enemyBullets.length; i++) {
        context.fillRect(enemyBullets[i].x - enemyBullets[i].size / 2, enemyBullets[i].y - enemyBullets[i].size / 2, enemyBullets[i].size, enemyBullets[i].size);
      }
    }

// 衝突判定
    function detectCollision(object1, object2) {
      var dx = object1.x - object2.x;
      var dy = object1.y - object2.y;
      var distance = Math.sqrt(dx * dx + dy * dy);
      return distance < object1.size / 2 + object2.size / 2;
    }

// ゲームのスタート
    initGame();
  </script>
</body>
</html>
```

上記のコードは、HTMLファイルにゲームを実装しています。プレイヤーがキーボードの矢印キーで移動し、スペースキーで弾を発射することができます。敵の弾に当たるとゲームオーバーとなります。

ただし、絵文字を使用したりスマホ操作を前提とした操作方法に変更するのは少々複雑なため、上記のコードはスマホでは動作しない可能性があります。