| OLD | NEW |
|---|
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <html> |
| 3 <head> |
| 4 <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/> |
| 5 <link type="text/css" rel="stylesheet" href="style.css"/> |
| 6 <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script> |
| 7 <style type="text/css"> |
| 8 |
| 9 body { |
| 10 overflow: hidden; |
| 11 margin: 0; |
| 12 font-size: 14px; |
| 13 font-family: "Helvetica Neue", Helvetica; |
| 14 } |
| 15 |
| 16 #chart, #header, #footer { |
| 17 position: absolute; |
| 18 top: 0; |
| 19 } |
| 20 |
| 21 #header, #footer { |
| 22 z-index: 1; |
| 23 display: block; |
| 24 font-size: 36px; |
| 25 font-weight: 300; |
| 26 text-shadow: 0 1px 0 #fff; |
| 27 } |
| 28 |
| 29 #header.inverted, #footer.inverted { |
| 30 color: #fff; |
| 31 text-shadow: 0 1px 4px #000; |
| 32 } |
| 33 |
| 34 #header { |
| 35 top: 80px; |
| 36 left: 140px; |
| 37 width: 1000px; |
| 38 } |
| 39 |
| 40 #footer { |
| 41 top: 1080px; |
| 42 right: 140px; |
| 43 text-align: right; |
| 44 } |
| 45 |
| 46 rect { |
| 47 fill: none; |
| 48 pointer-events: all; |
| 49 } |
| 50 |
| 51 pre { |
| 52 font-size: 18px; |
| 53 } |
| 54 |
| 55 line { |
| 56 stroke: #000; |
| 57 stroke-width: 1.5px; |
| 58 } |
| 59 |
| 60 .string, .regexp { |
| 61 color: #f39; |
| 62 } |
| 63 |
| 64 .keyword { |
| 65 color: #00c; |
| 66 } |
| 67 |
| 68 .comment { |
| 69 color: #777; |
| 70 font-style: oblique; |
| 71 } |
| 72 |
| 73 .number { |
| 74 color: #369; |
| 75 } |
| 76 |
| 77 .class, .special { |
| 78 color: #1181B8; |
| 79 } |
| 80 |
| 81 a:link, a:visited { |
| 82 color: #000; |
| 83 text-decoration: none; |
| 84 } |
| 85 |
| 86 a:hover { |
| 87 color: #666; |
| 88 } |
| 89 |
| 90 .hint { |
| 91 position: absolute; |
| 92 right: 0; |
| 93 width: 1280px; |
| 94 font-size: 12px; |
| 95 color: #999; |
| 96 } |
| 97 .chart { |
| 98 display: block; |
| 99 margin: auto; |
| 100 margin-top: 60px; |
| 101 font-size: 11px; |
| 102 } |
| 103 |
| 104 rect { |
| 105 stroke: #eee; |
| 106 fill: #aaa; |
| 107 fill-opacity: .8; |
| 108 } |
| 109 |
| 110 rect.parent { |
| 111 cursor: pointer; |
| 112 fill: steelblue; |
| 113 } |
| 114 |
| 115 text { |
| 116 pointer-events: none; |
| 117 } |
| 118 |
| 119 </style> |
| 120 </head> |
| 121 <body> |
| 122 <div id="body"> |
| 123 <div id="footer"> |
| 124 $dllname |
| 125 </div> |
| 126 </div> |
| 127 <script type="text/javascript"> |
| 128 |
| 129 var w = 1120, |
| 130 h = 1000, |
| 131 x = d3.scale.linear().range([0, w]), |
| 132 y = d3.scale.linear().range([0, h]); |
| 133 |
| 134 var vis = d3.select("#body").append("div") |
| 135 .attr("class", "chart") |
| 136 .style("width", w + "px") |
| 137 .style("height", h + "px") |
| 138 .append("svg:svg") |
| 139 .attr("width", w) |
| 140 .attr("height", h); |
| 141 |
| 142 var partition = d3.layout.partition() |
| 143 .value(function(d) { return d.size; }); |
| 144 |
| 145 (function(root) { |
| 146 var g = vis.selectAll("g") |
| 147 .data(partition.nodes(root)) |
| 148 .enter().append("svg:g") |
| 149 .attr("transform", function(d) { return "translate(" + x(d.y) + "," + y(d.
x) + ")"; }) |
| 150 .on("click", click); |
| 151 |
| 152 var kx = w / root.dx, |
| 153 ky = h / 1; |
| 154 |
| 155 g.append("svg:rect") |
| 156 .attr("width", root.dy * kx) |
| 157 .attr("height", function(d) { return d.dx * ky; }) |
| 158 .attr("class", function(d) { return d.children ? "parent" : "child"; }); |
| 159 |
| 160 g.append("svg:text") |
| 161 .attr("transform", transform) |
| 162 .attr("dy", ".35em") |
| 163 .style("opacity", function(d) { return d.dx * ky > 12 ? 1 : 0; }) |
| 164 .text(function(d) { return d.name; }) |
| 165 |
| 166 d3.select(window) |
| 167 .on("click", function() { click(root); }) |
| 168 |
| 169 function click(d) { |
| 170 if (!d.children) return; |
| 171 |
| 172 kx = (d.y ? w - 40 : w) / (1 - d.y); |
| 173 ky = h / d.dx; |
| 174 x.domain([d.y, 1]).range([d.y ? 40 : 0, w]); |
| 175 y.domain([d.x, d.x + d.dx]); |
| 176 |
| 177 var t = g.transition() |
| 178 .duration(d3.event.altKey ? 7500 : 750) |
| 179 .attr("transform", function(d) { return "translate(" + x(d.y) + "," + y(
d.x) + ")"; }); |
| 180 |
| 181 t.select("rect") |
| 182 .attr("width", d.dy * kx) |
| 183 .attr("height", function(d) { return d.dx * ky; }); |
| 184 |
| 185 t.select("text") |
| 186 .attr("transform", transform) |
| 187 .style("opacity", function(d) { return d.dx * ky > 12 ? 1 : 0; }); |
| 188 |
| 189 d3.event.stopPropagation(); |
| 190 } |
| 191 |
| 192 function transform(d) { |
| 193 return "translate(8," + d.dx * ky / 2 + ")"; |
| 194 } |
| 195 })($data); |
| 196 |
| 197 </script> |
| 198 </body> |
| 199 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 21164002:
Add tools\win\sizeviewer to dump partition view of binary size (Closed)
Base URL: svn://svn.chromium.org/chrome/trunk/src