Refactor Histogram relationship diagnostics.

tracing/tracing/value/diagnostics/breakdown.html

Index: tracing/tracing/value/diagnostics/breakdown.html
diff --git a/tracing/tracing/value/diagnostics/breakdown.html b/tracing/tracing/value/diagnostics/breakdown.html
index 3241a0b1756beac91f5def273bf3992b0db5ce8d..eb5ab528c4d627a1d6cae35a96c62e8125057d9c 100644
--- a/tracing/tracing/value/diagnostics/breakdown.html
+++ b/tracing/tracing/value/diagnostics/breakdown.html
@@ -18,6 +18,10 @@ tr.exportTo('tr.v.d', function() {
       this.colorScheme = undefined;
     }
 
+    get size() {
+      return this.values_.size;
+    }
+
     clone() {
       const clone = new Breakdown();
       clone.colorScheme = this.colorScheme;
@@ -38,7 +42,7 @@ tr.exportTo('tr.v.d', function() {
     }
 
     /**
-     * Add a Value by an explicit name to this map.
+     * Add a numeric value by name.
      *
      * @param {string} name
      * @param {number} value
@@ -48,6 +52,7 @@ tr.exportTo('tr.v.d', function() {
           typeof value !== 'number') {
         throw new Error('Breakdown maps from strings to numbers');
       }
+
       this.values_.set(name, value);
     }
 
@@ -66,25 +71,23 @@ tr.exportTo('tr.v.d', function() {
     }
 
     asDictInto_(d) {
-      d.values = {};
-      for (const [name, value] of this) {
-        d.values[name] = tr.b.numberToJson(value);
-      }
-      if (this.colorScheme) {
-        d.colorScheme = this.colorScheme;
-      }
+      d.entries = Array.from(this);
+      if (this.colorScheme) d.colorScheme = this.colorScheme;
     }
 
-    static fromDict(d) {
+    static fromEntries(entries) {
       const breakdown = new Breakdown();
-      for (const [name, value] of Object.entries(d.values)) {
-        breakdown.set(name, tr.b.numberFromJson(value));
-      }
-      if (d.colorScheme) {
-        breakdown.colorScheme = d.colorScheme;
+      for (const [name, value] of entries) {
+        breakdown.set(name, value);
       }
       return breakdown;
     }
+
+    static fromDict(d) {
+      const breakdown = Breakdown.fromEntries(d.entries);
+      if (d.colorScheme) breakdown.colorScheme = d.colorScheme;
+      return breakdown;
+    }
   }
 
   tr.v.d.Diagnostic.register(Breakdown, {