How To Draw A Ultimate Happiness With The Bunny's game

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

No:46178

109

←

Prev Next

→

How To Draw A Ultimate Happiness With The Bunny
Developer User13970｜Date and time 24/2/23 21:50:24
Build time 6.78 sec｜Game capacity 1.483KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>Ultimate Happiness with the Bunny</title>
</head>
<body>
  <canvas id="canvas" width="400" height="400"></canvas>
  <script>
    const canvas = document.getElementById("canvas");
    const ctx = canvas.getContext("2d");

// Draw a bunny on the canvas
    function drawBunny() {
      ctx.fillStyle = "pink";
      ctx.beginPath();
      ctx.arc(200, 200, 80, 0, Math.PI * 2);
      ctx.fill();

ctx.fillStyle = "white";
      ctx.beginPath();
      ctx.arc(180, 180, 10, 0, Math.PI * 2);
      ctx.fill();
      ctx.beginPath();
      ctx.arc(220, 180, 10, 0, Math.PI * 2);
      ctx.fill();

ctx.beginPath();
      ctx.arc(200, 220, 25, 0, Math.PI);
      ctx.stroke();
    }

// Add a button to make the bunny happy
    const button = document.createElement("button");
    button.textContent = "Make Bunny Happy";
    document.body.appendChild(button);

// Add event listener to make the bunny happy
    button.addEventListener("click", function() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);

drawBunny();

ctx.fillStyle = "yellow";
      ctx.beginPath();
      ctx.arc(200, 250, 30, 0, Math.PI * 2);
      ctx.fill();

ctx.lineWidth = 4;
      ctx.strokeStyle = "orange";
      ctx.beginPath();
      ctx.moveTo(185, 240);
      ctx.lineTo(195, 250);
      ctx.lineTo(215, 230);
      ctx.stroke();
    });

// Initial draw of the bunny
    drawBunny();
  </script>
</body>
</html>