<html> <head> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <link rel="stylesheet" type="text/css" href="http://visapi- gadgets.googlecode.com/svn/trunk/barsofstuff/bos.css"/> <script type="text/javascript" src="http://visapi- gadgets.googlecode.com/svn/trunk/barsofstuff/bos.js"></script> <script type="text/javascript"> google.load("visualization", "1", {packages:["barchart","table"]}); google.setOnLoadCallback(drawData); // Initialize the DataTable function drawData() { var data = new google.visualization.DataTable(); data.addColumn('string', 'Line'); data.addColumn('number', 'Revenue'); data.addColumn('number', 'Expenses'); data.addColumn('number', 'Commuters'); data.addRows(4); data.setValue(0, 0, 'NorthEast'); data.setValue(0, 1, 38350); data.setValue(0, 2, 15724); data.setValue(0, 3, 1534); data.setValue(1, 0, 'Cross-Pacific'); data.setValue(1, 1, 25740); data.setValue(1, 2, 12613); data.setValue(1, 3, 1170); data.setValue(2, 0, 'Midwest'); data.setValue(2, 1, 11550); data.setValue(2, 2, 4389); data.setValue(2, 3, 660); data.setValue(3, 0, 'Pan-America'); data.setValue(3, 1, 21720); data.setValue(3, 2, 9774); data.setValue(3, 3, 362); //Draw the charts var table = new google.visualization.Table(document.getElementById('table_div')); table.draw(data, {showRowNumber: true}); var chart = new google.visualization.BarChart(document.getElementById('chart_div')); chart.draw(data, {width: 400, height: 240, is3D: false, title: 'Acme Rail Yearly Performance'}); var stuffoptions = {title: 'Acme Rail Commuters by Line'}; var stuffchart = new BarsOfStuff(document.getElementById('stuff_div')) stuffchart.draw(data, stuffoptions); } </script> </head> <body> <div id="table_div"></div> <div id="chart_div"></div> <div id="stuff_div" style="width: 400px"></div> </body></html>
var view = new google.visualization.DataView(data); view.setColumns([0,3]);
stuffchart.draw(view, stuffoptions);
http://chart.apis.google.com/chart?cht=p3&chd=s:hW&chs=250x100&chl=Hello|World
