AI game creator

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

No:12963

111

←

Prev Next

→

Pac-Man
Developer User5661｜Date and time 23/8/25 14:09:00
Build time 33.994 sec｜Game capacity 2.982KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

<!DOCTYPE html>
<html>
<head>
  <style>
    canvas {
      border: 1px solid black;
    }
  </style>
</head>
<body>
  <canvas id="pacman_canvas" width="400" height="400"></canvas>

// Function to draw Pac-Man
    function drawPacMan(context, xPos, yPos, mouthAngle, color) {
      drawCircle(context, xPos, yPos, 20, (0.2 + mouthAngle) * Math.PI, (1.8 - mouthAngle) * Math.PI, color);
      drawCircle(context, xPos + 10, yPos - 10, 3, 0, 2 * Math.PI, 'black');
    }

// Function to draw the game board
    function drawBoard(context) {
      var board = [
        [1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
        [1, 0, 0, 0, 1, 0, 0, 0, 0, 1],
        [1, 0, 1, 0, 1, 0, 1, 1, 0, 1],
        [1, 0, 1, 0, 0, 0, 0, 0, 0, 1],
        [1, 0, 1, 0, 1, 0, 1, 0, 1, 1],
        [1, 2, 0, 0, 1, 0, 0, 0, 0, 1],
        [1, 1, 1, 0, 1, 0, 1, 1, 0, 1],
        [1, 0, 0, 0, 0, 0, 0, 0, 0, 1],
        [1, 0, 1, 1, 1, 1, 1, 1, 0, 1],
        [1, 1, 1, 1, 1, 1, 1, 1, 1, 1]
      ];

var blockSize = 40;
      var wallColor = '#0000FF';
      var pillColor = '#FFFFFF';

for (var row = 0; row < board.length; row++) {
        for (var col = 0; col < board[row].length; col++) {
          var x = col * blockSize;
          var y = row * blockSize;

if (board[row][col] === 1) {
            drawCircle(context, x + blockSize / 2, y + blockSize / 2, blockSize / 2, 0, 2 * Math.PI, wallColor);
          } else if (board[row][col] === 2) {
            drawCircle(context, x + blockSize / 2, y + blockSize / 2, blockSize / 10, 0, 2 * Math.PI, pillColor);
          }
        }
      }
    }

// Function to handle user input
    function handleInput(event) {
      var keys = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'];
      if (keys.includes(event.key)) {
        event.preventDefault();
        // Add your logic to move Pac-Man based on the input
      }
    }

// Function to update game state
    function update() {
      // Add your game logic here to update Pac-Man's position, check collisions, etc.
    }

// Function to render game objects
    function render() {
      var canvas = document.getElementById('pacman_canvas');
      var context = canvas.getContext('2d');

context.clearRect(0, 0, canvas.width, canvas.height);

// Draw Pac-Man
      drawPacMan(context, 200, 200, 0.2, 'yellow');

// Draw game board
      drawBoard(context);
    }

// Main game loop
    function gameLoop() {
      update();
      render();
    }

// Add event listener for user input
    document.addEventListener('keydown', handleInput);

// Start the game loop
    setInterval(gameLoop, 1000 / 60);
  </script>
</body>
</html>