2015-04-27 13:40:57 -04:00
|
|
|
|
<script type="text/javascript" src="//www.google.com/jsapi"></script>
|
|
|
|
|
<script>
|
|
|
|
|
|
|
|
|
|
google.load('visualization', '1', { callback: drawChart, packages: ['corechart'] });
|
|
|
|
|
google.setOnLoadCallback(drawChart);
|
|
|
|
|
|
|
|
|
|
function drawChart() {
|
|
|
|
|
|
|
|
|
|
var data = new google.visualization.DataTable();
|
|
|
|
|
data.addColumn('datetime', 'Time');
|
|
|
|
|
data.addColumn('number', 'Players');
|
|
|
|
|
|
|
|
|
|
data.addRows(players);
|
|
|
|
|
|
|
|
|
|
var options = {
|
2015-04-27 23:29:43 -04:00
|
|
|
|
//curveType: 'function', still haven't decided on this
|
2015-04-27 13:40:57 -04:00
|
|
|
|
height: 300,
|
|
|
|
|
legend: {position: 'none'},
|
|
|
|
|
enableInteractivity: true,
|
|
|
|
|
chartArea: {
|
|
|
|
|
width: '93%'
|
|
|
|
|
},
|
|
|
|
|
vAxis: {
|
|
|
|
|
title: 'Players',
|
|
|
|
|
gridlines: { count: 7 },
|
|
|
|
|
viewWindowMode: 'explicit',
|
|
|
|
|
viewWindow: {
|
|
|
|
|
min: 0,
|
2015-04-27 23:29:43 -04:00
|
|
|
|
max: 18 // for iw4
|
2015-04-27 13:40:57 -04:00
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
hAxis: {
|
|
|
|
|
viewWindow: {
|
2015-04-27 23:29:43 -04:00
|
|
|
|
//min: players[0][0], no longer needed as timeline adjusts automatically
|
|
|
|
|
//max: players[players.length-1][0] // ditto
|
2015-04-27 13:40:57 -04:00
|
|
|
|
},
|
|
|
|
|
gridlines: {
|
|
|
|
|
count: 12,
|
|
|
|
|
units: {
|
|
|
|
|
days: {format: ["MMM dd"]},
|
|
|
|
|
hours: {format: ["HH:mm", "ha"]},
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
minorGridlines: {
|
|
|
|
|
count: 5,
|
|
|
|
|
units: {
|
|
|
|
|
hours: {format: ["hh:mm:ss a", "ha"]},
|
|
|
|
|
minutes: {format: ["HH:mm a Z", ":mm"]}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
|
|
|
|
|
chart.draw(data, options);
|
|
|
|
|
}
|
|
|
|
|
</script>
|