Animations

An animation in JavaView is like an interactive movie. A geometry (or even a whole scene) is evolving in time. While watching the process the user can still (unlike in a movie) interact with the display, e.g. change the position of the camera or the view direction. This tutorial gives an example of an animation in JavaView and explains how to control them.

Creating your own animation

Based on the city tutorial, we built a volcano. It is our goal to place small lava cubes inside the volcano and let them rain over the city. To do so you have to do the following:

1. Build a volcano (cf. figure).
2. Place a small red cube inside the volcano.
3. Hide all geometries (show/hide with tab) except the red cube and one house.
4. Open the display panel with CTRL-d. The only selected items in the area of visible geometries are the house and the cube. Hit 'merge visible', which will melt both geometries to one.

These steps are necessary, so that we can change the objects, which are affected by the animation. In the case, that both do not belong to one geometry, one could only change the house or the cube.

To prepare an animation:

1. Mark all vertices of the cube by holding the key m and select them.
2. Set a first keyframe by pressing CTRL-k.
3. Open a dialog via the menu entry Method → Modelling → Transform Geometry, with which we can translate parts of the geometry, in our case the cube. Here we have to make sure to hit 'only selected vertices'.

Now all necessary windows are open to animate the object (which is in our case the cube). For the creation of the animation we have to repeat the steps:

1. Set a timestep in the animation panel.
2. Move the cube in the transform panel to the new position with the help of the translate geometry sliders.
3. Hit the main window and press CTRL-k.

After several keyframes got defined, we can play the animation.

Save as an animated GIF

To save the animation as an animated GIF perform the following steps:

1. First save the animation in terms of several seperate GIF files for each frame. To do so, press Control + A and click on the settings icon next to the timeline. Here you can set the number of pictures, their width and height and by clicking "save" animation, you obtain several GIF files, one for each frame of your animation.

To merge the separate files into an animated GIF in Photoshop do the following:

1. Open Photoshop.
2. Choose File → Scripts → Load files in stack
3. Display the animation toolbar by Windows → Animation.
4. In the animation toolbar, click its menu and choose "Frames from Layers".
5. If the frames are running your animation backwards, in the same menu, choose "Reverse Frames".
6. Choose File → Save for Web and Devices and save your animated GIF.

Using imagemagic, the following command suffices to merge files image0.jpg, image1.jpg, etc. into an animated my_animation.gif:

convert -delay 20 -loop 0 image*.jpg my_animation.gif

Example

Subsection: Example

A typical example of an animation is a dynamic surface. The example on the right shows a catenoid transforming into a helicoid. The mathematical background here is that the catenoid and the helicoid are conjugate minimal surfaces. During the whole transformation the surface stays a minimal surface. The set of all these surfaces is called the associated family of the catenoid (resp. the helicoid). The transformation has beautiful mathematical properties, e.g. the normals at each point of the surface do not change. The formula for the transformation is:

x(u,v,t) = cos(t)sinh(v)sin(u)+sin(t)cosh(v)cos(u)
y(u,v,t) = cos(t)sinh(v)cos(u)+sin(t)cosh(v)sin(u)
z(u,v,t) = u cos(t)+v sin(t)

where the parameter t goes from 0 to Pi/2 with t=0 being the helicoid and t=Pi/2 representing the catenoid.

The catenoid - a minimal surface and its conjugate minimal surface - the helicoid.

Animation Panel

Now lets take a look at the animation panel. You can open the animation panel by focussing the mouse over the display and pressing CTRL-a or via the main menu through Window --> Animation.

The first control is a slider and an input Time, where you can select individual timeframes of the transformation. In this example values from 0 to 720 are valid, which correspond to two full transformations from the catenoid to the helicoid and back. Next are three radio boxes, with which you can control the behavior on ending of the animation. The first radio box One Way ends the animation after one pass, the second Loop loops through the animation meaning after completing one pass it jumps back to the start and runs again. Finally the third option named Back/Forth runs backward after one pass to the beginning and continues from there on. The last button Close closes the window and keeps the animation in the state in which it is at the moment, e.g. running in a loop.

Comments

1

-- WikiGuest - 19 May 2024

1

-- WikiGuest - 19 May 2024

1

-- WikiGuest - 19 May 2024

1

-- WikiGuest - 19 May 2024

I6VoJehT

-- WikiGuest - 19 May 2024

1*1

-- WikiGuest - 19 May 2024

1*694*689*0

-- WikiGuest - 19 May 2024

1*1

-- WikiGuest - 19 May 2024

1*926*921*0

-- WikiGuest - 19 May 2024

1*1

-- WikiGuest - 19 May 2024

1*782*777*0

-- WikiGuest - 19 May 2024

1*1

-- WikiGuest - 19 May 2024

1*448*443*0

-- WikiGuest - 19 May 2024

-1 OR 2+366-366-1=0+0+0+1

-- WikiGuest - 19 May 2024

-1 OR 3+366-366-1=0+0+0+1

-- WikiGuest - 19 May 2024

if(now()=sysdate(),sleep(15),0)

-- WikiGuest - 19 May 2024

0'XOR(if(now()=sysdate(),sleep(15),0))XOR'Z

-- WikiGuest - 19 May 2024

0"XOR(if(now()=sysdate(),sleep(15),0))XOR"Z

-- WikiGuest - 19 May 2024

(select(0)from(select(sleep(15)))v)/*'+(select(0)from(select(sleep(15)))v)+'"+(select(0)from(select(sleep(15)))v)+"*/

-- WikiGuest - 19 May 2024

-1

-- WikiGuest - 19 May 2024

-1)

-- WikiGuest - 19 May 2024

1 waitfor delay '0:0:15' --

-- WikiGuest - 19 May 2024

hVV943iI'

-- WikiGuest - 19 May 2024

-5 OR 446=(SELECT 446 FROM PG_SLEEP(15))--

-- WikiGuest - 19 May 2024