AI game creator

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

No:24816

←

Prev Next

→

Pac-Man
Developer User11897｜Date and time 23/11/12 16:52:30
Build time 62.563 sec｜Game capacity 2.823KB｜

Script

Sure, here's a simple implementation of Pac-Man game using JavaScript and pictograms:

Make sure to replace `"emozi_all/pacman.png"` and `"emozi_all/ghost.png"` with the actual paths to the pictogram images on your system. You can also modify the size, speed, and starting positions of Pac-Man and ghosts based on your preferences. Have fun playing the game!

←

Prev　Next

→ 　

Back　

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

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

Sure, here's a simple implementation of Pac-Man game using JavaScript and pictograms:

```html
<!DOCTYPE html>
<html>
<head>
  <style>
    body {
      background-color: black;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="400"></canvas>
</body>
<script>
  const canvas = document.getElementById("gameCanvas");
  const ctx = canvas.getContext("2d");

// Load pictograms
  const pacmanImg = new Image();
  pacmanImg.src = "pacman.png";

const ghostImg = new Image();
  ghostImg.src = "ghost.png";

// Game objects
  const pacman = {
    x: 200,
    y: 200,
    dx: 0,
    dy: 0,
    size: 25,
    speed: 2,
  };

const ghosts = [
    { x: 100, y: 100, dx: 1, dy: 1, size: 25 },
    { x: 300, y: 300, dx: -1, dy: -1, size: 25 },
  ];

// Game loop
  function draw() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);

// Draw Pac-Man
    ctx.drawImage(pacmanImg, pacman.x, pacman.y, pacman.size, pacman.size);

// Draw ghosts
    ghosts.forEach((ghost) => {
      ctx.drawImage(ghostImg, ghost.x, ghost.y, ghost.size, ghost.size);
    });

// Move Pac-Man
    pacman.x += pacman.dx * pacman.speed;
    pacman.y += pacman.dy * pacman.speed;

// Move ghosts
    ghosts.forEach((ghost) => {
      ghost.x += ghost.dx;
      ghost.y += ghost.dy;
    });

// Boundary detection
    if (pacman.x < 0) pacman.x = canvas.width - pacman.size;
    if (pacman.x > canvas.width - pacman.size) pacman.x = 0;
    if (pacman.y < 0) pacman.y = canvas.height - pacman.size;
    if (pacman.y > canvas.height - pacman.size) pacman.y = 0;

// Collision detection with ghosts
    ghosts.forEach((ghost) => {
      if (
        pacman.x < ghost.x + ghost.size &&
        pacman.x + pacman.size > ghost.x &&
        pacman.y < ghost.y + ghost.size &&
        pacman.y + pacman.size > ghost.y
      ) {
        // Game over logic here
        console.log("Game Over!");
      }
    });

requestAnimationFrame(draw);
  }

// Event listeners for smartphone operation
  document.addEventListener("keydown", (event) => {
    if (event.key === "ArrowUp") {
      pacman.dx = 0;
      pacman.dy = -1;
    } else if (event.key === "ArrowDown") {
      pacman.dx = 0;
      pacman.dy = 1;
    } else if (event.key === "ArrowLeft") {
      pacman.dx = -1;
      pacman.dy = 0;
    } else if (event.key === "ArrowRight") {
      pacman.dx = 1;
      pacman.dy = 0;
    }
  });

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

Make sure to replace `"pacman.png"` and `"ghost.png"` with the actual paths to the pictogram images on your system. You can also modify the size, speed, and starting positions of Pac-Man and ghosts based on your preferences. Have fun playing the game!