--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/toolkit/javascript/d3/examples/partition/partition-sunburst.js Thu Apr 10 14:20:23 2014 +0200
@@ -0,0 +1,72 @@
+var w = 960,
+ h = 700,
+ r = Math.min(w, h) / 2,
+ color = d3.scale.category20c();
+
+var vis = d3.select("#chart").append("svg:svg")
+ .attr("width", w)
+ .attr("height", h)
+ .append("svg:g")
+ .attr("transform", "translate(" + w / 2 + "," + h / 2 + ")");
+
+var partition = d3.layout.partition()
+ .sort(null)
+ .size([2 * Math.PI, r * r])
+ .value(function(d) { return 1; });
+
+var arc = d3.svg.arc()
+ .startAngle(function(d) { return d.x; })
+ .endAngle(function(d) { return d.x + d.dx; })
+ .innerRadius(function(d) { return Math.sqrt(d.y); })
+ .outerRadius(function(d) { return Math.sqrt(d.y + d.dy); });
+
+d3.json("../data/flare.json", function(json) {
+ var path = vis.data([json]).selectAll("path")
+ .data(partition.nodes)
+ .enter().append("svg:path")
+ .attr("display", function(d) { return d.depth ? null : "none"; }) // hide inner ring
+ .attr("d", arc)
+ .attr("fill-rule", "evenodd")
+ .style("stroke", "#fff")
+ .style("fill", function(d) { return color((d.children ? d : d.parent).name); })
+ .each(stash);
+
+ d3.select("#size").on("click", function() {
+ path
+ .data(partition.value(function(d) { return d.size; }))
+ .transition()
+ .duration(1500)
+ .attrTween("d", arcTween);
+
+ d3.select("#size").classed("active", true);
+ d3.select("#count").classed("active", false);
+ });
+
+ d3.select("#count").on("click", function() {
+ path
+ .data(partition.value(function(d) { return 1; }))
+ .transition()
+ .duration(1500)
+ .attrTween("d", arcTween);
+
+ d3.select("#size").classed("active", false);
+ d3.select("#count").classed("active", true);
+ });
+});
+
+// Stash the old values for transition.
+function stash(d) {
+ d.x0 = d.x;
+ d.dx0 = d.dx;
+}
+
+// Interpolate the arcs in data space.
+function arcTween(a) {
+ var i = d3.interpolate({x: a.x0, dx: a.dx0}, a);
+ return function(t) {
+ var b = i(t);
+ a.x0 = b.x;
+ a.dx0 = b.dx;
+ return arc(b);
+ };
+}