1 <!DOCTYPE html> 2 <head> 3 <title>Subzero size breakdown</title> 4 <script src='../build/pnacl-sz.bloat.json'></script> 5 <link rel='stylesheet' href='webtreemap.css'> 6 <style> 7 body { 8 font-family: sans-serif; 9 font-size: 0.8em; 10 margin: 2ex 4ex; 11 } 12 13 h1 { 14 font-weight: normal; 15 } 16 17 #map { 18 height: 70vh; 19 20 position: relative; 21 cursor: pointer; 22 -webkit-user-select: none; 23 } 24 25 #legend { 26 width: 200px; 27 } 28 </style> 29 </head> 30 31 <body> 32 33 <h1>Subzero size breakdown</h1> 34 35 <p>Click on a box to zoom in. Click on the outermost box to zoom out.</p> 36 37 <div id='map'></div> 38 39 <script src='webtreemap.js'></script> 40 41 <script> 42 var map = document.getElementById('map'); 43 appendTreemap(map, kTree); 44 </script> 45 46 <div id='legend'> 47 <div class='webtreemap-symbol-bss'>bss</div> 48 <div class='webtreemap-symbol-bss webtreemap-aggregate'>bss aggregate</div> 49 <div class='webtreemap-symbol-data'>data</div> 50 <div class='webtreemap-symbol-data webtreemap-aggregate'>data aggregate</div> 51 <div class='webtreemap-symbol-read-only_data'>read-only data</div> 52 <div class='webtreemap-symbol-read-only_data webtreemap-aggregate'>read-only 53 data aggregate</div> 54 <div class='webtreemap-symbol-code'>code</div> 55 <div class='webtreemap-symbol-code webtreemap-aggregate'>code aggregate</div> 56 <div class='webtreemap-symbol-weak_symbol'>weak symbol</div> 57 <div class='webtreemap-symbol-weak_symbol webtreemap-aggregate'>weak symbol 58 aggregate</div> 59 </div> 60 61 </body> 62