AI game creator

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

No:15223

←

Prev Next

→

暴走族
Developer User6485｜Date and time 23/9/7 19:35:18
Build time 53.586 sec｜Game capacity 4.28KB｜

Script

了解しました。以下に暴走族というゲームの実装例を示します。

このプログラムでは、最初にcanvas要素を作成し、JavaScript内でゲームの処理を実装しています。プレイヤーを操作して障害物を避けながらスコアを稼ぐというシンプルなゲームです。スマホでも遊ぶことが可能です。

←

Prev　Next

→ 　

Back　

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

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

了解しました。以下に暴走族というゲームの実装例を示します。

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>暴走族</title>
</head>
<body>
  <canvas id="gameCanvas"></canvas>

// プレイヤーの定義
      function Player(x, y, width, height, color) {
        this.x = x;
        this.y = y;
        this.width = width;
        this.height = height;
        this.color = color;

this.draw = function() {
          context.fillStyle = this.color;
          context.fillRect(this.x, this.y, this.width, this.height);
        };

this.moveLeft = function() {
          if (this.x > 0) {
            this.x -= 10;
          }
        };

this.moveRight = function() {
          if (this.x + this.width < canvas.width) {
            this.x += 10;
          }
        };
      }

// 障害物の定義
      function Obstacle(x, y, width, height, color) {
        this.x = x;
        this.y = y;
        this.width = width;
        this.height = height;
        this.color = color;

this.draw = function() {
          context.fillStyle = this.color;
          context.fillRect(this.x, this.y, this.width, this.height);
        };

this.update = function() {
          this.y += 5;
        };
      }

// キーボード操作時の処理
      function handleKeyDown(event) {
        if (event.key === 'ArrowLeft') {
          player.moveLeft();
        } else if (event.key === 'ArrowRight') {
          player.moveRight();
        }
      }

// 衝突判定
      function checkCollision(player, obstacle) {
        if (player.x + player.width < obstacle.x ||
            player.x > obstacle.x + obstacle.width ||
            player.y + player.height < obstacle.y ||
            player.y > obstacle.y + obstacle.height) {
          return false;
        }
        return true;
      }

// ゲームの初期化
      function init() {
        player = new Player(canvas.width / 2 - 25, canvas.height - 50, 50, 50, '#FF0000');
        obstacles = [];
        score = 0;

document.addEventListener('keydown', handleKeyDown);

intervalId = setInterval(update, 1000 / 60);
      }

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

player.draw();

if (Math.random() < 0.03) {
          var obstacleX = Math.random() * (canvas.width - 50);
          var obstacleY = -Math.random() * 100;
          var obstacleWidth = Math.random() * (canvas.width / 4 - 20) + 20;
          var obstacleHeight = Math.random() * 20 + 20;
          var obstacleColor = '#' + (Math.random() * 0xFFFFFF << 0).toString(16).padStart(6, '0');
          obstacles.push(new Obstacle(obstacleX, obstacleY, obstacleWidth, obstacleHeight, obstacleColor));
        }

for (var i = obstacles.length - 1; i >= 0; i--) {
          var obstacle = obstacles[i];
          obstacle.update();
          obstacle.draw();

if (obstacle.y - obstacle.height > canvas.height) {
            obstacles.splice(i, 1);
            score++;
          }

if (checkCollision(player, obstacle)) {
            gameOver();
            return;
          }
        }

context.font = '24px Arial';
        context.fillStyle = '#FFFFFF';
        context.fillText('Score: ' + score, 10, 30);
      }

// ゲームオーバー
      function gameOver() {
        clearInterval(intervalId);
        document.removeEventListener('keydown', handleKeyDown);
        alert('ゲームオーバー\nScore: ' + score);
      }

// ゲームの開始
      init();
    })();
  </script>
</body>
</html>
```