AI game creator

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

No:42350

136

←

Prev Next

→

Tower defense
Developer User17554｜Date and time 24/2/11 12:40:26
Build time 11.312 sec｜Game capacity 4.043KB｜

Script

Sure, here's a simple tower defense game implemented as a single HTML file using JavaScript:

In this simple tower defense game, enemies start from the top row and move down the grid towards the player's base, represented by the blue square. The player can place towers represented by green squares to defend their base. The goal is to prevent the enemies from reaching the base. Note: This is a basic implementation for demonstration purposes, and it can be expanded upon to add additional features such as different enemy types, tower upgrades, and more.

←

Prev　Next

→ 　

Back　

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

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

Sure, here's a simple tower defense game implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Tower Defense Game</title>
</head>
<body>
    <canvas id="gameCanvas" width="800" height="600"></canvas>

// Game variables
            const cellSize = 40;
            const gridSize = 10;
            const playerBase = [gridSize - 1, Math.floor(gridSize / 2)];
            let enemyPositions = [[0, Math.floor(gridSize / 2)]];
            let towers = [];

// Function to draw the game grid
            function drawGrid() {
                ctx.strokeStyle = "#000";
                ctx.lineWidth = 2;
                for (let i = 0; i < gridSize; i++) {
                    for (let j = 0; j < gridSize; j++) {
                        ctx.strokeRect(j * cellSize, i * cellSize, cellSize, cellSize);
                    }
                }
            }

// Function to draw the player base
            function drawPlayerBase() {
                ctx.fillStyle = "#00f";
                const x = playerBase[1] * cellSize;
                const y = playerBase[0] * cellSize;
                ctx.fillRect(x, y, cellSize, cellSize);
            }

// Function to draw the enemies
            function drawEnemies() {
                ctx.fillStyle = "#f00";
                enemyPositions.forEach((position) => {
                    const x = position[1] * cellSize;
                    const y = position[0] * cellSize;
                    ctx.fillRect(x, y, cellSize, cellSize);
                });
            }

// Function to draw the towers
            function drawTowers() {
                ctx.fillStyle = "#0f0";
                towers.forEach((tower) => {
                    const x = tower[1] * cellSize;
                    const y = tower[0] * cellSize;
                    ctx.fillRect(x, y, cellSize, cellSize);
                });
            }

// Function to update the game state
            function updateGame() {
                // Move enemies
                enemyPositions = enemyPositions.map((position) => {
                    const newRow = position[0] + 1;
                    return [newRow, position[1]];
                });

// Check for collisions with base
                enemyPositions = enemyPositions.filter((position) => {
                    return position[0] !== playerBase[0] || position[1] !== playerBase[1];
                });

// Redraw game
                ctx.clearRect(0, 0, canvas.width, canvas.height);
                drawGrid();
                drawPlayerBase();
                drawEnemies();
                drawTowers();

// Schedule next update
                setTimeout(updateGame, 1000);
            }

// Function to handle tower placement
            function placeTower(event) {
                const x = Math.floor(event.clientX / cellSize);
                const y = Math.floor(event.clientY / cellSize);
                const newTower = [y, x];
                towers.push(newTower);
            }

// Bind tower placement to mouse click event
            canvas.addEventListener("click", placeTower);

// Start the game
            updateGame();
        };
    </script>
</body>
</html>
```

Note: This is a basic implementation for demonstration purposes, and it can be expanded upon to add additional features such as different enemy types, tower upgrades, and more.