Implement Composition.buildFromEvents()

tracing/tracing/value/ui/composition_span.html

Index: tracing/tracing/value/ui/composition_span.html
diff --git a/tracing/tracing/value/ui/composition_span.html b/tracing/tracing/value/ui/composition_span.html
index 786e73ebeb4907e6661a94842ec4f9e4efa933f8..288076d98c462081ead3be16b53fe2d17d790231 100644
--- a/tracing/tracing/value/ui/composition_span.html
+++ b/tracing/tracing/value/ui/composition_span.html
@@ -17,9 +17,11 @@ found in the LICENSE file.
   Polymer({
     created: function() {
       this.chart_ = new tr.ui.b.BarChart();
-      this.chart_.width = 100;
-      this.chart_.height = 50;
+      this.chart_.width = 190;
+      this.chart_.height = 200;
       this.chart_.isStacked = true;
+      this.chart_.hideXAxis = true;
+      this.chart_.margin.right = 120;
     },
 
     ready: function() {
@@ -45,13 +47,20 @@ found in the LICENSE file.
       var valueCount = 0;
       this.diagnostic_.iterItems(function(name, value) {
         ++valueCount;
+
+        var delta = {};
+        delta[name] = value;

[charliea (OOO until 10-5), 2016/07/13 14:30:06]

Can you add a note about why 

delta[name] = value;
this.chart_.customizeLegendTargets(delta);
delta[name] = true;

is necessary? Without knowing anything else, it looks pretty strange.

[benjhayden, 2016/07/13 18:03:04]

I changed these to direct calls to getDataSeries(name).target/optional.

+        this.chart_.customizeLegendTargets(delta);
+        delta[name] = true;
+        this.chart_.customizeOptionalSeries(delta);
+
         value = value.numeric;
         if (value instanceof tr.v.ScalarNumeric)
           data[name] = value.value;
         else if (value instanceof tr.v.Numeric)
           data[name] = value.sum;
-      });
-      this.chart_.height = 50 + (50 * valueCount);
+
+      }, this);
       this.chart_.data = [data];
     }
   });