JSFiddle - React, Tailwind, and code Playground

by Maria Karanasou

HTML

<svg width="960" height="880"></svg>
<script src="https://d3js.org/d3.v4.min.js"></script>

CSS

text {
  font: 10px sans-serif;
  text-anchor: middle;
}

JavaScript

var csv = "id,val\none,2000\ntwo,3000\nthree,4000";
var data = d3.csvParse(csv);
console.log(data)
var stratify = d3.stratify()
              .parentId(function(d) { return d.id.substring(0, d.id.lastIndexOf(".")); });
             
var root = stratify(data)
	      .sum(function(d) { console.log(d);return d.val; })
	      .sort(function(a, b) { return b.val - a.val; });