Sky Bee! Prevent nuclear accidents!'s game

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

No:6476

451

←

Prev Next

→

Sky Bee! Prevent nuclear accidents!
Developer User3589｜Date and time 23/7/2 14:29:39
Build time 42.2 sec｜Game capacity 5.215KB｜

Script

了解しました。以下に、天空の蜂と原発事故を防ぐというテーマのゲームの実装例を示します。

このゲームでは、プレイヤーは画面下部の黄色い蜂を操作し、画面上部から降ってくる赤い蜂と衝突しないようにすることが目的です。左右の矢印キーを使用して、プレイヤーを移動させることができます。赤い蜂に衝突するとゲームオーバーになり、スコアが表示されます。定期的に赤い蜂が生成され、スコアが加算されます。

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

了解しました。以下に、天空の蜂と原発事故を防ぐというテーマのゲームの実装例を示します。

```html
<!DOCTYPE html>
<html>
<head>
    <title>天空の蜂</title>
    <style>
        #canvas {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: #000;
        }
    </style>
</head>
<body>
    <canvas id="canvas"></canvas>

// canvasの取得
        var canvas = document.getElementById("canvas");
        var context = canvas.getContext("2d");

// ゲームの状態を管理する変数
        var player;
        var enemies = [];
        var score = 0;
        var isGameOver = false;

// プレイヤークラス
        class Player {
            constructor() {
                this.x = canvas.width / 2;
                this.y = canvas.height - 50;
                this.radius = 20;
                this.speed = 5;
            }

draw() {
                context.beginPath();
                context.arc(this.x, this.y, this.radius, 0, Math.PI * 2, false);
                context.fillStyle = "yellow";
                context.fill();
            }

update() {
                if (leftPressed && this.x > this.radius) {
                    this.x -= this.speed;
                }

if (rightPressed && this.x < canvas.width - this.radius) {
                    this.x += this.speed;
                }
            }
        }

// 敵クラス
        class Enemy {
            constructor(x, y, radius, speed) {
                this.x = x;
                this.y = y;
                this.radius = radius;
                this.speed = speed;
            }

draw() {
                context.beginPath();
                context.arc(this.x, this.y, this.radius, 0, Math.PI * 2, false);
                context.fillStyle = "red";
                context.fill();
            }

update() {
                this.y += this.speed;

// プレイヤーとの衝突判定
                if (
                    this.y + this.radius > player.y - player.radius &&
                    this.y - this.radius < player.y + player.radius &&
                    this.x + this.radius > player.x - player.radius &&
                    this.x - this.radius < player.x + player.radius
                ) {
                    gameOver();
                }
            }
        }

// イベントリスナーの設定
        var leftPressed = false;
        var rightPressed = false;

document.addEventListener("keydown", function(event) {
            if (event.key === "ArrowLeft") {
                leftPressed = true;
            }

if (event.key === "ArrowRight") {
                rightPressed = true;
            }
        });

document.addEventListener("keyup", function(event) {
            if (event.key === "ArrowLeft") {
                leftPressed = false;
            }

if (event.key === "ArrowRight") {
                rightPressed = false;
            }
        });

// ゲームオーバー時の処理
        function gameOver() {
            isGameOver = true;
            alert("ゲームオーバー！ スコア: " + score);
        }

// 初期化処理
        function init() {
            player = new Player();

// 敵の生成
            setInterval(function() {
                if (!isGameOver) {
                    var x = Math.random() * canvas.width;
                    var y = 0;
                    var radius = 10;
                    var speed = Math.random() * 3 + 1;

var enemy = new Enemy(x, y, radius, speed);
                    enemies.push(enemy);
                }
            }, 1000 / 2);

// ゲームループの開始
            setInterval(update, 1000 / 60);
        }

// ゲームの更新処理
        function update() {
            context.clearRect(0, 0, canvas.width, canvas.height);

if (!isGameOver) {
                player.update();
                player.draw();

enemies.forEach(function(enemy) {
                    enemy.update();
                    enemy.draw();
                });

// スコアの表示
                context.fillStyle = "white";
                context.font = "24px Arial";
                context.fillText("スコア: " + score, 10, 30);

// スコアの加算
                score++;
            }
        }

// ゲームの初期化処理実行
        init();
    </script>
</body>
</html>
```