AI game creator

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

No:32016

←

Prev Next

→

particle
Developer User15299｜Date and time 23/12/29 6:29:33
Build time 9.334 sec｜Game capacity 1.491KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>Juego de Partículas</title>
</head>
<body>
  <canvas id="particleCanvas" width="400" height="600"></canvas>

canvas.addEventListener("click", createParticle);

function createParticle(event) {
      const xPos = event.clientX - canvas.offsetLeft;
      const yPos = event.clientY - canvas.offsetTop;
      particles.push({ x: xPos, y: yPos, radius: getRandomNumber(10, 20), color: getRandomColor() });
    }

function getRandomNumber(min, max) {
      return Math.random() * (max - min) + min;
    }

function getRandomColor() {
      const colors = ["#ff0000", "#00ff00", "#0000ff", "#ffff00", "#ff00ff", "#00ffff"];
      return colors[Math.floor(Math.random() * colors.length)];
    }

function updateParticles() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);

particles.forEach(particle => {
        ctx.beginPath();
        ctx.arc(particle.x, particle.y, particle.radius, 0, Math.PI * 2);
        ctx.fillStyle = particle.color;
        ctx.fill();
        ctx.closePath();

particle.y += 2; // Move particles downwards

if (particle.y > canvas.height) {
          particle.y = 0; // Reset particles once they reach the bottom
        }
      });

requestAnimationFrame(updateParticles);
    }

updateParticles();
  </script>
</body>
</html>