AI game creator

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

No:30715

←

Prev Next

→

A 3d shooter game
Developer User14927｜Date and time 23/12/24 1:26:03
Build time 22.013 sec｜Game capacity 3.826KB｜

Script

Sure! Here's a simple 3D shooter game implemented as a single HTML file using JavaScript:

This code sets up a basic 3D shooter game where you control a blue player square using the Arrow keys on your smartphone. Pressing the spacebar button will shoot red bullets from the player. The objective is to destroy the green enemy squares that spawn from the top of the canvas. If an enemy reaches the bottom of the canvas, the game is over, and an alert will appear.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's a simple 3D shooter game implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>3D Shooter Game</title>
  <style>
    body {
      margin: 0;
    }
    canvas {
      display: block;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="800" height="600"></canvas>
  
  <script>
    // Game code starts here
    const canvas = document.getElementById('gameCanvas');
    const ctx = canvas.getContext('2d');

let playerX = canvas.width / 2;
    let playerY = canvas.height / 2;
    let playerSize = 25;

let bullets = [];
    let bulletSize = 5;
    let bulletSpeed = 10;

let enemies = [];
    let enemySize = 25;
    let enemySpeed = 2;
    let enemySpawnInterval = 1000;
    let lastSpawnTime = 0;

function update() {
      // Clear canvas
      ctx.clearRect(0, 0, canvas.width, canvas.height);

// Update player position
      if (playerX < 0) playerX = 0;
      if (playerY < 0) playerY = 0;
      if (playerX + playerSize > canvas.width) playerX = canvas.width - playerSize;
      if (playerY + playerSize > canvas.height) playerY = canvas.height - playerSize;

// Draw player
      ctx.fillStyle = 'blue';
      ctx.fillRect(playerX, playerY, playerSize, playerSize);

// Draw bullets
      ctx.fillStyle = 'red';
      bullets.forEach(bullet => {
        bullet.y -= bulletSpeed;
        ctx.fillRect(bullet.x, bullet.y, bulletSize, bulletSize);
      });

// Draw enemies
      ctx.fillStyle = 'green';
      enemies.forEach(enemy => {
        enemy.y += enemySpeed;
        ctx.fillRect(enemy.x, enemy.y, enemySize, enemySize);
      });

// Collision detection
      bullets.forEach(bullet => {
        enemies.forEach(enemy => {
          if (
            bullet.x < enemy.x + enemySize &&
            bullet.x + bulletSize > enemy.x &&
            bullet.y < enemy.y + enemySize &&
            bullet.y + bulletSize > enemy.y
          ) {
            // Collision detected
            bullets.splice(bullets.indexOf(bullet), 1);
            enemies.splice(enemies.indexOf(enemy), 1);
          }
        });
      });

// Game over condition
      enemies.forEach(enemy => {
        if (enemy.y + enemySize >= canvas.height) {
          // Game over
          alert('Game Over');
          reset();
        }
      });

// Request next animation frame
      requestAnimationFrame(update);
    }

function reset() {
      playerX = canvas.width / 2;
      playerY = canvas.height / 2;
      bullets = [];
      enemies = [];
      lastSpawnTime = performance.now();
    }

function shoot() {
      bullets.push({ x: playerX + playerSize / 2 - bulletSize / 2, y: playerY });
    }

function spawnEnemy() {
      enemies.push({ x: Math.random() * (canvas.width - enemySize), y: 0 });
    }

// Keyboard event listeners
    document.addEventListener('keydown', (event) => {
      if (event.key === 'ArrowUp') {
        playerY -= 10;
      } else if (event.key === 'ArrowDown') {
        playerY += 10;
      } else if (event.key === 'ArrowLeft') {
        playerX -= 10;
      } else if (event.key === 'ArrowRight') {
        playerX += 10;
      } else if (event.key === ' ') {
        shoot();
      }
    });

// Start game loop
    reset();
    update();

// Enemy spawning interval
    setInterval(() => {
      spawnEnemy();
    }, enemySpawnInterval);
  </script>
</body>
</html>
```