Reload Flot chart every X seconds

871 views
Skip to first unread message

dewa19

unread,
Jul 14, 2008, 2:03:10 AM7/14/08
to Flot graphs
Hi all,

I intend to do chart refresh using Flot, my scenario is - say every 2
seconds- executing specified .php file that extracted data from XML
file and plot fetched data to chart.

Could anybody show me the right way to achieve this purpose?

Many thanks,
-sigit i.-

Ryan Min

unread,
Jul 14, 2008, 9:30:44 AM7/14/08
to Flot graphs
I also want to do it.
But there is no detailed API and flot-refresh-example.

If you want to know, please let me send that reference.
I will also do it.

Thank you.

Roman Prikhodchenko

unread,
Jul 14, 2008, 11:04:25 AM7/14/08
to flot-...@googlegroups.com
function getAjaxData(cfg)
{
    $.getJSON(
    'cgi-bin/get_data.cgi',
    cfg,
    onAjaxSuccess
    );
}

function onAjaxSuccess(data)
{
    ...
    db.push({label: lab, data: tmpdb)
    ...
    $.plot($("#placeholder"), db, options);
}

function cyclerefresh()
{
    getAjaxData(cfg);
    refreshTimeoutId = setTimeout(function(){cyclerefresh()}, 60000);
}



...
cyclerefresh ()
...



--
chujoii

Roman Prikhodchenko

unread,
Jul 14, 2008, 11:14:40 AM7/14/08
to flot-...@googlegroups.com

function cyclerefresh()
{
    getAjaxData(cfg);
    refreshTimeoutId = setTimeout(function(){cyclerefresh()}, 60000);
}




for stop refresh:
clearTimeout(refreshTimeoutId);


60000 == 60sec
for set interval to 2s:
refreshTimeoutId = setTimeout(function(){cyclerefresh()}, 2000);

--
chujoii

Miki

unread,
Jul 14, 2008, 5:59:11 PM7/14/08
to Flot graphs
Hello,

> I intend to do chart refresh using Flot, my scenario is - say every 2
> seconds- executing specified .php file that extracted data from XML
> file and plot fetched data to chart.
>
> Could anybody show me the right way to achieve this purpose?
http://pythonwise.blogspot.com/2008/07/computer-load-ajax-way.html
Not PHP (Python), but I think you'll get the general idea.

HTH,
--
Miki <miki....@gmail.com>
http://pythonwise.blogspot.com

-sigit i.-

unread,
Jul 16, 2008, 2:32:15 AM7/16/08
to flot-...@googlegroups.com
thx alot guys for the idea, i achieve this purpose with this code below :

***BEGIN****
function renderchart()
{
    jQuery.get('refresh_chart.php', function(strdata, textStatus)
        {

            var splitdata = strdata.split("|");   

            var d2 = [];

            jmax=splitdata.length;
            for(var j=0; j < jmax; j++)
                d2.push([j, splitdata[j]]);

            $.plot($("#renderhere"),
            [
            {
                data: d2,
                lines: { show: true }, points: { show: true }
            }
            ]);   

            setTimeout('renderchart();', 1000); // refresh chart every 1 second
        }
    );
}


<body onload="renderchart()">
<div id="renderhere" style="width:350px;height:300px;"></div>
    
</body>

***END****

though the source is not from XML file, but i got the idea :)

thx again,
-sigit i.-
Reply all
Reply to author
Forward
0 new messages