开发者

continuous moving graph using JavaScript or flash

I have some data and I want to plot a graph using that data. The problem is that the data keeps on changing (multiple files) and I want t开发者_如何学Pythonhe graph to be continuous (something like ECG). Can anyone help me with the ideas?


One way to this is with a bit of Ajax which polls the server at regular intervals for the data, either file or script. You would then update whichever graphing library component you are using to display the graph on the page. By utilizing an ajax call you avoid reloading the page and the user will see a moving graph very much like an ECG.

There is a little tutorial on the following page which demonstrates this and provides the necessary javascript to poll the server and update a graphing component every second:-

Scrolling graph tutorial


This type of graph is usually called a Histogram (similar to your CPU usage chart) that keeps on scrolling.

You just need to update a chart periodically with the last x number of points along the timeline.

Are you looking for something specific, eg components to use etc? Some info about technologies would help.


You could use jQuery (other JS Frameworks are available).

Do a call back to get a delta of the changed data and then animate the graph to move along to a certain point. If you use something like Flot then you can do it all with one JS Framework


This is how to draw ECG by a timer so you can have it continuous drawing:

http://osama-oransa.blogspot.com/2010/03/draw-ecg-using-java-script-draw.html


You can do that with ZoomCharts.com

This library offers you data push option, so you can setup web sockets solution and push data in these charts real time. Alternatively, you can setup polling timeout and have your chart updated that way.

Time Chart has feature to follow latest data, so it would be moving on continuously.

See example where we are using this chart to monitor server real time with web socket data push:

continuous moving graph using JavaScript or flash

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