--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/toolkit/javascript/d3/examples/treemap/treemap-svg.js Thu Apr 10 14:20:23 2014 +0200
@@ -0,0 +1,34 @@
+var w = 960,
+ h = 500,
+ color = d3.scale.category20c();
+
+var treemap = d3.layout.treemap()
+ .padding(4)
+ .size([w, h])
+ .value(function(d) { return d.size; });
+
+var svg = d3.select("body").append("svg:svg")
+ .attr("width", w)
+ .attr("height", h)
+ .append("svg:g")
+ .attr("transform", "translate(-.5,-.5)");
+
+d3.json("../data/flare.json", function(json) {
+ var cell = svg.data([json]).selectAll("g")
+ .data(treemap)
+ .enter().append("svg:g")
+ .attr("class", "cell")
+ .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });
+
+ cell.append("svg:rect")
+ .attr("width", function(d) { return d.dx; })
+ .attr("height", function(d) { return d.dy; })
+ .style("fill", function(d) { return d.children ? color(d.data.name) : null; });
+
+ cell.append("svg:text")
+ .attr("x", function(d) { return d.dx / 2; })
+ .attr("y", function(d) { return d.dy / 2; })
+ .attr("dy", ".35em")
+ .attr("text-anchor", "middle")
+ .text(function(d) { return d.children ? null : d.data.name; });
+});