Google chart testing
stack date ranges ?
by toubia95
HTML
<script src="http://www.google.com/jsapi?fake=.js"></script>
<div id="visualization"></div>
JavaScript
/* inspired by:
* http://code.google.com/apis/ajax/playground/?type=visualization#line_chart
* http://stackoverflow.com/questions/6359935/setting-a-hard-minimum-axis-value-in-google-charts-api
*/
google.load('visualization', '1', {packages: ['corechart']});
google.setOnLoadCallback(drawVisualization);
function drawVisualization() {
// Create and populate the data table.
var data = new google.visualization.DataTable();
data.addColumn('date', 'x');
data.addColumn('number', 'Période 1');
data.addColumn('number', 'Période 2');
data.addRows(4);
data.setValue(0, 0, new Date(2012, 1, 5));
data.setValue(0, 2, 2);
data.setValue(1, 0, new Date(2012, 1, 10));
data.setValue(1, 1, 1);
data.setValue(1, 2, 2);
data.setValue(2, 0, new Date(2012, 1, 15));
data.setValue(2, 2, 2);
data.setValue(2, 1, 1);
data.setValue(3, 0, new Date(2012, 1, 20));
data.setValue(3, 1, 1);
// Create and draw the visualization.
new google.visualization.LineChart(
document.getElementById('visualization')).
draw(data, {width: 500, height: 400,
interpolateNulls: true,
min: 0,
max: 3,
hAxis: {
format: "MMM dd",
title: "Dates",
viewWindowMode: 'Explicit',
viewWindow:{
min: new Date(2012, 1, 3),
max: new Date(2012, 1, 22)
}
}
});
}