| OLD | NEW |
| (Empty) |
| 1 <!-- | |
| 2 # Copyright 2015 The LUCI Authors. All rights reserved. | |
| 3 # Use of this source code is governed under the Apache License, Version 2.0 | |
| 4 # that can be found in the LICENSE file. | |
| 5 | |
| 6 --> | |
| 7 | |
| 8 <!-- | |
| 9 @group Swarming Elements | |
| 10 | |
| 11 `stats-table-chart' encapsulates a 'google-chart' of table type. | |
| 12 This element exposes a 'data' attribute which is JSON serialized | |
| 13 `google.visualization.DataTable` object and a `resolution` attribute that is | |
| 14 'minutes', 'hours', or 'days'. | |
| 15 | |
| 16 Example: | |
| 17 <stats-table-chart data="{{data_table}}"></stats-table-chart> | |
| 18 | |
| 19 @element stats-table-chart | |
| 20 --> | |
| 21 | |
| 22 <link rel="import" href="bower_components/polymer/polymer.html"> | |
| 23 <link rel="import" href="bower_components/google-apis/google-jsapi.html"> | |
| 24 | |
| 25 <polymer-element name="stats-table-chart" attributes="data"> | |
| 26 <template> | |
| 27 <div id="chart">(Loading...)</div> | |
| 28 <google-jsapi on-api-load="{{readyForAction}}"></google-jsapi> | |
| 29 </template> | |
| 30 <script> | |
| 31 Polymer('stats-table-chart', { | |
| 32 observe: { | |
| 33 'data': 'loadData' | |
| 34 }, | |
| 35 | |
| 36 readyForAction: function() { | |
| 37 google.load("visualization", "1", { | |
| 38 packages: ['table'], | |
| 39 callback: function() { | |
| 40 this.isReady = true; | |
| 41 this.loadData(); | |
| 42 }.bind(this) | |
| 43 }); | |
| 44 }, | |
| 45 | |
| 46 loadData: function() { | |
| 47 if (this.data && this.isReady) { | |
| 48 if (!this.table) { | |
| 49 this.table = new google.visualization.Table(this.$.chart); | |
| 50 } | |
| 51 this.table.draw(new google.visualization.DataTable(this.data)); | |
| 52 } | |
| 53 } | |
| 54 }); | |
| 55 </script> | |
| 56 </polymer-element> | |
| OLD | NEW |