JSFiddle - React, Tailwind, and code Playground
HTML
<canvas id="canvas" width="400" height="400" style="background-color:#ffffff;"></canvas>
JavaScript
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
ctx.beginPath();
// x^2 + y^2 = 625
for (var x=-30; x<=+30; x+=0.01) {
var smallest=1e10;
var best_y=0;
for (var y=-30; y<=+30; y+=0.01) {
var v=Math.abs(x*x+y*y-625);
if(v<smallest) {smallest=v;best_y=y;}
}
if(smallest<0.1) {
ctx.fillRect(100+x, 100-best_y,1,1);
}
}
ctx.stroke();