d3 treemap with flattree converter

see flattree

browsable(
  tagList(
    tags$script(
      HTML(paste0(readLines("./build/d3-flattree.js"), collapse="\n"))
    ),
    tags$script(
      HTML(sprintf('var data=%s', jsonlite::toJSON(rhd, dataframe="rows"))
    )),
    tags$script(HTML(
'
var d3h = d3.flattree(data, ["index1","index2","index3"]);
d3h.sum(function(d) {return d.x});

var d3t = d3.treemap().size([400,400])(d3h);
var svg = d3.select("body").append("svg")
  .style("height", 400)
  .style("width", 400);

var cell = svg.selectAll("g")
  .data(d3t.leaves());

cell = cell.enter().append("g").merge(cell);

cell
  .attr("transform", function(d) { return "translate(" + d.x0 + "," + d.y0 + ")"; });
var color = d3.scaleOrdinal(d3.schemeCategory20);
cell.append("rect")
  .attr("id", function(d) { return "rect-" + d.id; })
  .attr("width", function(d) { return d.x1 - d.x0; })
  .attr("height", function(d) { return d.y1 - d.y0; })
  .style("fill", function(d) { return color(d.data.index2) });

'   
    )),
  d3_dep_v4()
  )
)

forked from timelyportfolio's block: d3 treemap with flattree converter