A zombie story 2d game.'s game

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

No:49979

←

Prev Next

→

A zombie story 2d game.
Developer User21202｜Date and time 24/3/7 7:05:47
Build time 11.644 sec｜Game capacity 3.29KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Zombie Story</title>
</head>
<body>
    <canvas id="gameCanvas" width="800" height="600"></canvas>
    <script>
        const canvas = document.getElementById('gameCanvas');
        const ctx = canvas.getContext('2d');
        
        const player = {
            x: 50,
            y: 50,
            speed: 5,
            width: 20,
            height: 20,
            color: 'blue'
        };

const zombies = [
            { x: 200, y: 200, speed: 2, width: 20, height: 20, color: 'green' },
            { x: 400, y: 400, speed: 3, width: 20, height: 20, color: 'green' }
        ];

function drawPlayer() {
            ctx.fillStyle = player.color;
            ctx.fillRect(player.x, player.y, player.width, player.height);
        }

function drawZombies() {
            zombies.forEach(zombie => {
                ctx.fillStyle = zombie.color;
                ctx.fillRect(zombie.x, zombie.y, zombie.width, zombie.height);
            });
        }

function movePlayer(direction) {
            switch (direction) {
                case 'up':
                    player.y -= player.speed;
                    break;
                case 'down':
                    player.y += player.speed;
                    break;
                case 'left':
                    player.x -= player.speed;
                    break;
                case 'right':
                    player.x += player.speed;
                    break;
            }
        }

function moveZombies() {
            zombies.forEach(zombie => {
                if (player.x > zombie.x) {
                    zombie.x += zombie.speed;
                } else {
                    zombie.x -= zombie.speed;
                }

if (player.y > zombie.y) {
                    zombie.y += zombie.speed;
                } else {
                    zombie.y -= zombie.speed;
                }
            });
        }

function gameLoop() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);

drawPlayer();
            drawZombies();
            moveZombies();
            checkCollision();

requestAnimationFrame(gameLoop);
        }

document.addEventListener('keydown', (event) => {
            switch (event.key) {
                case 'ArrowUp':
                    movePlayer('up');
                    break;
                case 'ArrowDown':
                    movePlayer('down');
                    break;
                case 'ArrowLeft':
                    movePlayer('left');
                    break;
                case 'ArrowRight':
                    movePlayer('right');
                    break;
            }
        });

gameLoop();
    </script>
</body>
</html>