Created
December 10, 2013 10:43
-
-
Save smowtion/7888734 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script> | |
| <script type="text/javascript" src="https://www.google.com/jsapi"></script> | |
| <meta charset=utf-8 /> | |
| <title>JS Bin</title> | |
| </head> | |
| <body> | |
| <div id='visualization' ></div> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Load the Visualization API and the piechart package. | |
| google.load('visualization', '1.0', {'packages':['corechart']}); | |
| // Set a callback to run when the Google Visualization API is loaded. | |
| google.setOnLoadCallback(drawChart5); | |
| function drawVisualization() { | |
| var data = new google.visualization.DataTable(); | |
| data.addColumn('string', 'time'); | |
| data.addColumn('number', 'value'); | |
| data.addColumn('number', 'points'); | |
| data.addColumn({type: 'string', role:'annotation'}); | |
| data.addColumn({type: 'string', role:'annotationText'}); | |
| data.addRows([ | |
| ['12:00', 1, null, null, null], | |
| ['13:00', 5, null, null, null], | |
| ['14:00', 8, 8, 'A', 'This is Point A'], | |
| ['15:00', 12, null, null, null], | |
| ['16:00', 11, 11, 'B', 'This is Point B'], | |
| ['17:00', 15, null, null, null] | |
| ]); | |
| new google.visualization.LineChart(document.getElementById('visualization')). | |
| draw(data, { | |
| series: { | |
| 0: { | |
| // set any applicable options on the first series | |
| }, | |
| 1: { | |
| // set the options on the second series | |
| lineWidth: 0, | |
| pointSize: 5, | |
| visibleInLegend: false | |
| } | |
| } | |
| }); | |
| } | |
| function drawChart5() { | |
| var data = new google.visualization.DataTable(); | |
| data.addColumn('string', 'Date'); | |
| data.addColumn('number', 'Links'); | |
| data.addRows(29); | |
| data.setValue(1, 0, 'Oct 16, 2011'); | |
| //data.setValue(1, 1, 0); | |
| //data.setValue(2, 0, 'Oct 20, 2011'); | |
| //data.setValue(2, 1, 0); | |
| //data.setValue(3, 0, 'Nov 12, 2011'); | |
| //data.setValue(3, 1, 0); | |
| //data.setValue(4, 0, 'Nov 19, 2011'); | |
| //data.setValue(4, 1, 0); | |
| data.setValue(5, 0, 'May 16, 2012'); | |
| //data.setValue(5, 1, 0); | |
| //data.setValue(6, 0, 'Jun 28, 2012'); | |
| //data.setValue(6, 1, 0); | |
| data.setValue(7, 0, 'Aug 25, 2012'); | |
| //data.setValue(7, 1, 0); | |
| //data.setValue(8, 0, 'Oct 24, 2012'); | |
| //data.setValue(8, 1, 0); | |
| //data.setValue(9, 0, 'Jan 4, 2013'); | |
| //data.setValue(9, 1, 0); | |
| data.setValue(10, 0, 'Mar 2, 2013'); | |
| //data.setValue(10, 1, 0); | |
| //data.setValue(11, 0, 'Mar 14, 2013'); | |
| //data.setValue(11, 1, 0); | |
| //data.setValue(12, 0, 'Mar 30, 2013'); | |
| data.setValue(12, 1, 1502119); | |
| data.setValue(13, 0, 'Apr 13, 2013'); | |
| data.setValue(13, 1, 1561209); | |
| data.setValue(14, 0, 'Apr 14, 2013'); | |
| data.setValue(14, 1, 1561209); | |
| data.setValue(15, 0, 'Apr 22, 2013'); | |
| data.setValue(15, 1, 1565393); | |
| data.setValue(16, 0, 'May 8, 2013'); | |
| data.setValue(16, 1, 1573747); | |
| data.setValue(17, 0, 'May 12, 2013'); | |
| data.setValue(17, 1, 1573747); | |
| data.setValue(18, 0, 'May 28, 2013'); | |
| data.setValue(18, 1, 1573747); | |
| data.setValue(19, 0, 'Jun 13, 2013'); | |
| data.setValue(19, 1, 1547980); | |
| data.setValue(20, 0, 'Jul 6, 2013'); | |
| data.setValue(20, 1, 1615059); | |
| data.setValue(21, 0, 'Sep 2, 2013'); | |
| data.setValue(21, 1, 1673092); | |
| data.setValue(22, 0, 'Sep 30, 2013'); | |
| data.setValue(22, 1, 1673092); | |
| data.setValue(23, 0, 'Oct 26, 2013'); | |
| data.setValue(23, 1, 1725497); | |
| data.setValue(24, 0, 'Nov 14, 2013'); | |
| data.setValue(24, 1, 1743740); | |
| data.setValue(25, 0, 'Nov 15, 2013'); | |
| data.setValue(25, 1, 1743740); | |
| data.setValue(26, 0, 'Nov 25, 2013'); | |
| data.setValue(26, 1, 1739153); | |
| data.setValue(27, 0, 'Dec 7, 2013'); | |
| data.setValue(27, 1, 1736957); | |
| google_result = new google.visualization.AreaChart(document.getElementById('visualization')); | |
| var options = { | |
| title: 'Chart', | |
| legend: {position: 'none'}, | |
| pointSize : 5, | |
| series: [{color: 'blue', pointSize: 4}], | |
| //tooltip: {trigger: 'none'}, | |
| vAxis: { | |
| format: '$' | |
| } | |
| }; | |
| google_result.draw(data, options ); | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment