Real-time graphing
From JSXGraph Wiki
The underlying JavaScript code
var brd, g,
x = [], y = [];
brd = JXG.JSXGraph.initBoard('jxgbox', {axis:true, boundingbox:[0,20,30,-2]});
fetchData = function() {
new Ajax.Request('/ajax/fakesensor.php', {
onComplete: function(transport) {
var t, a;
if (200 == transport.status) {
t = transport.responseText;
a = parseFloat(t);
if (x.length<30) {
x.push(x.length);
} else {
y.splice(0,1);
}
y.push(a);
if (!g) { // If the curve does not exist yet, create it.
g = brd.createElement('curve', [x,y],{strokeWidth:3, strokeColor:'green'});
}
brd.update();
};
}});
};
Start = function() {
periodical = setInterval(fetchData,1000); // Start the periodical update
};
Start();
The PHP code of fakesensor.php
<?php
echo mt_rand(0,20);
?>