How do I update, in real time, my Gauge chart data (from gauge-ajax.html)?

« Back to message list

Enter your email address to get email updates on this topic. You can stop receiving updates by clicking the link in the update email messages.

Posted by Dennis on 9th April 2014
Dear Everyone,

I'm trying to exercise gauge-ajax.html with my embedded application.
Somehow the gauge does not update real-time data when calling getdata.html

In file getdata.html, I have text as following: 44,58,44,57,26,44,58,44,57,26

I keep the origin gauge-ajax.html code as following:
var gauge = new RGraph.Gauge('cvs', 0, 100, 7)
.set('border.outline', 'transparent')
.set('needle.colors', ['red'])
.set('needle.type', 'line')
.set('needle.tail', true)
.set('needle.size', 55)
.set('centerpin.radius', 0.1)
.set('', 'Speed')
.set('labels.centered', true)
.set('labels.offset', 7)
.on('draw', function (obj){
     var co = obj.context;

    // This circle becomes the border of the centerpin
    co.fillStyle = '#aaa';
    co.arc(obj.centerx, obj.centery, 10, 0, RGraph.TWOPI, false);
var delay = 1500;
function myAJAXCallback(num){
gauge.value = num;
/* Make another AJAX call after the delay (which is in milliseconds)*/
setTimeout(function (){RGraph.AJAX.getCSV('/getdata.html', myAJAXCallback);}, delay);

Do I need to add anything into getdata.html file?

Thanks in advance,
Posted by Richard on 10th April 2014
Hi there,

You're using the RGraph.AJAX.getCSV - which returns a string - not a number. So you could either change your AJAX call to RGraph.AJAX.getNumber and the first number will be returned or you could do this in your callback function:

gauge.value = Number(num);

To change the string to a number (it'll be the first number in your string IIRC).

Posted by Dennis on 10th April 2014
Hi Richard,
Thanks for the information.
Also after get the number, I need to call gauge.grow()

Add a reply

« Back to message list