A game where you are a tiny cartoon planet that is dodging asteroids and redirecting them with gravity to attack other tiny planets's game

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

No:17936

←

Prev Next

→

A game where you are a tiny cartoon planet that is..ALL
Developer User7841｜Date and time 23/9/25 7:29:38
Build time 31.272 sec｜Game capacity 3.401KB｜

Script

Sure! Here's an example of a game implemented as a single HTML file that meets your requirements. In this game, you control a cartoon planet by changing its position to dodge asteroids and redirect them using gravity to attack other planets. The game is designed for smartphone operation and uses pictograms for the visuals.

To play the game, you can open the above code in your browser, which will display a game canvas. Use your smartphone touch controls to move the planet and avoid asteroids. The goal is to collide the asteroids with other tiny planets. You can customize the game further by adding additional features, levels, or graphics as desired.

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Planet Defender</title>
  <style>
    canvas {
      border: 1px solid black;
      display: block;
      margin: 0 auto;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="300" height="400"></canvas>
  <script>
    // Game Variables
    const canvas = document.getElementById("gameCanvas");
    const ctx = canvas.getContext("2d");

const planetRadius = 20;
    const maxAsteroidSize = 30;
    const maxAsteroids = 5;
    const asteroidSpeed = 2;
    const gravityStrength = 0.2;

const planet = {
      x: canvas.width / 2,
      y: canvas.height / 2,
      radius: planetRadius,
    };

let asteroids = [];

// Game Functions
    function drawPlanet() {
      ctx.beginPath();
      ctx.arc(planet.x, planet.y, planet.radius, 0, Math.PI * 2);
      ctx.fillStyle = "green";
      ctx.fill();
      ctx.closePath();
    }

function drawAsteroids() {
      for (let i = 0; i < asteroids.length; i++) {
        const asteroid = asteroids[i];
        ctx.beginPath();
        ctx.arc(asteroid.x, asteroid.y, asteroid.size, 0, Math.PI * 2);
        ctx.fillStyle = "gray";
        ctx.fill();
        ctx.closePath();
      }
    }

function movePlanet(event) {
      planet.x = event.touches[0].clientX;
      planet.y = event.touches[0].clientY;
    }

function createAsteroid() {
      const size = Math.random() * maxAsteroidSize + 10;
      const direction = Math.random() * 2 * Math.PI;
      const x = Math.cos(direction) * (canvas.width / 2 + size) + canvas.width / 2;
      const y = Math.sin(direction) * (canvas.height / 2 + size) + canvas.height / 2;
      const dx = Math.cos(direction) * asteroidSpeed;
      const dy = Math.sin(direction) * asteroidSpeed;
      asteroids.push({ x, y, size, dx, dy });
    }

function redirectAsteroids() {
      for (let i = 0; i < asteroids.length; i++) {
        const asteroid = asteroids[i];
        const dx = planet.x - asteroid.x;
        const dy = planet.y - asteroid.y;
        const distance = Math.sqrt(dx * dx + dy * dy);

if (distance < planet.radius + asteroid.size) {
          asteroids.splice(i, 1);
          i--;
        } else {
          asteroid.x += (dx / distance) * gravityStrength;
          asteroid.y += (dy / distance) * gravityStrength;
        }
      }
    }

function draw() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      drawPlanet();
      drawAsteroids();
    }

function update() {
      createAsteroid();
      redirectAsteroids();
      draw();
    }

// Game Initialization
    canvas.addEventListener("touchmove", movePlanet);

setInterval(update, 10);
  </script>
</body>
</html>
```