Creat random rotating 3d object on a 2d canvas refrsh button's game

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

No:48718

102

←

Prev Next

→

Creat random rotating 3d object on a 2d canvas ref..ALL
Developer User18896｜Date and time 24/3/2 21:20:00
Build time 4.45 sec｜Game capacity 1.228KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>3D Object Rotator Game</title>
    <style>
        canvas {
            width: 100%;
            height: 100%;
            display: block;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas"></canvas>

let angle = 0;

function draw() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            
            ctx.save();
            ctx.translate(canvas.width / 2, canvas.height / 2);
            ctx.rotate(angle);
            
            // Draw 3D object (a simple square for demonstration)
            ctx.fillStyle = '#FF0000';
            ctx.fillRect(-50, -50, 100, 100);
            
            ctx.restore();
            
            angle += 0.01;
            
            requestAnimationFrame(draw);
        }

draw();

const refreshButton = document.createElement('button');
        refreshButton.innerHTML = 'Refresh';
        refreshButton.addEventListener('click', () => {
            angle = 0;
        });

document.body.appendChild(refreshButton);
    </script>
</body>
</html>