JSFiddle - React, Tailwind, and code Playground

by theodore itzaris

HTML

<canvas id="c" width="600" height="600"></canvas>

JavaScript

var canvas = new fabric.Canvas('c', {
            selection: true,
            /*theo 12-02-2015*/
            //renderOnAddRemove:false,
            backgroundColor: 'yellow'
        });

var RADIUS_CHILDREN_CIRCLE = 8;
var circles = [];
    function addCirlceTable(left_padding_circle,top_padding_circle,count_chairs,radiusCircle){

                radiusCircle = (typeof radiusCircle === "undefined") ? 35 : radiusCircle;
                var left_p = radiusCircle - RADIUS_CHILDREN_CIRCLE;
                var top_p = radiusCircle  - RADIUS_CHILDREN_CIRCLE; 
                var left_group_circle = left_padding_circle - left_p;
                var top_group_circle = top_padding_circle - top_p; 
                var rad_parent_circle = radiusCircle;
                var radius_children_circle = RADIUS_CHILDREN_CIRCLE;
                var rad_parent_child_circle = radiusCircle+13;
            
                  var length_line_parent_cirle = (2 * Math.PI *rad_parent_child_circle)*2+radius_children_circle*3;
                 
                  var parent_circle_table = new fabric.Circle({left:left_group_circle,top:top_group_circle,radius:rad_parent_circle, fill:'#FFE2EB',stroke:'#7F7F7F',  hasControls:true,
    hasBorders:true,
    hasRotatingPoint:true,
    selectable:true,
    objectType:'parent'});
               
circles.push(parent_circle_table);
        
                  var height_circle = parent_circle_table.getHeight(); 
                  
                
                  var colors = ['#FFE2EB'];
                  var centerX = left_padding_circle;
                  var centerY = top_padding_circle;
                  var innerRadius = rad_parent_child_circle;
                  var count_child_circle = count_chairs; 

                  var all_circle_lenght  = count_child_circle*(radius_children_circle*2);

                  var length_interval = length_line_parent_cirle/count_child_circle;
                  
                  var interval =...