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 1

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

ctx.beginPath();
ctx.moveTo(250,250);
for(i=0;i<360*10;i++){
    d=i*0.0174532925;
    r=i/20
    ctx.lineTo(Math.sin(d)*r+250, Math.cos(d)*r+250);
}
ctx.stroke();