Move to combined ROM/RAM graphs

Author: theotherjimmy

tools/memap.py

@@ -595,6 +595,17 @@ def generate_html(self, file_desc):
                 cur_data = self._move_up_tree(cur_data, next_module)
                 cur_bss = self._move_up_tree(cur_bss, next_module)
 
+        tree_rom = {
+            "name": "ROM",
+            "value": tree_text["value"] + tree_data["value"],
+            "children": [tree_text, tree_data]
+        }
+        tree_ram = {
+            "name": "RAM",
+            "value": tree_bss["value"] + tree_data["value"],
+            "children": [tree_bss, tree_data]
+        }
+
         jinja_loader = FileSystemLoader(dirname(abspath(__file__)))
         jinja_environment = Environment(loader=jinja_loader,
                                         undefined=StrictUndefined)
@@ -607,9 +618,8 @@ def generate_html(self, file_desc):
             name = "%s %s" % (name, self.tc_name)
         data = {
             "name": name,
-            "text": json.dumps(tree_text),
-            "data": json.dumps(tree_data),
-            "bss": json.dumps(tree_bss),
+            "rom": json.dumps(tree_rom),
+            "ram": json.dumps(tree_ram),
         }
         file_desc.write(template.render(data))
         return None

tools/memap_flamegraph.html

@@ -50,13 +50,10 @@
       <div class="header clearfix">
         <h3 class="text-muted">{{name}} Memory Details</h3>
       </div>
-      <div id="chart-text">
+      <div id="chart-rom">
       </div>
       <hr/>
-      <div id="chart-data">
-      </div>
-      <hr/>
-      <div id="chart-bss">
+      <div id="chart-ram">
       </div>
       <hr/>
       <div id="details"></div>
@@ -83,34 +80,23 @@ <h3 class="text-muted">{{name}} Memory Details</h3>
       .direction("s")
       .offset([8, 0])
       .attr('class', 'd3-flame-graph-tip')
-      .html(function(d) { return "module: " + d.data.name + ", size in bytes: " + d.data.value; });
-    var flameGraph_text = d3.flameGraph()
-      .transitionDuration(250)
-      .transitionEase(d3.easeCubic)
-      .sort(true)
-      .title("Code (ROM)")
-      .tooltip(tip);
-    var flameGraph_data = d3.flameGraph()
+      .html(function(d) { return "module: " + d.data.name + ", bytes: " + d.data.value; });
+    var flameGraph_rom = d3.flameGraph()
       .transitionDuration(250)
       .transitionEase(d3.easeCubic)
       .sort(true)
-      .title("Non-zero initialized data (ROM + RAM)")
       .tooltip(tip);
-    var flameGraph_bss = d3.flameGraph()
+    var flameGraph_ram = d3.flameGraph()
       .transitionDuration(250)
       .transitionEase(d3.easeCubic)
       .sort(true)
-      .title("Zero initialized data (RAM)")
       .tooltip(tip);
-    var text_elem = d3.select("#chart-text");
-    flameGraph_text.width(text_elem.node().getBoundingClientRect().width);
-    text_elem.datum({{text}}).call(flameGraph_text);
-    var data_elem = d3.select("#chart-data");
-    flameGraph_data.width(data_elem.node().getBoundingClientRect().width);
-    data_elem.datum({{data}}).call(flameGraph_data);
-    var bss_elem = d3.select("#chart-bss");
-    flameGraph_bss.width(bss_elem.node().getBoundingClientRect().width);
-    bss_elem.datum({{bss}}).call(flameGraph_bss);
+    var rom_elem = d3.select("#chart-rom");
+    flameGraph_rom.width(rom_elem.node().getBoundingClientRect().width);
+    rom_elem.datum({{rom}}).call(flameGraph_rom);
+    var ram_elem = d3.select("#chart-ram");
+    flameGraph_ram.width(ram_elem.node().getBoundingClientRect().width);
+    ram_elem.datum({{ram}}).call(flameGraph_ram);
     </script>
   </body>
 </html>