JFreechart HTML/JSP Ajax/DWR

[mausbull]

Hi,

Here is my problem:
I have a JSP page where I want to display a chart (on top) and a grid (on the bottom).
When the user clicks on a cell of that grid the chart should change according to the selected cell. In order to maintain some performance I don't want to submit or refresh the whole page.

Now I've tried the following scenario:
Using javascipt and dwr (direct web remoting) I call a function in a session bean which generates a chart and sends it back in an byte[] which should change, again via javascript, the image. But I think an <img> tag cant handle a byte[].

So how can I change that chart without refreshing the whole page or submitting a form?

thanks for your suggestions
Stephan

[Guest]

This is not an ajax issue, since you do not use the XMLHttpRequest object to solve this. Instead, you change the img's src attribute to get the browser to show a new image in its place. What you return with that URL for the src attribute needs to be an image (png, jpeg or gif ONLY). I recommend a tool called Fiddler to watch the data go back and forth. If you are sending an image back you can actually view it in Fiddler.

Long story short: if you don't send an image back after the user clicks you will not be able to update the image in the page. Javascript can't directly get at binary data for the image, so you have to rely on the browser getting an image (with proper content-type headers). You might find a google search on "javascript image switching" helpful, since that's really the only part you're having difficulty with.

Does that help?

[mausbull]

Well yes it helps a little bit.
But the thing is I don't know how I should return an image from my session bean back to my jsp site. I thought I can somehow convert that byte[] into an image, but as it looks like I cant.

So I need to either send back an image or store it in a session or something like that where I can retrieve it?

thanks
Stephan

[Guest]

Try these threads:
http://www.jfree.org/phpBB2/viewtopic.php?t=9621
http://www.jfree.org/phpBB2/viewtopic.php?t=15627

[mausbull]

well,

first thanks for your help, now it works almost perfect.

there is just one little problem left:
right now when the user clicks on a cell of the grid, I send a message via DWR to a session bean, which stores the correct chart in the session.
In my img tag I use a servlet to display the graph, which takes the chart out of the session, calculates the image and sends it back.

Using Internet Explorer I can reload the servlet via resetting the img src attribute in javascript. But this doesn't work in Firefox.

So does anyone have an idea how I can reload only an image (which is generated by a servlet)?

thanks again
Stephan

[Erica]

For the most part, I've never found a way to reload just an image. Changing the src attribute usually seems to work. FireFox is probably cacheing the image, and thusly not reloading it because it's still looking for the same image.
You might be able to cheat by changing the source to a different image (saying "loading" or something), and then quickly switch back to the chart server image.
You may also be able to have the chart sevlet to respond to two names, and switch between them. FireFox should "think" it's a new image and do the reload.
I haven't tried either, so I don't know that either will work.

You may also be able to use AJaX to reload just the image, but I'm not all that familiar with AJaX, so I couldn't tell you how.

[Guest]

Yes I do think it has something to do with the firefox caching behavior.
I tried to apply this little cheat you gave me, but it didn't work out. I also tried to reset the whole img tag but it still only works in IE.

Does anyone have an idea how I can manipulate the caching behavior of my firefox. I've found this post in the big jsp thread:

Hi, every one.,
I use this ChartViewer code example to create my image charts.
I pass some parameters to the servlet chart, but when I change some parameters, ChartViewer show me the last chart , not the new that I selected.
But when I reload the page, the refresh my chart.
I put on my jsp page.

Code: Select all

<meta http-equiv="Cache-Control" CONTENT="no-cache">
<meta http-equiv="Pragma" CONTENT="no-cache">

But is the same.

You have to set the cashe control also for your ChartViewer Servlet

Code: Select all

response.setHeader("Pragma", "No-cache");
response.setDateHeader("Expires", 0);
response.setHeader("Cache-Control", "no-cache");

Looking for help again.

tx Stephan

[shadowfiend]

A bit later, but another potential solution to dodge Firefox's caching behavior is to attach a random number to the image src attribute. i.e., instead of switching srcs to `<img src="stuff" />', you switch to `<img src="stuff?1235532123" />'. If you use a different random number every time, you should minimize cache hits for that image. That in combination with the cache controlling mechanisms specified above should just about eliminat cache problems.

[mausbull]

yep cool that solves the problem.

many thanks
stephan