equal
deleted
inserted
replaced
62 // Aggregate the values for internal nodes. This is normally done by the |
62 // Aggregate the values for internal nodes. This is normally done by the |
63 // treemap layout, but not here because of our custom implementation. |
63 // treemap layout, but not here because of our custom implementation. |
64 // We also take a snapshot of the original children (_children) to avoid |
64 // We also take a snapshot of the original children (_children) to avoid |
65 // the children being overwritten when when layout is computed. |
65 // the children being overwritten when when layout is computed. |
66 function accumulate(d) { |
66 function accumulate(d) { |
67 return (d._children = d.children) |
67 return (d._children = d.children) ? d.value = d.children.reduce(function(p, v) { return p + accumulate(v); }, 0) : d.value; |
68 ? d.value = d.children.reduce(function(p, v) { return p + accumulate(v); }, 0) |
|
69 : d.value; |
|
70 } |
68 } |
71 |
69 |
72 // Compute the treemap layout recursively such that each group of siblings |
70 // Compute the treemap layout recursively such that each group of siblings |
73 // uses the same size (1×1) rather than the dimensions of the parent cell. |
71 // uses the same size (1×1) rather than the dimensions of the parent cell. |
74 // This optimizes the layout for the current zoom state. Note that a wrapper |
72 // This optimizes the layout for the current zoom state. Note that a wrapper |
103 |
101 |
104 var g = g1.selectAll("g") |
102 var g = g1.selectAll("g") |
105 .data(d._children) |
103 .data(d._children) |
106 .enter().append("g"); |
104 .enter().append("g"); |
107 |
105 |
108 g.classed("bla", true).on("click", selectHandler) |
106 g.classed("bla", true).on("click", selectHandler); |
109 |
107 |
110 g.filter(function(d) { return d._children; }) |
108 g.filter(function(d) { return d._children; }) |
111 .classed("children", true) |
109 .classed("children", true) |
112 .on("click", transition); |
110 .on("click", transition); |
113 |
|
114 // g.selectAll(".child") |
|
115 // .data(function(d) { return d._children || [d]; }) |
|
116 // .enter().append("rect") |
|
117 // .attr("class", "child") |
|
118 // .call(rect); |
|
119 |
111 |
120 g.append("rect") |
112 g.append("rect") |
121 .attr("class", "parent") |
113 .attr("class", "parent") |
122 // .attr("fill", (d.color || "#bbb")) |
114 // .attr("fill", (d.color || "#bbb")) |
123 .call(rect) |
115 .call(rect) |
128 .attr("dy", ".75em") |
120 .attr("dy", ".75em") |
129 .text(function(d) { return d.name; }) |
121 .text(function(d) { return d.name; }) |
130 .call(text); |
122 .call(text); |
131 |
123 |
132 function transition(d) { |
124 function transition(d) { |
133 if (transitioning || !d) return; |
125 if (transitioning || !d) { return; } |
134 selectHandler(d); |
126 selectHandler(d); |
135 transitioning = true; |
127 transitioning = true; |
136 |
128 |
137 var g2 = display(d), |
129 var g2 = display(d), |
138 t1 = g1.transition().duration(750), |
130 t1 = g1.transition().duration(750), |
172 } |
164 } |
173 |
165 |
174 return g; |
166 return g; |
175 } |
167 } |
176 |
168 |
177 function text(text) { |
169 function text() { |
178 text.attr("x", function(d) { return x(d.x) + 6; }) |
170 text.attr("x", function(d) { return x(d.x) + 6; }) |
179 .attr("y", function(d) { return y(d.y) + 6; }); |
171 .attr("y", function(d) { return y(d.y) + 6; }); |
180 } |
172 } |
181 |
173 |
182 function rect(rect) { |
174 function rect() { |
183 rect.attr("x", function(d) { return x(d.x); }) |
175 rect.attr("x", function(d) { return x(d.x); }) |
184 .attr("y", function(d) { return y(d.y); }) |
176 .attr("y", function(d) { return y(d.y); }) |
185 .attr("width", function(d) { return x(d.x + d.dx) - x(d.x); }) |
177 .attr("width", function(d) { return x(d.x + d.dx) - x(d.x); }) |
186 .attr("height", function(d) { return y(d.y + d.dy) - y(d.y); }) |
178 .attr("height", function(d) { return y(d.y + d.dy) - y(d.y); }) |
187 .attr("fill", function(d) { return (d.color || "#bbb")}); |
179 .attr("fill", function(d) { return (d.color || "#bbb")}); |
188 } |
180 } |
189 |
181 |
190 function name(d) { |
182 function name(d) { |
191 return d.parent |
183 return d.parent ? name(d.parent) + "." + d.name : d.name; |
192 ? name(d.parent) + "." + d.name |
|
193 : d.name; |
|
194 } |
184 } |
195 }); |
185 }); |
196 } |
186 } |
197 }); |
187 }); |