make a 2D game with the point of view to your caracter avove him, your caracter is a circle and his hands is are 2 smaller circles, he has two weapong that he can swith betwen them, one ak-47 and the other one an a awp, random green enemy spawns and go after you to attack you, you have 100%hp and each attack from the green enemy decrease your hp by 10%,'s game

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

No:47016

←

Prev Next

→

make a 2D game with the point of view to your cara..ALL
Developer User20375｜Date and time 24/2/27 6:08:25
Build time 19.159 sec｜Game capacity 4.088KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

<!DOCTYPE html>
<html>
<head>
<title>Circle Shooter Game</title>
<style>
    body {
        margin: 0;
        overflow: hidden;
    }
    canvas {
        background-color: #f0f0f0;
    }
</style>
</head>
<body>
<canvas id="gameCanvas" width="800" height="600"></canvas>
<script>
    const canvas = document.getElementById('gameCanvas');
    const ctx = canvas.getContext('2d');

let player = {
        x: canvas.width / 2,
        y: canvas.height - 50,
        radius: 20,
        weapon: 'ak47',
        hp: 100
    };

let bullets = [];
    let enemies = [];

let ak47Damage = 10;
    let awpDamage = 20;

let score = 0;

function drawPlayer() {
        ctx.beginPath();
        ctx.arc(player.x, player.y, player.radius, 0, Math.PI * 2);
        ctx.fillStyle = 'blue';
        ctx.fill();
        ctx.closePath();

ctx.beginPath();
        ctx.arc(player.x - 15, player.y + 10, 10, 0, Math.PI * 2);
        ctx.fillStyle = 'blue';
        ctx.fill();
        ctx.closePath();

ctx.beginPath();
        ctx.arc(player.x + 15, player.y + 10, 10, 0, Math.PI * 2);
        ctx.fillStyle = 'blue';
        ctx.fill();
        ctx.closePath();
    }

function drawBullet(bullet) {
        ctx.beginPath();
        ctx.arc(bullet.x, bullet.y, 5, 0, Math.PI * 2);
        ctx.fillStyle = 'red';
        ctx.fill();
        ctx.closePath();
    }

function drawEnemy(enemy) {
        ctx.beginPath();
        ctx.arc(enemy.x, enemy.y, 20, 0, Math.PI * 2);
        ctx.fillStyle = 'green';
        ctx.fill();
        ctx.closePath();
    }

function shoot() {
        bullets.push({ x: player.x, y: player.y - 20, weapon: player.weapon });
    }

function spawnEnemy() {
        let x = Math.random() * canvas.width;
        let y = 0;
        enemies.push({ x: x, y: y });
    }

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

drawPlayer();

bullets.forEach((bullet, index) => {
            bullet.y -= 10;
            drawBullet(bullet);

// Check for bullet-enemy collision
            enemies.forEach((enemy, enemyIndex) => {
                if (Math.sqrt((bullet.x - enemy.x) ** 2 + (bullet.y - enemy.y) ** 2) < 25) {
                    bullets.splice(index, 1);
                    enemies.splice(enemyIndex, 1);
                    score += 10;
                }
            });

// Check if bullet is out of bounds
            if (bullet.y < 0) {
                bullets.splice(index, 1);
            }
        });

drawScore();

enemies.forEach((enemy, index) => {
            enemy.y += 2;
            drawEnemy(enemy);

// Check for player-enemy collision
            if (Math.sqrt((player.x - enemy.x) ** 2 + (player.y - enemy.y) ** 2) < 35) {
                player.hp -= 10;
                enemies.splice(index, 1);
            }

// Check if enemy is out of bounds
            if (enemy.y > canvas.height) {
                enemies.splice(index, 1);
            }
        });

if (player.hp <= 0) {
            alert('Game Over! Your score: ' + score);
            document.location.reload();
        }

if (score % 200 === 0) {
            switchWeapon();
        }

if (Math.random() < 0.02) {
            spawnEnemy();
        }

requestAnimationFrame(update);
    }

function drawScore() {
        ctx.font = '24px Arial';
        ctx.fillStyle = 'black';
        ctx.fillText('Score: ' + score, 10, 30);
        ctx.fillText('HP: ' + player.hp, 10, 60);
    }

function switchWeapon() {
        player.weapon = player.weapon === 'ak47' ? 'awp' : 'ak47';
    }

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