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

No:24845

←

Prev Next

→

particle
Developer User11928｜Date and time 23/11/13 1:50:18
Build time 62.393 sec｜Game capacity 3.343KB｜

Script

Sure, here's a simple game implementation using JavaScript, HTML, and pictograms. You can copy and paste the code into a single HTML file and open it in a browser to play.

Particle Game

Score: 0

Hope you enjoy playing the Particle Game!

←

Prev　Next

→ 　

Back　

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

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

Sure, here's a simple game implementation using JavaScript, HTML, and pictograms. You can copy and paste the code into a single HTML file and open it in a browser to play.

```html
<!DOCTYPE html>
<html>
  <head>
    <title>Particle Game</title>
    <style>
      body {
        text-align: center;
        font-family: Arial, sans-serif;
      }
      
      #gameCanvas {
        border: 1px solid black;
        margin: 20px auto;
      }
      
      #score {
        font-size: 18px;
      }
    </style>
  </head>
  <body>
    <h1>Particle Game</h1>
    <canvas id="gameCanvas" width="400" height="400"></canvas>
    <p id="score">Score: 0</p>
    
    <script>
      // Game variables
      let canvas, ctx;
      let particles = [];
      let score = 0;
      
      // Pictogram icons
      const icons = [
        "🌟", "💥", "🔥", "💫", "✨"
      ];
      
      // Game constants
      const PARTICLE_SIZE = 30;
      const SPEED = 2;
      const MAX_PARTICLES = 10;
      
      // Initialize the game
      function startGame() {
        canvas = document.getElementById("gameCanvas");
        ctx = canvas.getContext("2d");
        
        // Add event listener for mouse clicks
        canvas.addEventListener("mousedown", onMouseDown);
        
        // Start the game loop
        setInterval(updateGame, 20);
      }
      
      // Update the game state
      function updateGame() {
        // Clear the canvas
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        
        // Create new particles if needed
        if (particles.length < MAX_PARTICLES) {
          createParticle();
        }
        
        // Update and draw particles
        particles.forEach((particle, index) => {
          // Move particle
          particle.y += SPEED;
          
          // Check collision with the bottom edge
          if (particle.y + PARTICLE_SIZE > canvas.height) {
            particles.splice(index, 1);
            score -= 10;
          }
          
          // Draw particle
          ctx.font = `${PARTICLE_SIZE}px sans-serif`;
          ctx.fillText(icons[particle.type], particle.x, particle.y);
        });
        
        // Update score
        document.getElementById("score").innerText = `Score: ${score}`;
      }
      
      // Create a new particle
      function createParticle() {
        const x = Math.random() * (canvas.width - PARTICLE_SIZE);
        const type = Math.floor(Math.random() * icons.length);
        particles.push({ x, y: 0, type });
      }
      
      // Handle mouse click events
      function onMouseDown(event) {
        const rect = canvas.getBoundingClientRect();
        const mouseX = event.clientX - rect.left;
        const mouseY = event.clientY - rect.top;
        
        // Check if user clicked on a particle
        particles.forEach((particle, index) => {
          if (
            mouseX >= particle.x &&
            mouseX <= particle.x + PARTICLE_SIZE &&
            mouseY >= particle.y &&
            mouseY <= particle.y + PARTICLE_SIZE
          ) {
            // Remove particle and increment score
            particles.splice(index, 1);
            score += 10;
          }
        });
      }
      
      // Start the game
      startGame();
    </script>
  </body>
</html>
```

Hope you enjoy playing the Particle Game!