Based on @Andy's graphic for the graph you could then use Google Graph API to create a less pretty, but automated version of this:

This was created using the following code:
function drawVisualization() {
// Create and populate the data table.
var data = google.visualization.arrayToDataTable([
['Status', 'On', 'Off'],
['12am', 1, 0],
['1am', 1, 0],
['2am', 1, 0],
['3am', 0, 1],
['4am', 1, 0],
['5am', 1, 0],
['6am', 1, 0],
['7am', 1, 0],
['8am', 1, 0],
['9am', 1, 0],
['10am', 1, 0],
['11am', 1, 0],
['12pm', 1, 0],
['13pm', 1, 0],
['14pm', 1, 0],
['15pm', 1, 0],
['16pm', 1, 0],
['17pm', 1, 0],
['6pm', 1, 0],
['19pm', 1, 0],
['20pm', 1, 0],
['21pm', 1, 0],
['22pm', 1, 0],
['23pm', 1, 0],
['12am', 1, 0],
]);
// Create and draw the visualization.
new google.visualization.ColumnChart(document.getElementById('visualization')).
draw(data,
{ width:600, height:100,
chartArea: {height:20},
colors: ['#8ac244','#db1b1c'],
hAxis: {allowContainerBoundaryTextCufoff:true, showTextEvery:6},
vAxis: {gridlines:{count:0}},
bar: {groupWidth:16},
isStacked:true
}
);
}
And you can test the code here: https://code.google.com/apis/ajax/playground/?type=visualization#column_chart
ACTIVE
orDEAD
. And this series is laid over a time axis of 24 hours.