Following the lead of the example on the documentation for Rickshaw (http://code.shutterstock.com/rickshaw/examples/fixed.html), I've knocked together something similar to what you need:
var tv = 50;
var throughput = new Rickshaw.Graph({
element: document.querySelector("#throughput_chart"),
width: "300",
height: "200",
renderer: "line",
series: new Rickshaw.Series.FixedDuration([{
name: 'one', color: 'gold'
}], undefined, {
timeInterval: tv,
maxDataPoints: 100,
timeBase: new Date().getTime() / 1000
})
});
var alerts = new Rickshaw.Graph({
element: document.querySelector("#alerts_chart"),
width: "300",
height: "200",
renderer: "line",
series: new Rickshaw.Series.FixedDuration([{
name: 'one', color: 'red'
}], undefined, {
timeInterval: tv,
maxDataPoints: 100,
timeBase: new Date().getTime() / 1000
})
});
for(var i = 0; i < 100; i++){
addRandomData(throughput);
addRandomData(alerts);
}
throughput.render();
alerts.render();
setInterval(function () {
addRandomData(throughput);
addRandomData(alerts);
throughput.render();
alerts.render();
}, tv);
function addRandomData(chart) {
var data = {
one: Math.floor(Math.random() * 40) + 120
};
chart.series.addData(data);
}