AI game creator

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

No:20043

←

Prev Next

→

particle
Developer User8925｜Date and time 23/10/8 1:16:57
Build time 16.691 sec｜Game capacity 2.473KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Particle Game</title>
    <style>
      #canvas {
        border: 1px solid #000;
      }
    </style>
  </head>
  <body>
    <canvas id="canvas" width="300" height="300"></canvas>

// Particle constructor
      function Particle(x, y, radius, color, dx, dy) {
        this.x = x;
        this.y = y;
        this.radius = radius;
        this.color = color;
        this.dx = dx;
        this.dy = dy;
      }

// Function to draw a particle
      Particle.prototype.draw = function() {
        ctx.beginPath();
        ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, false);
        ctx.fillStyle = this.color;
        ctx.fill();
        ctx.closePath();
      };

// Function to update particle positions
      Particle.prototype.update = function() {
        if (this.x + this.radius > canvas.width || this.x - this.radius < 0) {
          this.dx = -this.dx;
        }

if (this.y + this.radius > canvas.height || this.y - this.radius < 0) {
          this.dy = -this.dy;
        }

this.x += this.dx;
        this.y += this.dy;

this.draw();
      };

// Function to create particles
      function createParticles(numParticles) {
        for (var i = 0; i < numParticles; i++) {
          var x = Math.random() * canvas.width;
          var y = Math.random() * canvas.height;
          var radius = Math.random() * 10 + 5;
          var color = "#" + ((1 << 24) * Math.random() | 0).toString(16);
          var dx = (Math.random() - 0.5) * 2;
          var dy = (Math.random() - 0.5) * 2;

particles.push(new Particle(x, y, radius, color, dx, dy));
        }
      }

// Start the game
      function startGame() {
        createParticles(10);
        setInterval(updateGameArea, 20); // Update the game every 20 milliseconds
      }

// Function to clear the canvas
      function clearCanvas() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
      }

// Function to update the game area
      function updateGameArea() {
        clearCanvas();
        particles.forEach(function(particle) {
          particle.update();
        });
      }

// Call the startGame function to begin the game
      startGame();
    </script>
  </body>
</html>