JSFiddle - React, Tailwind, and code Playground

by Bhavik Patel

HTML

<div class="content">
    <div id="svgG">
      
      
      
    </div>
 
    
    </div>

JavaScript

/* Programm und Grafiken sind geistiges Eigentum von Frank Wisniewski, Lohmühlenstraße 2, 53518 Adenau und dürfen ohne Genehemigung nicht genutzt werden */

      var carCount = 8;
      var i;
      var colors = ["Black", "Navy", "Blue", "BlueViolet", "CornFlowerBlue","Red", "LimeGreen", "IndianRed", "Sienna"];
      var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
      var _create = function (type){return document.createElementNS("http://www.w3.org/2000/svg", type);}
      var _set = function (el,par){for (key in par) {el.setAttribute(key.replace('X','-'),par[key]);}svg.appendChild(el);}
      with(svg){ 
        setAttribute('width', '250');
        setAttribute('height', '250');
        setAttribute("viewBox", "0 0 250 250"); 
        setAttributeNS("http://www.w3.org/2000/xmlns/", "xmlns:xlink", "http://www.w3.org/1999/xlink");
      } 
      svg.setAttributeNS("http://www.w3.org/2000/xmlns/", "xmlns:xlink", "http://www.w3.org/1999/xlink");
      svgG.appendChild(svg);
      var adenaubullet = _create("circle");
      _set(adenaubullet,{r:7,fill:'#f00',stroke:'#f00',cx:110,cy:8,strokeXwidth:1});
      var pfad = _create("path");
      pfad.setAttribute("d","M6.3438 700.01H4.97656V46.0951C4.97656 20.6825 34.9737 0 71.8617 0L219.66 0V0.942255H71.8617C35.7393 0.942255 6.3438 21.2007 6.3438 46.0951V700.01Z"); 
      _set(pfad,{fill:'none',stroke:'#666',strokeXwidth:6});
      var bordstein=pfad.cloneNode(true);
      _set(bordstein,{stroke:'#ddd',strokeXwidth:4});
      var grandprix = _create("path");
     ...