AI game creator

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

No:41669

←

Prev Next

→

Generative Art
Developer User18668｜Date and time 24/2/9 2:22:47
Build time 8.244 sec｜Game capacity 1.923KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

<!DOCTYPE html>
<html>
  <head>
    <title>Generative Art Game</title>
    <style>
      canvas {
        border: 1px solid #000;
      }
    </style>
  </head>
  <body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>
    <script>
      // Get the canvas element
      var canvas = document.getElementById("gameCanvas");
      var context = canvas.getContext("2d");
      
      // Initialize game variables
      var x = canvas.width / 2;
      var y = canvas.height / 2;
      var radius = 50;
      var dx = 2;
      var dy = -2;
      
      // Function to draw the ball on the canvas
      function drawBall() {
        context.beginPath();
        context.arc(x, y, radius, 0, Math.PI * 2);
        context.fillStyle = getRandomColor();
        context.fill();
        context.closePath();
      }
      
      // Generate a random color
      function getRandomColor() {
        var letters = "0123456789ABCDEF";
        var color = "#";
        for (var i = 0; i < 6; i++) {
          color += letters[Math.floor(Math.random() * 16)];
        }
        return color;
      }
      
      // Function to update the game state and redraw the canvas
      function update() {
        // Clear the canvas
        context.clearRect(0, 0, canvas.width, canvas.height);
        
        // Move the ball
        x += dx;
        y += dy;
        
        // Reverse direction if ball hits the edges of the canvas
        if (x + radius > canvas.width || x - radius < 0) {
          dx = -dx;
        }
        if (y + radius > canvas.height || y - radius < 0) {
          dy = -dy;
        }
        
        // Draw the ball
        drawBall();
      }
      
      // Function to start the game
      function startGame() {
        // Set the game update interval to 10 milliseconds
        setInterval(update, 10);
      }
      
      // Start the game
      startGame();
    </script>
  </body>
</html>