Lion Simulate

絶望的にどうぶつスクールシミュレーターのアップデートが来なくて、開発者に激怒したライオンが暴れまくるゲームです。

マウスで操作し、敵をガツンとマシマシしながら生き残りましょう！🦁

←

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">
    <title>Lion Simulate</title>
    <style>
      canvas {
        border: solid 2px black;
        background-color: #F5DEB3;
      }  
    </style>
  </head>
  <body>
    <h1>Lion Simulate</h1>
    <p>絶望的にどうぶつスクールシミュレーターのアップデートが来なくて、開発者に激怒したライオンが暴れまくるゲームです。</p>
    <p>マウスで操作し、敵をガツンとマシマシしながら生き残りましょう！🦁</p>
    <canvas id="canvas" width="300" height="300"></canvas>
    <script>
      // Canvasの準備
      const canvas = document.getElementById('canvas');
      const ctx = canvas.getContext('2d');

// ライオン画像読み込み
      const lionImage = new Image();
      lionImage.src = 'lion.png';

// 敵の種類
      const enemyTypes = ['bird', 'gazelle', 'zebra'];

// ゲームの状態
      let gameState = {
        score: 0,
        isGameOver: false
      };

// ライオンの初期状態
      let lion = {
        x: 150,
        y: 150,
        size: 50,
        speed: 10
      };

// 敵の初期状態
      let enemies = [];

// 敵を生成する関数
      function createEnemy() {
        const x = Math.random() * canvas.width;
        const y = Math.random() * canvas.height;
        const type = enemyTypes[Math.floor(Math.random() * enemyTypes.length)];
        const enemy = {
          x: x,
          y: y,
          type: type,
          size: 30
        }
        enemies.push(enemy);
      }

// ライオンを描画する関数
      function drawLion() {
        ctx.drawImage(lionImage, lion.x - lion.size / 2, lion.y - lion.size / 2, lion.size, lion.size);
      }

// 敵を描画する関数
      function drawEnemy() {
        for (let i = 0; i < enemies.length; i++) {
          const enemy = enemies[i];
          const enemyImage = new Image();
          enemyImage.src = `${enemy.type}.png`;
          ctx.drawImage(enemyImage, enemy.x - enemy.size / 2, enemy.y - enemy.size / 2, enemy.size, enemy.size);
        }
      }

// ゲームオーバー画面を描画する関数
      function drawGameOver() {
        ctx.font = 'bold 30px sans-serif';
        ctx.fillStyle = 'red';
        ctx.textAlign = 'center';
        ctx.fillText('GAME OVER', canvas.width / 2, canvas.height / 2);
        ctx.font = 'bold 20px sans-serif';
        ctx.fillStyle = 'black';
        ctx.fillText(`Score: ${gameState.score}`, canvas.width / 2, canvas.height / 2 + 50);
      }

// ゲームを開始する関数
      function startGame() {
        setInterval(function() {
          if (!gameState.isGameOver) {
            createEnemy();
          }
        }, 2000);

setInterval(function() {
          if (!gameState.isGameOver) {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            drawLion();
            drawEnemy();

// 敵との当たり判定
            for (let i = 0; i < enemies.length; i++) {
              const enemy = enemies[i];
              const distance = Math.sqrt((lion.x - enemy.x) ** 2 + (lion.y - enemy.y) ** 2);
              if (distance < lion.size / 2 + enemy.size / 2) {
                enemies.splice(i, 1);
                gameState.score++;
              }
            }

// ゲームオーバー判定
            if (enemies.length > 5) {
              gameState.isGameOver = true;
            }
          } else {
            drawGameOver();
          }
        }, 1000 / 60);
      }

// ライオンを移動させる関数
      function moveLion(event) {
        const rect = canvas.getBoundingClientRect();
        lion.x = event.clientX - rect.left;
        lion.y = event.clientY - rect.top;

// 画面外に出ないように制限
        if (lion.x < lion.size / 2) {
          lion.x = lion.size / 2;
        }
        if (lion.y < lion.size / 2) {
          lion.y = lion.size / 2;
        }
        if (lion.x > canvas.width - lion.size / 2) {
          lion.x = canvas.width - lion.size / 2;
        }
        if (lion.y > canvas.height - lion.size / 2) {
          lion.y = canvas.height - lion.size / 2;
        }
      }

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

// ライオンをマウスで動かす
      canvas.addEventListener('mousemove', moveLion);
    </script>
  </body>
</html>