The more legs a person has running, the faster and faster they go.'s game

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

No:4864

3201

←

Prev Next

→

The more legs a person has running, the faster and..ALL
Developer sayaensm｜Date and time 23/6/28 22:59:43
Build time 35.706 sec｜Game capacity 4.292KB｜

Script

了解しました。以下は、JavaScriptを用いた簡単なランニングゲームの実装例です。

上記のコードは、矩形のプレイヤーが上下に移動しながら、左から右に向かって流れてくる障害物との衝突を避ける単純なランニングゲームです。ゲームはSpaceキーを押すことでプレイヤーの速度が上昇し、足が増えるかのように速くなります。障害物に衝突するとゲームオーバーとなり、ページがリロードされます。このゲームでは、`canvas`要素を使用して描画しています。JavaScriptによるゲームの実装方法は様々ありますが、この例を基に独自のゲームを作成することができます。

←

Prev　Next

→ 　

Back　

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

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

了解しました。以下は、JavaScriptを用いた簡単なランニングゲームの実装例です。

```html
<!DOCTYPE html>
<html>
<head>
    <title>ランニングゲーム</title>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="200"></canvas>

// 初期化
            init: function() {
                this.context = this.canvas.getContext("2d");
                this.player = {
                    x: 50,
                    y: this.canvas.height / 2,
                    size: 20,
                    speed: 0,
                    acceleration: 0.1
                };

// 障害物の生成
                setInterval(function() {
                    var obstacle = {
                        x: game.canvas.width,
                        y: Math.random() * game.canvas.height,
                        width: 20,
                        height: 20
                    };
                    game.obstacles.push(obstacle);
                }, 2000);

// イベントリスナーの設定
                window.addEventListener("keydown", function(event) {
                    if (event.keyCode === 32) {  // スペースキーが押された場合
                        game.player.speed = -5;  // 足を増やすと速度が上がる
                    }
                });
            },

// ゲームループ
            loop: function() {
                // 背景の描画
                this.context.fillStyle = "white";
                this.context.fillRect(0, 0, this.canvas.width, this.canvas.height);

// プレイヤーの描画
                this.context.fillStyle = "red";
                this.context.fillRect(this.player.x, this.player.y, this.player.size, this.player.size);

// 障害物の描画
                this.context.fillStyle = "blue";
                for (var i = 0; i < this.obstacles.length; i++) {
                    var obstacle = this.obstacles[i];
                    this.context.fillRect(obstacle.x, obstacle.y, obstacle.width, obstacle.height);
                }

// プレイヤーの位置更新
                this.player.speed += this.player.acceleration;
                this.player.y += this.player.speed;

// 障害物の位置更新
                for (var i = 0; i < this.obstacles.length; i++) {
                    var obstacle = this.obstacles[i];
                    obstacle.x -= this.speed;
                }

// 衝突判定
                for (var i = 0; i < this.obstacles.length; i++) {
                    var obstacle = this.obstacles[i];

if (this.player.x < obstacle.x + obstacle.width &&
                        this.player.x + this.player.size > obstacle.x &&
                        this.player.y < obstacle.y + obstacle.height &&
                        this.player.y + this.player.size > obstacle.y) {
                        alert("ゲームオーバー！");
                        location.reload();
                    }
                }

// ゲームループの継続
                requestAnimationFrame(function() {
                    game.loop();
                });
            }
        };

// ゲームの初期化と開始
        game.init();
        game.loop();
    </script>
</body>
</html>
```

上記のコードは、矩形のプレイヤーが上下に移動しながら、左から右に向かって流れてくる障害物との衝突を避ける単純なランニングゲームです。ゲームはSpaceキーを押すことでプレイヤーの速度が上昇し、足が増えるかのように速くなります。障害物に衝突するとゲームオーバーとなり、ページがリロードされます。

このゲームでは、`canvas`要素を使用して描画しています。JavaScriptによるゲームの実装方法は様々ありますが、この例を基に独自のゲームを作成することができます。