AI game creator

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

No:23236

←

Prev Next

→

Generative Art
Developer User10764｜Date and time 23/10/29 7:38:51
Build time 38.137 sec｜Game capacity 2.227KB｜

Script

Sure! Here's an example of a simple generative art game implemented as a single HTML file using JavaScript and enclosed in script tags:

This game creates a canvas and uses JavaScript to draw 10 randomly generated shapes (rectangles and ellipses) on the canvas using different colors. Every time you click on the canvas, the shapes are regenerated, creating a new generative art composition.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example of a simple generative art game implemented as a single HTML file using JavaScript and enclosed in script tags:

```html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Generative Art Game</title>
    <style>
      canvas {
        border: 1px solid black;
      }
    </style>
  </head>
  <body>
    <canvas id="canvas" width="400" height="400"></canvas>

// Function to draw randomly generated shapes on the canvas
      function drawShapes() {
        // Clear the canvas
        context.clearRect(0, 0, canvas.width, canvas.height);
        
        // Draw 10 random shapes
        for (let i = 0; i < 10; i++) {
          const x = Math.random() * canvas.width;
          const y = Math.random() * canvas.height;
          const width = Math.random() * 100;
          const height = Math.random() * 100;
          const color = generateRandomColor();
          
          // Draw a rectangle
          context.fillStyle = color;
          context.fillRect(x, y, width, height);
          
          // Draw an ellipse
          context.beginPath();
          context.ellipse(x, y, width / 2, height / 2, 0, 0, Math.PI * 2);
          context.fillStyle = color;
          context.fill();
          context.closePath();
        }
      }
      
      // Call the drawShapes function to generate the initial shapes
      drawShapes();
      
      // Attach a click event listener to the canvas
      canvas.addEventListener('click', drawShapes);
    </script>
  </body>
</html>
```