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

No:2489

226

←

Prev Next

→

UMA Discovery Game
Developer anonymous｜Date and time 23/6/21 17:52:32
Build time 28.766 sec｜Game capacity 2.747KB｜

Script

UMA Discovery Game

Score: 0

Click on the UMAs below to capture them!

UMA discovery games are、The game is to capture UMAs randomly placed on the canvas by clicking on them. The game is cleared when all UMAs are captured. Score is added according to the number of captured UMAs.

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>UMA発見ゲーム</title>
    <style>
      body {
        font-size: 20px;
        font-family: Arial, sans-serif;
        text-align: center;
      }
      canvas {
        border: 2px solid black;
      }
      #score {
        font-weight: bold;
        margin-top: 10px;
      }
      #instructions {
        margin-top: 20px;
      }
    </style>
  </head>
  <body>
    <h1>UMA発見ゲーム</h1>
    <canvas id="canvas" width="500" height="500"></canvas>
    <div id="score">スコア: 0</div>
    <div id="instructions">下のUMAをクリックして捕獲しよう！</div>
    <script>
      var canvas = document.getElementById("canvas");
      var ctx = canvas.getContext("2d");
      
      // UMAをランダムに配置する
      var umas = [];
      for (var i = 0; i < 10; i++) {
        umas.push({
          x: Math.random() * (canvas.width - 50),
          y: Math.random() * (canvas.height - 50),
          captured: false
        });
      }
      
      // キャプチャーしたUMAの数
      var capturedCount = 0;
      
      // スコア
      var score = 0;
      
      // キャンバスをクリックした時のイベント
      canvas.addEventListener("click", function(event) {
        for (var i = 0; i < umas.length; i++) {
          var uma = umas[i];
          if (!uma.captured && event.offsetX > uma.x && event.offsetX < uma.x + 50 && event.offsetY > uma.y && event.offsetY < uma.y + 50) {
            uma.captured = true;
            capturedCount++;
            score += 100;
            document.getElementById("score").innerHTML = "スコア: " + score;
            if (capturedCount === umas.length) {
              alert("全てのUMAをキャプチャーしました！あなたのスコアは" + score + "点です。");
              window.location.reload();
            }
          }
        }
      });
      
      // ゲームループ
      function gameLoop() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        for (var i = 0; i < umas.length; i++) {
          var uma = umas[i];
          if (!uma.captured) {
            ctx.fillStyle = "#FFD700";
            ctx.fillRect(uma.x, uma.y, 50, 50);
          }
        }
        window.requestAnimationFrame(gameLoop);
      }
      
      gameLoop();
    </script>
  </body>
</html>

UMA発見ゲームは、キャンバス上にランダムに配置されたUMAをクリックして捕獲するゲームです。全てのUMAをキャプチャーするとゲームクリアとなります。スコアはキャプチャーしたUMAの数に応じて加算されます。