A 2d zombie shooter with a ruined city landscape ware you play as a female commando with an assault rifle's game

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

No:15214

←

Prev Next

→

A 2d zombie shooter with a ruined city landscape w..ALL
Developer User6602｜Date and time 23/9/7 17:34:39
Build time 55.701 sec｜Game capacity 5.348KB｜

Script

Sure! Here's a basic implementation of a 2D Zombie Shooter game using JavaScript, HTML, and pictograms. Please note that this is a simplified version, and you can further enhance it with more features and visuals.

To use this code, save it as a `.html` file and open it with a web browser. You'll need to replace the `emozi_rabbit.png` and `emozi_all/zombie.png` file paths with actual images of a female commando and a zombie, respectively. In this game, you control a female commando with an assault rifle (represented by the pictogram). Use the arrow keys to move the player around the screen, and press the spacebar to shoot bullets. Your goal is to eliminate the zombies (also represented by pictograms) to increase your score. The game ends if the player collides with any zombie.

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>2D Zombie Shooter</title>
  <style>
    canvas {
      border: 1px solid black;
      display: block;
      margin: 0 auto;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="800" height="600"></canvas>

// Game variables
    const canvas = document.getElementById("gameCanvas");
    const context = canvas.getContext("2d");
    const playerSize = 50;
    const playerSpeed = 5;
    let playerX = canvas.width / 2 - playerSize / 2;
    let playerY = canvas.height / 2 - playerSize / 2;
    
    const bulletSize = 10;
    const bulletSpeed = 10;
    const bullets = [];
    
    const zombieSize = 50;
    const zombieSpeed = 2;
    const zombies = [];
    
    let score = 0;
    
    // Load player and zombie images as pictograms
    const playerImage = new Image();
    playerImage.src = "pictogram_of_female_commando.png";
    
    const zombieImage = new Image();
    zombieImage.src = "pictogram_of_zombie.png";
    
    // Game functions
    function drawPlayer() {
      context.drawImage(playerImage, playerX, playerY, playerSize, playerSize);
    }
    
    function drawBullets() {
      bullets.forEach((bullet) => {
        context.fillStyle = "red";
        context.fillRect(bullet.x, bullet.y, bulletSize, bulletSize);
      })
    }
    
    function drawZombies() {
      zombies.forEach((zombie) => {
        context.drawImage(zombieImage, zombie.x, zombie.y, zombieSize, zombieSize);
      });
    }
    
    function movePlayer(direction) {
      if (direction === "up" && playerY > 0) {
        playerY -= playerSpeed;
      } else if (direction === "down" && playerY + playerSize < canvas.height) {
        playerY += playerSpeed;
      } else if (direction === "left" && playerX > 0) {
        playerX -= playerSpeed;
      } else if (direction === "right" && playerX + playerSize < canvas.width) {
        playerX += playerSpeed;
      }
    }
    
    function handleBullets() {
      bullets.forEach((bullet, bulletIndex) => {
        bullet.y -= bulletSpeed;
    
        if (bullet.y < 0) {
          bullets.splice(bulletIndex, 1);
        }
    
        zombies.forEach((zombie, zombieIndex) => {
          if (bullet.x < zombie.x + zombieSize &&
              bullet.x + bulletSize > zombie.x &&
              bullet.y < zombie.y + zombieSize &&
              bullet.y + bulletSize > zombie.y) {
            zombies.splice(zombieIndex, 1);
            bullets.splice(bulletIndex, 1);
            score += 10;
          }
        });
      });
    }
    
    function moveZombies() {
      zombies.forEach((zombie) => {
        if (playerX < zombie.x) {
          zombie.x -= zombieSpeed;
        }
    
        if (playerX > zombie.x) {
          zombie.x += zombieSpeed;
        }
    
        if (playerY < zombie.y) {
          zombie.y -= zombieSpeed;
        }
    
        if (playerY > zombie.y) {
          zombie.y += zombieSpeed;
        }
      });
    }
    
    function handleGameOver() {
      zombies.forEach((zombie) => {
        if (playerX < zombie.x + zombieSize &&
            playerX + playerSize > zombie.x &&
            playerY < zombie.y + zombieSize &&
            playerY + playerSize > zombie.y) {
          alert(`Game Over! Your score: ${score}`);
          location.reload();
        }
      });
    }
    
    function updateGame() {
      context.clearRect(0, 0, canvas.width, canvas.height);
      drawPlayer();
      drawBullets();
      drawZombies();
      moveZombies();
      handleBullets();
      handleGameOver();
    
      requestAnimationFrame(updateGame);
    }
    
    // Register key events for player movement
    document.addEventListener("keydown", (event) => {
      if (event.key === "ArrowUp") {
        movePlayer("up");
      } else if (event.key === "ArrowDown") {
        movePlayer("down");
      } else if (event.key === "ArrowLeft") {
        movePlayer("left");
      } else if (event.key === "ArrowRight") {
        movePlayer("right");
      } else if (event.key === " ") {
        bullets.push({
          x: playerX + playerSize / 2 - bulletSize / 2,
          y: playerY
        });
      }
    });
    
    // Create initial zombies
    for (let i = 0; i < 5; i++) {
      zombies.push({
        x: Math.random() * (canvas.width - zombieSize),
        y: Math.random() * (canvas.height - zombieSize)
      });
    }
    
    // Start the game
    updateGame();
  </script>
</body>
</html>
```

To use this code, save it as a `.html` file and open it with a web browser. You'll need to replace the `pictogram_of_female_commando.png` and `pictogram_of_zombie.png` file paths with actual images of a female commando and a zombie, respectively.

In this game, you control a female commando with an assault rifle (represented by the pictogram). Use the arrow keys to move the player around the screen, and press the spacebar to shoot bullets. Your goal is to eliminate the zombies (also represented by pictograms) to increase your score. The game ends if the player collides with any zombie.