• Post Reply Bookmark Topic Watch Topic
  • New Topic

Can I animate JPEGs in JSP?  RSS feed

 
Mike London
Ranch Hand
Posts: 1500
11
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I build several JPEG files using JFreeChart in an automated process.

I then want to display these created JPEGs to the user and give the illusion of animation.

So, what I want to do is to have each image appear in the same place on the JSP page to give this illusion of animation.

However, when I try to display the three images in a for loop, I end up getting three images down the page instead of one image that changes. (The resulting HTML page source has three img tags instead of one).

Do I need to use Flash for this or can this animation be done in JSP.

Also, I tried to do a Thread.sleep(1000), but it didn't seem to pause correctly.

I would welcome any advice or suggestions on this.

Thanks.

----

Mike
 
Bear Bibeault
Author and ninkuma
Marshal
Posts: 66264
151
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Think about it.

JSP executes on the server in order to construct an HTML page to display in the browser. So any looping that you do in JSP happens in order to build an HTML to send after the JSP is executed.

So if you want client-side activity, you need client-side technology. Flash is one way, but for simply swapping out images, some very simple Javascript will do just fine.

For more on JSP please read this article.
 
Ulf Dittmer
Rancher
Posts: 42972
73
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Voodoo's Introduction to JavaScript covers switching images in Part 8.
 
Mike London
Ranch Hand
Posts: 1500
11
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thanks Bear and Ulf! I clearly wasn't thinking about JSP vs. Javascript and thank you both for helping me focus on client vs. server. (Java Ranch to the Rescue!!! <s>

I came up with the following functions below to "animate" my charts. I see that there's no built in way to pause execution "between" Javascript statements (rather the pause is between calls to a function).

So, assuming I have three JPEGs, chart1, chart2, and chart3, I wrote the functions as you see below.

Can these be improved? What if I had 100 (or 1000) images I wanted to animate with a 1 second delay between images. I don't see how Javascript makes this delay easy. I'd hate to add 1000 "if else" clauses to the code below for each image!

Look forward to any updates and replies!

Thanks.

mike

---------------

function showChart()
{
var timeOut = setTimeout("nextChart(1)", 2000);
var timeOut = setTimeout("nextChart(2)", 3000);
var timeOut = setTimeout("nextChart(3)", 4000);
}

function nextChart(nextChart)
{
if (nextChart == 1)
{
document.chart.src = "chart1.jpg";
}
else if (nextChart == 2)
{
document.chart.src = "chart2.jpg";
}
else
{
document.chart.src = "chart3.jpg";
}
}
 
Eric Pascarello
author
Rancher
Posts: 15385
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
One thing you need to note is there will be a LOAD time. Depending on the size of the file, it may be big.

In that case you might want to look at preloading the images. You can search the net for JavaScript image preloaders.

Eric
 
Bear Bibeault
Author and ninkuma
Marshal
Posts: 66264
151
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Please use UBB code tags when posting code.

I would not pre-schedule all the time-out handlers up front as you are doing. Rather, I'd either schedule the next time-out when the previous time-out fires, or use setInterval rather than setTimeout.
[ January 10, 2007: Message edited by: Bear Bibeault ]
 
Cameron Wallace McKenzie
author and cow tipper
Saloon Keeper
Posts: 4968
1
Hibernate Spring Tomcat Server
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Ya know, you can animate a JPG with JavaScript, but I must say, using some of the gif animator tools you can try out at tucows might be more up your alley.

I've tried a bunch of them, and they're all fairly straight forward. Just convert the JPG to GIF, which you can do with pretty much any image viewer, and create an animated GIF. Then they'll even work if a client has turned scripting off.

-Cameron McKenzie
 
Bear Bibeault
Author and ninkuma
Marshal
Posts: 66264
151
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Did you miss his very first sentence?

I build several JPEG files using JFreeChart in an automated process.
 
Mike London
Ranch Hand
Posts: 1500
11
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Cameron,

As Bear pointed out, the process I've built is currently automated. However, an automated GIF is yet another cool solution I might use for another project.

Thanks very much for mentioning this idea!

---------

M
  • Post Reply Bookmark Topic Watch Topic
  • New Topic
Boost this thread!