Seven Segment Display's game

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

No:50506

←

Prev Next

→

Seven Segment Display
Developer User21309｜Date and time 24/3/8 16:39:57
Build time 10.732 sec｜Game capacity 1.854KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <title>Seven Segment Display Game</title>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

// Draw the segments of a seven segment display
        function drawSegment(x, y, segments) {
            ctx.beginPath();
            if (segments.includes(1)) ctx.moveTo(x, y);
            if (segments.includes(2)) ctx.moveTo(x + 30, y);
            if (segments.includes(3)) ctx.moveTo(x + 30, y + 30);
            if (segments.includes(4)) ctx.moveTo(x, y + 60);
            if (segments.includes(5)) ctx.moveTo(x, y + 30);
            if (segments.includes(6)) ctx.moveTo(x, y);
            ctx.stroke();
        }

// Draw a number using seven segment display
        function drawNumber(number) {
            const segmentsToDraw = {
                0: [1, 2, 3, 4, 5, 6],
                1: [2, 3],
                2: [1, 2, 4, 5, 7],
                3: [1, 2, 3, 4, 6],
                4: [2, 3, 6, 7],
                5: [1, 3, 4, 6, 7],
                6: [1, 3, 4, 5, 6, 7],
                7: [1, 2, 3],
                8: [1, 2, 3, 4, 5, 6, 7],
                9: [1, 2, 3, 4, 6, 7]
            };

const segmentToDraw = segmentsToDraw[number];
            if (segmentToDraw) {
                drawSegment(50, 50, segmentToDraw);
            }
        }

// Main game loop
        function gameLoop() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);

// Random number to display
            const number = Math.floor(Math.random() * 10);
            drawNumber(number);

requestAnimationFrame(gameLoop);
        }

gameLoop(); // Start the game loop
    </script>
</body>
</html>