JSFiddle - React, Tailwind, and code Playground
by Tiro
HTML
<svg width="640" height="480">
<g stroke="#ff0000" stroke-width="2" >
<circle fill-opacity="0" fill="#ff0000" id="svg_3" r="40.83615" cy="259.57143" cx="190.07143"/>
<circle id="svg_4" fill-opacity="0" fill="#ff0000" r="50.40758" cy="256" cx="287.64285"/>
<circle id="svg_5" fill-opacity="0" fill="#ff0000" r="6.83615" cy="258.71429" cx="189.78571"/>
<circle id="svg_6" fill-opacity="0" fill="#ff0000" r="9.97901" cy="255.57143" cx="287.78572"/>
<line fill="none" id="svg_8" y2="252.42857" x2="193.85714" y1="224.71429" x1="211.28571"/>
<line fill="none" id="svg_9" y2="293.57143" x2="169" y1="265.28571" x1="187"/>
<line fill="none" id="svg_10" y2="295" x2="207.85714" y1="264.71429" x1="193.28571"/>
<line fill="none" id="svg_11" y2="258.71429" x2="149.28571" y1="258.71429" x1="182.71429"/>
<line fill="none" id="svg_12" y2="259.85714" x2="230.42857" y1="258.42857" x1="197"/>
<line fill="none" id="svg_13" y2="251" x2="186.71429" y1="222.71429" x1="171.57143"/>
<line fill="none" id="svg_14" y2="245.57143" x2="282.42857" y1="212.14286" x1="265"/>
<line fill="none" id="svg_15" y2="246.14286" x2="292.71429" y1="212.71429" x1="313.28571"/>
<line fill="none" id="svg_16" y2="258.71429" x2="337.85714" y1="256.14286" x1="297.57143"/>
<line fill="none" id="svg_17" y2="300.42857" x2="309" y1="264.42857" x1="290.42857"/>
<line fill="none" id="svg_18" y2="297.85714" x2="260.42857" y1="263" x1="281"/>
<line fill="none" id="svg_19" y2="254.71429" x2="237.57143" y1="255.57143" x1="277.57143"/>
<line fill="none" id="svg_20" y2="263" x2="230.71429" y1="263.85714" x1="237.85714"/>
<path fill="none" id="svg_21" d="m176.71428,297.85715l-96.42857,6.71429l26.57143,-46.85715l10.85715,-0.57144l-0.71429,9.85715l26,0.28571l6.57143,-104.57143l-25.42857,-3.14285"/>
<line fill="none" id="svg_22" y2="257.57143" x2="117.57143" y1="159" x1="124.14286"/>
<circle fill="none" id="svg_23" r="8.63652" cy="205.57143" cx="98.14286"/>
<line fill="none" id="svg_25"...