シューティングゲーム's game

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

No:31392

←

Prev Next

→

シューティングゲーム
Developer User15123｜Date and time 23/12/26 17:47:07
Build time 49.269 sec｜Game capacity 4.428KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
  <title>シューティングゲーム</title>
  <style>
    body {
      margin: 0;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="500" height="400"></canvas>

// 自機の初期位置
    let playerX = canvas.width / 2;
    let playerY = canvas.height - 30;

// 自機の移動速度
    let playerSpeed = 4;

// 自機の幅と高さ
    const playerWidth = 20;
    const playerHeight = 20;

// 弾の初期位置
    let bulletX = playerX + playerWidth / 2;
    let bulletY = playerY;

// 弾の移動速度
    const bulletSpeed = 10;

// 弾の幅と高さ
    const bulletWidth = 4;
    const bulletHeight = 10;

// 弾が発射されたかどうかのフラグ
    let bulletFired = false;

// 敵の初期位置
    let enemyX = Math.random() * (canvas.width - playerWidth);
    let enemyY = 0;

// 敵の移動速度
    let enemySpeed = 2;

// 敵の幅と高さ
    const enemyWidth = 20;
    const enemyHeight = 20;

// スコアの初期値
    let score = 0;

// タッチ座標
    let touchX = null;
    let touchY = null;

// キーボードの状態を保持するオブジェクト
    const keys = {};

// キーボードイベントのリスナーを登録
    window.addEventListener('keydown', (event) => {
      keys[event.keyCode] = true;
    });

window.addEventListener('keyup', (event) => {
      keys[event.keyCode] = false;
    });

// タッチイベントのリスナーを登録
    canvas.addEventListener('touchstart', (event) => {
      event.preventDefault();
      touchX = event.changedTouches[0].clientX;
      touchY = event.changedTouches[0].clientY;
    });

canvas.addEventListener('touchmove', (event) => {
      event.preventDefault();
      touchX = event.changedTouches[0].clientX;
      touchY = event.changedTouches[0].clientY;
    });

canvas.addEventListener('touchend', () => {
      touchX = null;
      touchY = null;
    });

// ゲームループを開始
    function gameLoop() {
      requestAnimationFrame(gameLoop);
      update();
      draw();
    }

// 自機と弾、敵の状態を更新
    function update() {
      if (keys[37]) { // 左キーが押されている場合
        playerX -= playerSpeed;
      }
      if (keys[39]) { // 右キーが押されている場合
        playerX += playerSpeed;
      }

if (touchX !== null) {
        if (touchX < playerX) {
          playerX -= playerSpeed;
        } else if (touchX > playerX + playerWidth) {
          playerX += playerSpeed;
        }
      }

if (bulletFired) {
        bulletY -= bulletSpeed;

// 弾が画面外に出た場合
        if (bulletY < 0) {
          bulletFired = false;
        }

// 弾が敵に当たった場合
        if (
          bulletX + bulletWidth > enemyX &&
          bulletX < enemyX + enemyWidth &&
          bulletY < enemyY + enemyHeight
        ) {
          // スコアを増加
          score += 10;

// 敵の位置を再設定
          enemyX = Math.random() * (canvas.width - playerWidth);
          enemyY = 0;

// 弾を初期位置に戻す
          bulletY = playerY;
          bulletFired = false;
        }
      }

enemyY += enemySpeed;

// 敵が画面外に出た場合
      if (enemyY > canvas.height) {
        // 敵の位置を再設定
        enemyX = Math.random() * (canvas.width - playerWidth);
        enemyY = 0;

// スコアを減少
        score -= 30;
        if (score < 0) {
          score = 0;
        }
      }
    }

// ゲーム画面を描画
    function draw() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);

// 自機を描画
      ctx.fillStyle = 'blue';
      ctx.fillRect(playerX, playerY, playerWidth, playerHeight);

// 弾を描画
      if (bulletFired) {
        ctx.fillStyle = 'red';
        ctx.fillRect(bulletX, bulletY, bulletWidth, bulletHeight);
      }

// 敵を描画
      ctx.fillStyle = 'green';
      ctx.fillRect(enemyX, enemyY, enemyWidth, enemyHeight);

// スコアを描画
      ctx.fillStyle = 'black';
      ctx.font = '20px Arial';
      ctx.fillText(`Score: ${score}`, 10, 30);
    }

gameLoop();
  </script>
</body>
</html>