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()
)
)
Updated missing url https://cdn.rawgit.com/timelyportfolio/flattree/94a3b4ee744d77f102a7b10e1f40f087bae916c9/build/d3-flattree.js to https://cdn.jsdelivr.net/gh/timelyportfolio/flattree/94a3b4ee744d77f102a7b10e1f40f087bae916c9/build/d3-flattree.js
https://unpkg.com/d3
https://cdn.rawgit.com/timelyportfolio/flattree/94a3b4ee744d77f102a7b10e1f40f087bae916c9/build/d3-flattree.js