AI game creator

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

No:16933

←

Prev Next

→

Shooting Game
Developer User7549｜Date and time 23/9/21 21:52:43
Build time 50.042 sec｜Game capacity 4.849KB｜

Script

Sure! Here's an example of a simple shooting game implemented as a single HTML file using JavaScript:

In this game, you control a blue circle (representing the player) with your finger on a touchscreen device. The player can move horizontally and vertically by dragging their finger. By tapping on the screen, you shoot red bullets to destroy green circles (enemies). The goal is to score as many points as possible by hitting the enemies without getting hit. The score is displayed at the top left corner of the screen. Please note that this is a simple example and can be expanded further based on your specific requirements and preferences.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

Sure! Here's an example of a simple shooting game implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Shooting Game</title>
  <style>
    canvas {
      border: 1px solid black;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="400"></canvas>

// Initialization
    function init() {
      canvas = document.getElementById("gameCanvas");
      context = canvas.getContext("2d");

player = {
        x: canvas.width / 2,
        y: canvas.height - 20,
        radius: 10,
        speed: 5
      };

bullets = [];
      enemies = [];
      score = 0;

canvas.addEventListener("mousemove", handleMouseMove);
      canvas.addEventListener("click", shootBullet);

setInterval(update, 16);
    }

// Update game state
    function update() {
      context.clearRect(0, 0, canvas.width, canvas.height);

updatePlayer();
      updateBullets();
      updateEnemies();

drawPlayer();
      drawBullets();
      drawEnemies();

handleCollisions();
      updateScore();
    }

// Player movement
    function handleMouseMove(event) {
      var rect = canvas.getBoundingClientRect();
      player.x = event.clientX - rect.left;
      player.y = event.clientY - rect.top;
    }

// Player shooting
    function shootBullet() {
      bullets.push({ x: player.x, y: player.y - player.radius, radius: 4, speed: 8 });
    }

// Update player position
    function updatePlayer() {
      if (player.x < player.radius) {
        player.x = player.radius;
      }
      if (player.x > canvas.width - player.radius) {
        player.x = canvas.width - player.radius;
      }
      if (player.y < player.radius) {
        player.y = player.radius;
      }
      if (player.y > canvas.height - player.radius) {
        player.y = canvas.height - player.radius;
      }
    }

// Update bullet positions
    function updateBullets() {
      for (var i = 0; i < bullets.length; i++) {
        bullets[i].y -= bullets[i].speed;

if (bullets[i].y < -bullets[i].radius) {
          bullets.splice(i, 1);
          i--;
        }
      }
    }

// Update enemy positions
    function updateEnemies() {
      if (Math.random() < 0.02) {
        enemies.push({ x: Math.random() * canvas.width, y: -10, radius: 10, speed: 2 });
      }

for (var i = 0; i < enemies.length; i++) {
        enemies[i].y += enemies[i].speed;

if (enemies[i].y > canvas.height + enemies[i].radius) {
          enemies.splice(i, 1);
          i--;
        }
      }
    }

// Check for collisions
    function handleCollisions() {
      for (var i = 0; i < bullets.length; i++) {
        for (var j = 0; j < enemies.length; j++) {
          var dx = bullets[i].x - enemies[j].x;
          var dy = bullets[i].y - enemies[j].y;
          var distance = Math.sqrt(dx * dx + dy * dy);

if (distance < bullets[i].radius + enemies[j].radius) {
            bullets.splice(i, 1);
            i--;
            enemies.splice(j, 1);
            j--;
            score++;
          }
        }
      }
    }

// Update score
    function updateScore() {
      context.fillStyle = "black";
      context.fillText("Score: " + score, 10, 20);
    }

// Draw player
    function drawPlayer() {
      context.beginPath();
      context.arc(player.x, player.y, player.radius, 0, 2 * Math.PI);
      context.fillStyle = "blue";
      context.fill();
      context.closePath();
    }

// Draw bullets
    function drawBullets() {
      for (var i = 0; i < bullets.length; i++) {
        context.beginPath();
        context.arc(bullets[i].x, bullets[i].y, bullets[i].radius, 0, 2 * Math.PI);
        context.fillStyle = "red";
        context.fill();
        context.closePath();
      }
    }

// Draw enemies
    function drawEnemies() {
      for (var i = 0; i < enemies.length; i++) {
        context.beginPath();
        context.arc(enemies[i].x, enemies[i].y, enemies[i].radius, 0, 2 * Math.PI);
        context.fillStyle = "green";
        context.fill();
        context.closePath();
      }
    }

// Start the game
    init();
  </script>
</body>
</html>
```

Please note that this is a simple example and can be expanded further based on your specific requirements and preferences.