OLD | NEW |
| (Empty) |
1 // Copyright (c) 2012, the Dart project authors. Please see the AUTHORS file | |
2 // for details. All rights reserved. Use of this source code is governed by a | |
3 // BSD-style license that can be found in the LICENSE file. | |
4 | |
5 // A JS Interop sample accessing the Google Charts API. The sample is based on | |
6 // the Bubble Chart example here: | |
7 // https://developers.google.com/chart/interactive/docs/gallery/bubblechart | |
8 | |
9 import 'dart:html'; | |
10 import 'package:js/js.dart' as js; | |
11 | |
12 void drawVisualization() { | |
13 var gviz = js.context.google.visualization; | |
14 | |
15 // Create and populate the data table. | |
16 var listData = [ | |
17 ['ID', 'Life Expectancy', 'Fertility Rate', 'Region', 'Population'], | |
18 ['CAN', 80.66, 1.67, 'North America', 33739900], | |
19 ['DEU', 79.84, 1.36, 'Europe', 81902307], | |
20 ['DNK', 78.6, 1.84, 'Europe', 5523095], | |
21 ['EGY', 72.73, 2.78, 'Middle East', 79716203], | |
22 ['GBR', 80.05, 2, 'Europe', 61801570], | |
23 ['IRN', 72.49, 1.7, 'Middle East', 73137148], | |
24 ['IRQ', 68.09, 4.77, 'Middle East', 31090763], | |
25 ['ISR', 81.55, 2.96, 'Middle East', 7485600], | |
26 ['RUS', 68.6, 1.54, 'Europe', 141850000], | |
27 ['USA', 78.09, 2.05, 'North America', 307007000] | |
28 ]; | |
29 | |
30 var arrayData = js.array(listData); | |
31 | |
32 var tableData = gviz.arrayToDataTable(arrayData); | |
33 | |
34 var options = js.map({ | |
35 'title': 'Correlation between life expectancy, ' | |
36 'fertility rate and population of some world countries (2010)', | |
37 'hAxis': {'title': 'Life Expectancy'}, | |
38 'vAxis': {'title': 'Fertility Rate'}, | |
39 'bubble': {'textStyle': {'fontSize': 11}} | |
40 }); | |
41 | |
42 // Create and draw the visualization. | |
43 var chart = new js.Proxy(gviz.BubbleChart, querySelector('#visualization')); | |
44 chart.draw(tableData, options); | |
45 } | |
46 | |
47 main() { | |
48 js.context.google.load('visualization', '1', js.map( | |
49 { | |
50 'packages': ['corechart'], | |
51 'callback': drawVisualization, | |
52 })); | |
53 } | |
OLD | NEW |