**Title:** Zombie Hunt AR **Concept:** Players use their smartphones to explore the real world, which is now infested with virtual zombies. The goal is to hunt and capture these zombies using augmented reality. Here's a breakdown:'s game | AI game creator

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

No:30681

97

**Title:** Zombie Hunt AR **Concept:** Players us..ALL
Developer User14724｜Date and time 23/12/23 22:00:52
Build time 25.238 sec｜Game capacity 4.622KB｜

**HTML Structure:**

**JavaScript Code:**
**Explanation:** The above code implements the "Zombie Hunt AR" game using HTML, JavaScript, and augmented reality. The game is rendered on the player's smartphone screen, and zombies are spread throughout the screen randomly. The player's goal is to "capture" these zombies by tapping on them. The `Zombie` class represents each zombie and stores its position (`x` and `y` coordinates) and capture status (`isCaptured`). The `ZOMBIE_COUNT` and `ZOMBIE_RADIUS` constants control the number of zombies and the clickable radius, respectively. The `handleTap` function is triggered whenever the player taps on the screen. It calculates the distance between the tap position and each zombie's position. If the tap is within the clickable radius of a zombie and the zombie hasn't been captured yet, it marks the zombie as captured and increases the player's score by 10. The `initializeGame` function sets up the game by generating random zombies and distributing them around the screen. It also adds an event listener for the tap event. The `updateGame` function is responsible for updating the game state and drawing on the screen. It clears the screen, draws the active zombies, and displays the current score. Finally, it renders the canvas on the screen. The script is enclosed in `
` tags, as required, and the game starts by calling the `initializeGame` function.

→ 　

0　

0　

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

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

(C)2023 HisashiApp

**HTML Structure:**

```html
<!DOCTYPE html>
<html>
<head>
    <title>Zombie Hunt AR</title>
</head>
<body>
    <script>
        // JavaScript code
    </script>
</body>
</html>
```

**JavaScript Code:**

```javascript
// Constants
const ZOMBIE_COUNT = 10; // Number of zombies to hunt
const ZOMBIE_RADIUS = 20; // Zombie clickable radius in pixels

let score = 0; // Current score
let zombies = []; // Array to hold zombie objects

// Function to generate a random number between min and max (inclusive)
function getRandomNumber(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

// Class to represent a zombie
class Zombie {
    constructor(x, y) {
        this.x = x;
        this.y = y;
        this.isCaptured = false;
    }
    
    // Function to calculate the distance between this zombie and player's tap
    distanceFromTap(x, y) {
        return Math.sqrt(Math.pow(this.x - x, 2) + Math.pow(this.y - y, 2));
    }
}

// Function to handle the player's tap event
function handleTap(event) {
    const tapX = event.clientX; // X-coordinate of tap
    const tapY = event.clientY; // Y-coordinate of tap
    
    // Loop through all zombies to check if any were tapped/captured
    for (let i = 0; i < zombies.length; i++) {
        const zombie = zombies[i];
        const distance = zombie.distanceFromTap(tapX, tapY);
        
        // Check if the tap was within the clickable radius of the zombie
        if (distance <= ZOMBIE_RADIUS) {
            if (!zombie.isCaptured) {
                zombie.isCaptured = true;
                score += 10;
            }
            
            break; // Exit the loop after capturing one zombie per tap
        }
    }
}

// Function to initialize the game
function initializeGame() {
    // Generate random zombies and distribute them around the screen
    for (let i = 0; i < ZOMBIE_COUNT; i++) {
        const x = getRandomNumber(0, window.innerWidth);
        const y = getRandomNumber(0, window.innerHeight);
        zombies.push(new Zombie(x, y));
    }
    
    // Add an event listener for the tap event
    document.addEventListener('click', handleTap);
    
    // Start updating the game
    setInterval(updateGame, 1000 / 60); // 60 FPS
}

// Function to update the game state and draw on the screen
function updateGame() {
    // Clear the screen
    const canvas = document.createElement('canvas');
    canvas.width = window.innerWidth;
    canvas.height = window.innerHeight;
    const context = canvas.getContext('2d');
    context.clearRect(0, 0, canvas.width, canvas.height);

// Draw the zombies
    zombies.forEach(zombie => {
        if (!zombie.isCaptured) {
            context.beginPath();
            context.arc(zombie.x, zombie.y, ZOMBIE_RADIUS, 0, 2 * Math.PI);
            context.fillStyle = 'green';
            context.fill();
            context.closePath();
        }
    });
    
    // Draw the score at the top-right corner
    context.font = '24px Arial';
    context.fillStyle = 'white';
    context.fillText('Score: ' + score, window.innerWidth - 150, 50);
    
    // Render the canvas on the screen
    document.body.innerHTML = '';
    document.body.appendChild(canvas);
}

// Start the game
initializeGame();
```

**Explanation:**

The above code implements the "Zombie Hunt AR" game using HTML, JavaScript, and augmented reality. The game is rendered on the player's smartphone screen, and zombies are spread throughout the screen randomly. The player's goal is to "capture" these zombies by tapping on them.

The `Zombie` class represents each zombie and stores its position (`x` and `y` coordinates) and capture status (`isCaptured`). The `ZOMBIE_COUNT` and `ZOMBIE_RADIUS` constants control the number of zombies and the clickable radius, respectively.

The `handleTap` function is triggered whenever the player taps on the screen. It calculates the distance between the tap position and each zombie's position. If the tap is within the clickable radius of a zombie and the zombie hasn't been captured yet, it marks the zombie as captured and increases the player's score by 10.

The `initializeGame` function sets up the game by generating random zombies and distributing them around the screen. It also adds an event listener for the tap event.

The `updateGame` function is responsible for updating the game state and drawing on the screen. It clears the screen, draws the active zombies, and displays the current score. Finally, it renders the canvas on the screen.

The script is enclosed in `<script>` tags, as required, and the game starts by calling the `initializeGame` function.