Zombie Combat Simulator's game | AI game creator

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

No:7248

1815

Zombie Combat Simulator
Developer User3993｜Date and time 23/7/6 15:31:11
Build time 18.536 sec｜Game capacity 2.853KB｜

→ 　

1　

0　

　
　
　
　

[PR]現在の本の売れ筋ランキング

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

(C)2023 HisashiApp

<!DOCTYPE html>
<html>
<head>
  <title>Zombie Combat Simulator</title>
</head>
<body>
  <canvas id="gameCanvas" width="600" height="400"></canvas>

<script>
  const canvas = document.getElementById("gameCanvas");
  const context = canvas.getContext("2d");
  
  // Define game state
  let player = { x: canvas.width / 2, y: canvas.height - 50, size: 40, speed: 5 };
  let zombies = [];
  let score = 0;
  let gameover = false;
  
  // Add event listeners for player movement
  document.addEventListener("keydown", movePlayer);
  
  // Function to move player
  function movePlayer(event) {
    if (event.key === "ArrowLeft" && player.x - player.size / 2 > 0) {
      player.x -= player.speed;
    } else if (event.key === "ArrowRight" && player.x + player.size / 2 < canvas.width) {
      player.x += player.speed;
    } else if (event.key === "ArrowUp" && player.y - player.size / 2 > 0) {
      player.y -= player.speed;
    } else if (event.key === "ArrowDown" && player.y + player.size / 2 < canvas.height) {
      player.y += player.speed;
    }
  }
  
  // Function to create a zombie
  function createZombie() {
    const zombie = {
      x: Math.random() * (canvas.width - 20) + 10,
      y: Math.random() * (canvas.height - 20) + 10,
      size: 30,
      speed: Math.random() * 2 + 1
    };
    zombies.push(zombie);
  }
  
  // Function to update game state
  function update() {
    if (!gameover) {
      // Clear canvas
      context.clearRect(0, 0, canvas.width, canvas.height);
      
      // Draw player
      context.fillStyle = "green";
      context.fillRect(player.x - player.size / 2, player.y - player.size / 2, player.size, player.size);
      
      // Draw zombies
      zombies.forEach(zombie => {
        context.fillStyle = "red";
        context.fillRect(zombie.x - zombie.size / 2, zombie.y - zombie.size / 2, zombie.size, zombie.size);
        
        // Check collision with player
        if (Math.abs(zombie.x - player.x) < zombie.size / 2 + player.size / 2 &&
            Math.abs(zombie.y - player.y) < zombie.size / 2 + player.size / 2) {
          gameover = true;
        }
        
        // Move zombie
        const angle = Math.atan2(player.y - zombie.y, player.x - zombie.x);
        zombie.x += Math.cos(angle) * zombie.speed;
        zombie.y += Math.sin(angle) * zombie.speed;
      });
      
      // Increment score
      score++;
      
      // Create new zombies every 2 seconds
      if (score % 120 === 0) {
        createZombie();
      }
      
      // Request next animation frame
      requestAnimationFrame(update);
    } else {
      // Game over message
      context.fillStyle = "black";
      context.font = "30px Arial";
      context.fillText("Game Over", canvas.width / 2 - 80, canvas.height / 2);
    }
  }
  
  // Start game
  createZombie();
  update();
</script>
</body>
</html>