Advanced Effects in VRML

→Return to content preparation overview

Animation

The animation in VRML is driven by events. A TimeSensor generates fractionChanged events as fast as possible and routes these
events to interpolators. The interpolator nodes uses the key and key values to determine the current value which will be set on the
attribute of another node. (e.g. rotation field of a Transform node) VRML uses ROUTES to connect the input and ouput of nodes.

There are several types of interpolators for different types of animations in VRML:

• ColorInterpolator => material animation (e.g. Diffuse, Specular, Emissive)
• OrientationInterpolator => transform animation (e.g. Rotation)
• PosInterpolator => transform animation (e.g. Translation, Scale)
• CoordinateInterpolator => vertex animation
• ScalarInterpolator => transparency animation

Transform animations are very lightweight and do not require a lot of computing power, while vertex animations can lead to huge
files, long loading times and low framerates. This is especially true if vertex animations are used for high poly geometry, as every vertex
position has to be stored for every keyframe, furthermore the normals have to be recalculated for every keyframe. But sometimes
vertex animations are necessary, as they are often the only way to export bone animations.

Movietextures

Movietextures enable you to display movie clips on 3D objects. In order for the movietextures to work, the codec for the movie
clip has to be installed on the system. We recommend to use .wmv as it is available on every Windows PC out of the box. Furthermore
you should use small sized clips, otherwise the playback of high res movies and realtime rendering might affect the frame rate.

The following sample demonstrates the proper use of the StereoMovieTexture node:

#VRML V2.0 utf8

# Produced by 3D Studio MAX VRML97 exporter, Version 8, Revision 0,92
# MAX File: Rectangle2.max, Date: Thu May 15 12:10:05 2008


#NOTE: This viewpoint is required for the StereMovieTexture node
DEF persp Viewpoint
{
  position    0.000000 0.000000 1000.000000
  orientation 0 0 -1 0
  description    "persp"
}

#red cube with TouchSensor to start the movie on mouse click
Transform
{
    translation -40 0 0 
    children
    [
        DEF STARTTOUCH TouchSensor{}
        Shape
        {
            appearance Appearance 
            {
            material Material 
            {                            
                    transparency 0
                    diffuseColor 1 0 0 
             }
         }
            geometry Box
            {
                size 20 20 20
            }
        }
    ]
}

#green cube that will stop the movie on mouse click
Transform
{
    translation 40 0 0 
    children
    [
        DEF STOPTOUCH TouchSensor{}
        Shape
        {
            appearance Appearance 
                {
                material Material 
                {                            
                        transparency 0
                        diffuseColor 0 1 0 
                 }
             }
            geometry Box
            {
                size 20 20 20
            }
        }
    ]
}

DEF Rectangle01 Transform {
  rotation 1 0 0 -1.571
  translation 0 0 0
  scale 1 1 1
  children [ 
        
        Shape 
        {
            appearance Appearance 
            {
            material Material 
            {                            
                    # // transparency 0: shape is completely opaque; transparency 1: the shape is completely transparent
                    transparency 0
                    diffuseColor 1 1 1 
          }
                #The stereomovietexture node references the movie file - in this case a .wmv file
                texture DEF MOVIE StereoMovieTexture 
                {
                    url "movie.wmv"
                    startTime 1        
                    stopTime 0
                    loop FALSE
                    repeatS    FALSE #is important for making sure that a NON-POW-OF2 is created 
                    repeatT    FALSE #is important for making sure that a NON-POW-OF2 is created 
                }
        }

            #4:3 ratio here
          geometry Box 
          { 
              size 80 0.1 60 
          }
        }        
            
  ]
}

#for starting the movie manually
DEF TIMER_START_MOVIE TimeSensor {
    loop FALSE
}

#for stopping the movie manually
DEF TIMER_STOP_MOVIE TimeSensor {
    loop FALSE
}

#for interaction (starting/stopping from the outside)
ROUTE STARTTOUCH.touchTime TO TIMER_START_MOVIE.startTime
ROUTE STOPTOUCH.touchTime TO TIMER_STOP_MOVIE.startTime

ROUTE TIMER_START_MOVIE.startTime TO MOVIE.startTime
ROUTE TIMER_STOP_MOVIE.startTime TO MOVIE.stopTime

