Switch from Google charts to Charted

runtime/observatory/lib/src/elements/isolate_summary.dart

 // Copyright (c) 2013, the Dart project authors.  Please see the AUTHORS file
 // for details. All rights reserved. Use of this source code is governed by a
 // BSD-style license that can be found in the LICENSE file.
 
 library isolate_summary_element;
 
+import 'dart:html';
 import 'observatory_element.dart';
-import 'package:observatory/app.dart';
+import 'package:charted/charted.dart';
+import "package:charted/charts/charts.dart";
 import 'package:observatory/service.dart';
 import 'package:polymer/polymer.dart';
 
 @CustomTag('isolate-summary')
 class IsolateSummaryElement extends ObservatoryElement {
   IsolateSummaryElement.created() : super.created();
 
   @published Isolate isolate;
 }
 
@@ skipping 12 matching lines @@
 }
 
 @CustomTag('isolate-shared-summary')
 class IsolateSharedSummaryElement extends ObservatoryElement {
   IsolateSharedSummaryElement.created() : super.created();
 
   @published Isolate isolate;
 }
 
 class CounterChart {
-  var _table = new DataTable();
-  var _chart;
+  final HtmlElement _wrapper;
+  HtmlElement _areaHost;
+  HtmlElement _legendHost;
+  LayoutArea _area;
+  ChartData _data;
+  final _columns = [
+      new ChartColumnSpec(label: 'Type', type: ChartColumnSpec.TYPE_STRING),
+      new ChartColumnSpec(label: 'Percent', formatter: (v) => v.toString())
+  ];
+
+  CounterChart(this._wrapper) {
+    assert(_wrapper != null);
+    _areaHost = _wrapper.querySelector('.chart-host');
+    assert(_areaHost != null);
+    _areaHost.clientWidth;
+    _legendHost = _wrapper.querySelector('.chart-legend-host');
+    assert(_legendHost != null);
+    var series = new ChartSeries("Work", [1], new PieChartRenderer(
+      sortDataByValue: false
+    ));
+    var config = new ChartConfig([series], [0]);
+    config.minimumSize = new Rect(200, 200);
+    config.legend = new ChartLegend(_legendHost, showValues: true);
+    _data = new ChartData(_columns, []);
+    _area = new LayoutArea(_areaHost,
+                           _data,
+                           config,
+                           state: new ChartState(),
+                           autoUpdate: false);
+    _area.addChartBehavior(new Hovercard());
+    _area.addChartBehavior(new AxisLabelTooltip());
+  }
 
   void update(Map counters) {
-    if (_table.columns == 0) {
-      // Initialize.
-      _table.addColumn('string', 'Name');
-      _table.addColumn('number', 'Value');
-    }
-    _table.clearRows();
+    var rows = [];
     for (var key in counters.keys) {
       var value = double.parse(counters[key].split('%')[0]);
-      _table.addRow([key, value]);
+      rows.add([key, value]);
     }
-  }
-
-  void draw(var element) {
-    if (_chart == null) {
-      assert(element != null);
-      _chart = new Chart('PieChart', element);
-    }
-    _chart.draw(_table);
+    _area.data = new ChartData(_columns, rows);
+    _area.draw();
   }
 }
 
 @CustomTag('isolate-counter-chart')
 class IsolateCounterChartElement extends ObservatoryElement {
   IsolateCounterChartElement.created() : super.created();
 
   @published ObservableMap counters;
   CounterChart chart;
 
+  attached() {
+    super.attached();
+    chart =
+        new CounterChart(shadowRoot.querySelector('#isolate-counter-chart'));
+  }
+
   void countersChanged(oldValue) {
     if (counters == null) {
       return;
     }
-    // Lazily create the chart.
-    if (GoogleChart.ready && chart == null) {
-      chart = new CounterChart();
-    }
     if (chart == null) {
       return;
     }
     chart.update(counters);
-    var element = shadowRoot.querySelector('#counterPieChart');
-    if (element != null) {
-      chart.draw(element);
-    }
   }
 }
-
-
-