Revision as of 03:30, 3 February 2014

Under construction during Spring 2014.

Summary

Google Charts are relatively easy to get running but have a lot of nuance to them.

The [DataTable] class stores data to be used by charts.

Chart options can be set in multiple ways:

var options = {

 width: 400,
 height: 240,
 title: 'Toppings I Like On My Pizza',
 colors: ['#e0440e', '#e6693e', '#ec8f6e', '#f3b49f', '#f6c7b6']

};

chart.draw(data, options);

chart.setOption('key', value) where key is the option being changed
- Example: chart.setOption('is3D', true);
chart.getOptions() is the read accessor

The [DataView] class changes how a DataTable is represented.

@@ Line 8: / Line 8: @@
 * Data can be imported via JSON or via arrays using [[https://developers.google.com/chart/interactive/docs/reference#dataparam this syntax]].
 ==Charts==
-* Chart options can be set in multiple ways:
+Chart options can be set in multiple ways:
-** at creation by the chart's options parameter
+* at creation by passing JSON as the chart's options parameter
-** chart.setOptions(json) which is equivalent to setting options at creation
+* chart.setOptions(JSON) which is equivalent to setting options at creation
-** chart.setOption('key', value) where key is the option being changed
+** Example:
+<code>
+var options = {
+  width: 400,
+  height: 240,
+  title: 'Toppings I Like On My Pizza',
+  colors: ['#e0440e', '#e6693e', '#ec8f6e', '#f3b49f', '#f6c7b6']
+};
+chart.draw(data, options);
+</code>
+* chart.setOption('key', value) where key is the option being changed
 ** Example: <code>chart.setOption('is3D', true);</code>
+* chart.getOptions() is the read accessor
 ==Views==