Игра где бегает 2 круг за нашим персонажем которым мы можем управлять's game

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

No:18021

←

Prev Next

→

Игра где бегает 2 круг за нашим персонажем которым..ALL
Developer User7899｜Date and time 23/9/26 4:24:08
Build time 26.444 sec｜Game capacity 3.561KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Игра "Побег от кругов"</title>
    <style>
        canvas {
            border: 1px solid black;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>
    <script>
        window.onload = function() {
            var canvas = document.getElementById("gameCanvas");
            var context = canvas.getContext("2d");

var player = {
                x: 200,
                y: 200,
                speed: 5
            };

var circles = [
                { x: 50, y: 50, radius: 20, color: 'red', speedX: 2, speedY: 1 },
                { x: 150, y: 100, radius: 30, color: 'blue', speedX: -1, speedY: 1.5 }
            ];

function drawPlayer() {
                context.beginPath();
                context.arc(player.x, player.y, 15, 0, Math.PI*2, false);
                context.fillStyle = "#000";
                context.fill();
                context.closePath();
            }

function drawCircles() {
                circles.forEach(function(circle) {
                    context.beginPath();
                    context.arc(circle.x, circle.y, circle.radius, 0, Math.PI*2, false);
                    context.fillStyle = circle.color;
                    context.fill();
                    context.closePath();
                });
            }

function updateCircles() {
                circles.forEach(function(circle) {
                    circle.x += circle.speedX;
                    circle.y += circle.speedY;

if(circle.x + circle.radius > canvas.width || circle.x - circle.radius < 0){
                        circle.speedX *= -1;
                    }
                    
                    if(circle.y + circle.radius > canvas.height || circle.y - circle.radius < 0){
                        circle.speedY *= -1;
                    }
                });
            }

function detectCollision() {
                circles.forEach(function(circle) {
                    var dx = player.x - circle.x;
                    var dy = player.y - circle.y;
                    var distance = Math.sqrt(dx*dx + dy*dy);

if(distance < player.radius + circle.radius) {
                        alert('Вы проиграли!');
                        document.location.reload();
                    }
                });
            }

function draw() {
                context.clearRect(0, 0, canvas.width, canvas.height);
                
                drawPlayer();
                drawCircles();
                
                updateCircles();
                detectCollision();
                
                requestAnimationFrame(draw);
            }
            
            document.addEventListener('keydown', movePlayer);

draw();
        }
    </script>
</body>
</html>