JSFiddle - React, Tailwind, and code Playground

HTML

<body>
  
</body>

JavaScript

var NS="http://www.w3.org/2000/svg"; // global name space
var width=500;                      // width of svg
var height=500;                     //hieght of svg 
var cx= width/2;                    // taking centre points
var cy=height/2;
var arrowpoint_x= cx;  
var arrowpoint_y= cy+(80/2);
var SVG=function(h,w){             // fun create SVG
 var svg=document.createElementNS(NS,"svg");
 svg.width=w;
 svg.height=h; 
 return svg;
}
var rect=function(x,y,h,w){        // fun create Rectangle
  var rectSVGObj = document.createElementNS(NS, 'rect');
    rectSVGObj.setAttributeNS(null, "id", "rectId");
    rectSVGObj.setAttributeNS(null, 'x',x);
    rectSVGObj.setAttributeNS(null, 'y', y);
    rectSVGObj.setAttributeNS(null, 'height', h);
    rectSVGObj.setAttributeNS(null, 'width', w);
    rectSVGObj.setAttributeNS(null, 'fill', 'none');
    rectSVGObj.setAttributeNS(null, "stroke", "black");
 return rectSVGObj;
}
var arrow= function(){                   // fun for arrow 
    var defObj = document.createElementNS(NS,"defs");
    var markerObj = document.createElementNS(NS,"marker");
       markerObj.setAttributeNS(null, "id", "markerArrow1"); 
    var arrowObj=document.createElementNS(NS,"path"); 
       arrowObj.setAttributeNS(null, "id", "markerArrow");
       arrowObj.setAttributeNS(null, "d","M2,2 L2,13 L8,7 L2,2" );
    markerObj.appendChild(arrowObj);
    defObj.appendChild(markerObj);
    return defObj;
}
var lines= function(x1,y1,x2,y2){        // lines
    var lineSVGObj = document.createElementNS(NS, 'line');
    lineSVGObj.setAttributeNS(null, "id", "lineId");
    lineSVGObj.setAttributeNS(null, 'x1',x1);
    lineSVGObj.setAttributeNS(null, 'y1', y1);
    lineSVGObj.setAttributeNS(null, 'x2', x2);
    lineSVGObj.setAttributeNS(null, 'y2', y2);
    lineSVGObj.setAttributeNS(null, "stroke", "blue");
    lineSVGObj.setAttributeNS(null,'marker-mid',       'url(#markerArrow1)');
 return lineSVGObj;
}
var svg=SVG(height,width);
document.body.appendChild(svg);   ...