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

No:23965

111

←

Prev Next

→

的あてゲームランダムに出現する的をタップして撃ち抜くゲーム人を撃ってしまうとゲームオーバー 2..ALL
Developer バファリンヌ｜Date and time 23/11/4 20:29:36
Build time 60.703 sec｜Game capacity 2.378KB｜

Script

的あてゲーム

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
  <title>的あてゲーム</title>
</head>
<body>
  <h1>的あてゲーム</h1>
  <canvas id="gameCanvas" width="300" height="300"></canvas>

// 初期設定
    var targetX = 0;
    var targetY = 0;
    var score = 0;

// ランダムな位置に的を配置する関数
    function placeTarget() {
      targetX = Math.random() * (canvas.width - 50);
      targetY = Math.random() * (canvas.height - 50);
    }

// 的がクリックされた時の処理
    function handleClick(event) {
      var rect = canvas.getBoundingClientRect();
      var mouseX = event.clientX - rect.left;
      var mouseY = event.clientY - rect.top;

if (mouseX >= targetX && mouseX <= targetX + 50 &&
          mouseY >= targetY && mouseY <= targetY + 50) {
        // 的がクリックされた場合
        score += 1;

// 25点でゲームクリア
        if (score >= 25) {
          alert("ゲームクリア！");
          score = 0;
        }

// 的を再配置
        placeTarget();
      } else {
        // 人を撃ってしまった場合
        alert("ゲームオーバー！");
        score = 0;
        // 的を再配置
        placeTarget();
      }
    }

// ゲーム開始時の処理
    function startGame() {
      // 的を画面上に配置する
      placeTarget();

// クリックイベントを追加
      canvas.addEventListener("click", handleClick);
    }

// ゲームを開始
    startGame();

// ゲームスコア表示
    function drawScore() {
      context.font = "20px Arial";
      context.fillStyle = "black";
      context.fillText("Score: " + score, 10, 30);
    }

// ゲーム画面更新
    function updateGame() {
      // キャンバスをクリア
      context.clearRect(0, 0, canvas.width, canvas.height);

// 的を描画
      context.fillStyle = "red";
      context.fillRect(targetX, targetY, 50, 50);

// スコアを描画
      drawScore();

// 再描画
      requestAnimationFrame(updateGame);
    }

// ゲーム画面の更新を開始
    updateGame();
  </script>
</body>
</html>