JSFiddle - React, Tailwind, and code Playground

by jpeter06

HTML

<button onclick="updateViewBox()" style="position:absolute; top:0px; left:0px;">
   update
   </button>
  
    <script type="text/javascript"
    src="https://d3js.org/d3.v4.min.js"> 
    </script> 
    <script src="https://d3js.org/d3-contour.v1.min.js">
    </script>

    <h1 style="color:green">GeeksforGeeks</h1>
      
    <script> 
    var initVB= null;
    var pX = null;
    var pY = null;
    var down = false;
    function mousedown(e){
    	var shape = document.getElementsByTagName("svg")[0];
			console.log(shape.getAttribute("viewBox")); 
      console.log("e:",d3.event);
      px = d3.event.clientX;
      py = d3.event.clientY;
      down = true;
    }
    function mouseup(e){
    	down = false;
    }
    
    function panViewBox(e){
     if(down){
    		var shape = document.getElementsByTagName("svg")[0];
				var viewBox = shape.getAttribute("viewBox");
        var aViewBox = viewBox.split(" ").map(p=> Number(p));
        aViewBox[0] -= d3.event.movementX;
        aViewBox[2] -= d3.event.movementX;
        aViewBox[1] -= d3.event.movementY;
        aViewBox[3] -= d3.event.movementY;
        shape.setAttribute("viewBox", aViewBox.join(" "));
      }
    }
    
    function updateViewBox(){
    	var shape = document.getElementsByTagName("svg")[0];
			shape.setAttribute("viewBox", "0 110 500 500"); 
    }
    
    function getAViewBox(viewBox){
    	viewBox.split(" ").map(p=> Number(p));
    }
    
    var color = d3.interpolateLab( "#aaffaa","#ff0000");
        // append the svg object to the body.
        var max = 100; 
        var data = [{ x: 15,y:15	,weight:max, group:"H"}
					,{ x: 13,y:13	,weight:max * 1,group:"H"}
					,{ x: 10,y:10	,weight:max * 0.8,group:"H"}
					,{ x: 8,y:8	,weight:max * 0.6,group:"H"}
					,{ x: 6,y:6		,weight:max * 0.4,group:"H"}
					,{ x: 4,y:4	,weight:max * 0.2,group:"H"}
					];
        var svg = d3.select("body")
        .append("svg")
        .attr("width", 530)
        .attr("height", 480)
        .attr("viewBox",...