You can download the sample file here: movietexture.zip.
The example uses the TouchSensor node (attached to cubes on the sides of the plane) to start and stop the movie.
Keep in mind that movie textures only work reliably in DirectX mode. You have to use one timer to start the movie
and one timer to stop the movie file. Even if the object with the movie file is no longer visible, the sound of the movie
will continue playing until you stop the movie by triggering the TIMER_STOP_MOVIE timer. The loop property of the
MOVIE node determines if the movie will replay after it has finished. This property can also be set with the SetVRMLField
action of the Workflow Authoring application. The movietexture can be mapped on arbitrary 3D objects, just like a
regular file texture, as long as they have valid texture coordinates. (The box primitive used in this example generates
3D textures automatically)

Here is another sample that demonstrates how to use pause/resume with movie textures: MovieTexturePauseResume.zip

Flash Movietextures

If you are planning to use movie textures with transparency/alpha you can use the new FlashMovieTexture node starting with Unifeye Design 2.5. It allows the usage of Flash .swf files with transparency. You can download a sample FlashTextureTest.wrl that uses a .swf file from an external URL. It is important to set the format in the parameter section of the FlashMovieTexture to A8R8G8B8 in order for the transparency to work correctly.

Please note that the FlashMovieTexture requires the Flash ActiveX Control, which will only be installed when you run the Flash Player setup within Internet Explorer. You can check if the Flash ActiveX control is installed, by selecting Flash Player (32-bit) in the control panel and navigating to the Advanced tab. The FlashMovieTexture node has been tested succesfully with Flash Player version 11.1.

texture DEF SWF FlashMovieTexture {
   loop FALSE
   repeatS FALSE 
   repeatT FALSE
   stream TRUE                            
   url ["http://www.leconcombre.com/stock/froggie05.swf"]
   parameter [ "width=512" "height=256" "subtexture" "format=A8R8G8B8" "transparent" "backgroundColor=16777215"]
}

Hardware Shader

The standard VRML material has only a few settings and is limited by the default OpenGL/!DirectX pipeline. To
create effects like environment mapping, bump mapping or ocean waves you can use the ShaderAppearance node
to include realtime shaders with the help of .fx effect files. These effect files are small shader programs that
override the default rendering pipeline and allow you to create custom effects by implementing custom lighting
and shading operations.


Teapot with a bump reflect .fx shader

The ShaderAppearance node works only in DirectX mode and the graphics card has to support the shader model,
that is used by the .fx file. You can specify a fallback material, that will be used in case of unsupported hardware.
A few simple examples on how to integrate the ShaderAppearance node can be downloaded here.

appearance ShaderAppearance {
vertexShader VertexShader
    {   #path to the .fx effect file
        url "HLSL/BumpReflectHLSL.fx"
        #textures have to be mapped to parameters of the shader 
        #in this case the parameter normalMap for a bump map and the
        #parameter cubeMap for a reflection map.
        exposedField SFNode normalMap ImageTexture { url „bump.dds" }
        exposedField SFNode cubeMap ImageTexture { url „reflection.dds" }
   }
}

To create .fx effect files, NVidia offers the freeware tool FX-Composer.

The tool can be used to write shadercode, but has also a designer oriented GUI to extend and edit existing shaders.
You can also find additional information and free online books on shader developement on the download page.

VRML Scripting

Script nodes in VRML allow you to add logic to your scene, without having to write a separate application. Possible uses of
VRML script or user interaction or the modification of animation data at runtime. You can use Javascript in an external .js file
or directly inline Javascript with the help of the Script node. A script consists of EventIn attributes (for input), fields (for storing
values in variables) and EvenOut attributes (for output).

The following sample uses a Script node to automatically start a second timer after the first timer (animation) has expired. This might
be useful if you have an idle animation that should be played after an initial animation.

DEF CONVERT Script {
   eventIn  SFBool input  
   eventOut SFBool output
   eventOut SFTime outputTime
   url "javascript:
      function input(value, timestamp) {
        if (!input)
        {        
          output = true;
          #generate a current time stamp
          var currentTime = new Date();        
          outputTime = currentTime.getTime();
         }
      }
   "
}
#the first animation has ended => trigger the script node
ROUTE TimeSource.isActive TO CONVERT.input
#start the idle animation by setting the start time ...
ROUTE CONVERT.outputTime TO TimeSource2.set_startTime
#... and enabling the timer
ROUTE CONVERT.output TO TimeSource2.set_enabled

→Return to content preparation overview

-- SupportMetaio - 2010-02-25