Drawing Sin

 <button onclick="draw()">Draw</button>
<canvas height="400" id="canvas" width="500">
</canvas>
<script>
function draw() {
  
    var x,y;
    const canvas = document.querySelector('#canvas');
    if (!canvas.getContext) {
        return;
    }
    const ctx = canvas.getContext('2d');
    // set line stroke and line width
    ctx.strokeStyle = 'red';
    ctx.lineWidth = 5;
    // draw a red line
     ctx.beginPath();
     ctx.moveTo(0, 200);
  
  
for(let i=1;i<3000;i++)
{   x=i/50;
    y=Math.sin(x);
    ctx.lineTo(x*10, 200-y*200);
} 
  
  ctx.stroke();
}
</script>