JSFiddle - React, Tailwind, and code Playground

by jcubed111

HTML

<canvas id='canvas' width='500' height='500'></canvas>

CSS

body{
    background:#EEE;
}
canvas{
    width:500px;
    height:500px;
    background:#FFF;
    border:1px solid #CCC;
}

JavaScript

//spiral 3

ctx=document.getElementById('canvas').getContext('2d');

function draw(step){
    ctx.clearRect(0,0,500,500);
    ctx.beginPath();
    ctx.moveTo(250,250);
    for(i=0;i<step*10;i++){
        d=i*0.0174532925;
        //r=i/20;
        r=Math.sqrt(i);
        ctx.lineTo(Math.sin(d)*r+250, Math.cos(d)*r+250);
    }
    ctx.stroke();
    setTimeout("draw("+(step+1)+");",25);
}

draw(0);