JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="mycanvas"></canvas>

CSS

#mycanvas {
  height: 400px;
  width: 400px;
  position: relative;
}

JavaScript

function circleGraph(radius) {
  return {
    type: 'circle',
    radius: radius,
    currentAngleAnimate: 0
  }
}
$(document).ready(function () {
  var canvas = document.getElementById('mycanvas');
  var context = canvas.getContext('2d')
  var width = canvas.width;
  var height = canvas.height;
  var circleObj = circleGraph(50);

  context.lineWidth = 1;
  context.strokeStyle = '#ad2323';
  context.fillStyle = '#ad2323';

  var draw = function () {
    context.clearRect(0, 0, width, height);
    context.beginPath();
    circleObj.currentAngleAnimate += Math.PI * 2 / 60;
    context.arc(width / 2, height / 2, circleObj.radius, -Math.PI / 2, circleObj.currentAngleAnimate, false);
    context.stroke();
    context.lineTo(width / 2, height / 2);
    context.fill();
    requestAnimationFrame(draw)
  }
  requestAnimationFrame(draw);
});