Dygraph
Plotter Mode
HTML
<script src="http://dygraphs.com/dygraph.js"></script>
<div id="div_g" style="width: 600px; height: 300px;"></div>
JavaScript
$(document).ready(function() {
var count = 0;
var data = [], t = new Date();
for (var i = 30; i >= 0; i--) {
var x = new Date(t.getTime() - i * 100);
data.push([x, Math.sin(i/3)]);
}
var g = new Dygraph(document.getElementById("div_g"), data,
{
drawPoints: false,
//showRangeSelector: true,
valueRange: [-1.1, 1.1],
labels: ['Time', 'Random']
});
window.intervalId = setInterval(function() {
var x = new Date();
var y = Math.sin(count);
count+=0.2;
data.push([x, y]);
var samples = 200;
var d2 = data.length - 1;
var d1 = (d2 >= samples) ? (d2 - samples) : 0;
var dw = [data[d1][0], data[d2][0]];
g.updateOptions({ 'file': data, 'dateWindow': dw });
}, 1);
});