Square vs circle, speed circle and gun circle's game

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

No:52784

288

←

Prev Next

→

Square vs circle, speed circle and gun circle
Developer User21425｜Date and time 24/3/25 1:04:41
Build time 13.391 sec｜Game capacity 2.253KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

<!DOCTYPE html>
<html lang="pt">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Game: Quadrado vs Círculo</title>
</head>

let square = {
            x: 50,
            y: 50,
            size: 50,
            color: 'blue',
            speed: 5
        };

let circle = {
            x: 200,
            y: 200,
            radius: 30,
            color: 'red',
            speed: 2
        };

let gun = {
            x: 400,
            y: 400,
            size: 20,
            color: 'black'
        };

function drawSquare() {
            ctx.fillStyle = square.color;
            ctx.fillRect(square.x, square.y, square.size, square.size);
        }

function drawCircle() {
            ctx.beginPath();
            ctx.arc(circle.x, circle.y, circle.radius, 0, Math.PI * 2);
            ctx.fillStyle = circle.color;
            ctx.fill();
        }

function drawGun() {
            ctx.fillStyle = gun.color;
            ctx.fillRect(gun.x, gun.y, gun.size, gun.size);
        }

function update() {
            clear();
            moveSquare();
            drawSquare();
            drawCircle();
            drawGun();
            checkCollision();
        }

function moveSquare() {
            square.x += square.speed;
            if (square.x > canvas.width) {
                square.x = 0;
            }
        }

function checkCollision() {
            let dx = circle.x - square.x;
            let dy = circle.y - square.y;
            let distance = Math.sqrt(dx * dx + dy * dy);

if (distance < circle.radius + square.size) {
                alert('Game Over!');
                square.x = 50;
                square.y = 50;
            }
        }

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

setInterval(update, 1000 / 60);
    </script>
</body>

</html>