JSFiddle - React, Tailwind, and code Playground

HTML

<body>
<canvas id="c" style="width:400px;height: 400px;border: 1px solid #ccc" width="400" height="400"></canvas>
</body>

JavaScript

$( function () {

  var POINTS_NUMBER = 30;
  var RADIUS = 50;
  var SAMPLE_COUNT = 400;

  var canvas = document.getElementById("c");
  var ctx = canvas.getContext("2d");

  var points = [],
      circles = [];

  // DRAW POINTS
  for(var i = 0; i < POINTS_NUMBER; i+=1) {
    var x =  Math.floor((Math.random() * 400) + 1);
    var y =  Math.floor((Math.random() * 400) + 1);
    points.push({x:x,y:y, covered: false})
    var radius = 3;

    ctx.beginPath();
    ctx.arc(x,y, radius, 0, 2 * Math.PI, false);
    ctx.fillStyle = 'green';
    ctx.fill();
    ctx.lineWidth = 1;
    ctx.strokeStyle = '#003300';
    ctx.stroke();
  }


  for(var i = 0; i < SAMPLE_COUNT; i+=1) {
    var x =  Math.floor((Math.random() * 400) + 1);
    var y =  Math.floor((Math.random() * 400) + 1);
    circles.push({x: x,y: y})
  }

  var drawCircles = function() {
    for(var i = 0; i < circles.length; i+=1) {
      var c = circles[i];
      ctx.beginPath();
      ctx.arc(c.x,c.y, RADIUS, 0, 2 * Math.PI, false);
      ctx.fillStyle = 'transparent';
      ctx.fill();
      ctx.lineWidth = 1;
      ctx.strokeStyle = '#aa0000';
      ctx.stroke();
    }
  }

  var isInside = function(p1,p2) {
    return Math.sqrt(Math.pow(p1.x - p2.x,2)+Math.pow(p1.y - p2.y,2))< RADIUS
  }

  var count = function () {
    var newCircles = []
    for(var i = 0; i < circles.length; i+=1) {
      var c = circles[i];
      c.inside = [];
      for(var j = 0; j < points.length; j += 1) {
        if(isInside(c,points[j])) {
          c.inside.push(points[j])
        }
      }
      if(c.inside.length>0)newCircles.push(c)
    }
    circles = newCircles;
 
   circles = circles.sort(function(a,b){return b.inside.length - a.inside.length})
   console.log(circles);
   var newCircles = []
   for(var i = 0; i < circles.length; i+=1) {
     var c= circles[i];
     var any = false;
     for(var j = 0; j < c.inside.length; j+=1) {
       if(!c.inside[j].covered) {
         any = true;
         c.inside[j].covered = true
  ...