JSFiddle - React, Tailwind, and code Playground

by totoromaum

HTML

<!DOCTYPE html>
<html>

  <head>
    <title>Canvas</title>
  </head>

  <body>
    <canvas id="canvas" width="1000" height="1000"></canvas>
    <script>
      var circle = function(x, y, radius, fillCircle) {
        ctx.beginPath();
        ctx.arc(x, y, radius, 0, Math.PI * 2, false);
        if (fillCircle) {
          ctx.fill();
        } else {
          ctx.stroke();
        }
      };
      var drawBee = function(x, y) {
        ctx.lineWidth = 2;
        ctx.strokeStyle = "Black";
        ctx.fillStyle = "Yellow";
        circle(x, y, 8, true);
        circle(x, y, 8, false);
        circle(x - 5, y - 11, 5, false);
        circle(x + 5, y - 11, 5, false);
        circle(x - 2, y - 1, 2, false);
        circle(x + 2, y - 1, 2, false);

      };

    </script>

  </body>

</html>