Automatic refresh of charts - Ajax?

[gschrade]

I have a need to have charts automatically refresh every second to few seconds. The data from which the charts are created is updated very often (< 1 sec.). Is there a way to have just the chart on the page, or even just the portions of the chart (e.g. bars), change automatically based on the changing data? Maybe using AJAX, JSF, GWT, or something?

Thanks in advance!

[david.gilbert]

Personally I'd do this with an applet, or try to escape the browser altogether. But I'm no web specialist, so you shouldn't trust my advice.

[gschrade]

ok, how would you do it escaping the browser? Using Swing?

[david.gilbert]

A Swing application launched with Java web start is an option...it depends what your application does of course. If you need to be in a web page (and sometimes you do) then maybe you could look at some Flash based chart libraries (because applets are viable in say a corporation where the desktop is pretty standardised, but still a pain in the behind out on the wild web). Mind you, some say the same about Java web start. Then again, Ajax isn't a bed of roses either. Tough problem, I guess.

[gschrade]

David, what are "Flash based chart libraries"? Java libraries that Adobe Flash provides?

[david.gilbert]

No, not Java. The Flash player is a bit more lightweight than Java, and you can write programs for it using ActionScript. Here's a free chart library that is "Flash-based":

http://teethgrinder.co.uk/open-flash-chart/

Browser support for Flash is a little more dependable than Java support, allegedly, and start up times are meant to be better. It is an option to consider.

[gschrade]

Thanks David

[jleech]

Thoughts...

First -
If the charts are small enough - either because the physical dimensions (pixels) are small or the data density is small then reloading the entire chart every few seconds is practicable even for JfreeChart. If you use SVG and gzip compression, even physically large charts would be practicable. Using caching on the server to cache the same chart image for all the users that would be reloading it would keep the load on the server due to rendering to a minimum. Depending on how many users there are, this could represent quite a bit of network traffic, this would be less of a concern on an intranet application. It would still be manageable on the big bad internet, and would be scalable if you clustered or even better did geographic load balancing.

Second -
If you were to use SVG, you could send partial updates to the client from the server. You would need to essentially "diff" the two versions of the chart, and produce a set of javascript DOM calls that would convert the first version to the second. The client would receive the update from the server, run the javascript, and presto, the chart would be updated. This would take quite a bit of code especially on the server but would be a very useful feature. You could probably also do something similar with Canvas and only send the data for the pixels that need to be updated.

Third -
I have been thinking about the possibility of "porting" the relevant parts of JFreeChart to javascript using GWT or something similar. Then JFreeChart could run in the browser without Java, and render straight to a Canvas or SVG backend. It would receive the updated data via AJAX on any transport you want -- XML, JSON, etc. etc.

[ardienne]

How do I default an enter-press to a non-submit button? I'd like to make a search bar were the user can press enter, and the results are posted without having to refresh the page. If I make the "search" button a submit button, the page will refresh. If I make the "search" button a regular button, the page will load the results without refreshing. But the user can't use the enter key to search.
_______________________
matrimonial

[jleech]

How do I default an enter-press to a non-submit button? I'd like to make a search bar were the user can press enter, and the results are posted without having to refresh the page. If I make the "search" button a submit button, the page will refresh. If I make the "search" button a regular button, the page will load the results without refreshing. But the user can't use the enter key to search.

Kind of off-topic for the JFreeChart forum but you can either:
a) Use a submit button. In the onsubmit, post the form contents via AJAX. The trick to not having the browser also submit the form and thus refresh the page is simply to return false;
b) Use a button. Register a keystroke event handler and capture the enter keypress. IMO keystroke event handling in web browsers is poorly supported and tricky and its better to stay away from it. Also take into consideration the fact that different browsers do different things with the enter keypress and forms, depending on the number of fields in the form and browser the enter will submit the form. If the user is in the middle of selecting in a dropdown list pressing enter will do different things, etc, etc.