JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id='c'></canvas>

CSS

#c {
    border: 1px solid #000;
    width: 300px;
    height: 300px;
}

JavaScript

c = document.getElementById('c');
analyserContext = c.getContext('2d');

x=0;

setInterval(function() {
x = x+0.01;
var arcrad = 5*(Math.sin(x)+1.5);
c.width = c.width;
analyserContext.beginPath();
analyserContext.arc(150,60,arcrad,0,2*Math.PI);
analyserContext.closePath();
analyserContext.lineWidth = 2;
analyserContext.strokeStyle = 'red';
analyserContext.stroke();
}, 10);