Création des Logiciels de gestion d'Entreprise, Création et référencement des sites web, Réseaux et Maintenance, Conception
Création des Logiciels de gestion d'Entreprise, Création et référencement des sites web, Réseaux et Maintenance, Conception
<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>
The result looks like this: var view = new google.visualization.DataView(data);
view.setColumns([0,3]);
And initialize the BarsOfStuff chart with the DataView: stuffchart.draw(view, stuffoptions);
And we get: