Game Development Reference
In-Depth Information
The model we're using in this example already has materials, so unlike in the
morph animation examples, we have to change the existing materials instead of
creating a new one. For skeletal animation we have to enable skinning , which
refers to how the materials are wrapped around the mesh as it moves. We use the
THREE.AnimationHandler utility to track where we are in the current animation
and a THREE.SkinnedMesh utility to properly handle our model's bones. Then
we use the mesh to create a new THREE.Animation and play it. The animation's
interpolationType determines how the mesh transitions between states. If you
want cubic spline easing (slow then fast then slow), use THREE.AnimationHandler.
CATMULLROM instead of the LINEAR easing.
We also need to update the animation in our physics loop:
THREE.AnimationHandler.update(delta);
It is possible to use both skeletal and morph animations at the same time. In this
case, the best approach is to treat the animation as skeletal and manually update
the mesh's morphTargetInfluences array as demonstrated in examples/webgl_
animation_skinning_morph.html in the Three.js project.
Particle systems
Now that our flags are in place and we've learned how to manage the resources we'll
need to decorate our world, let's add some additional visual effects. The first type of
effect we'll look at is particle systems.
Particles are planes that always face the camera, usually grouped together into a
system to create some effect like fire or steam. They are essential for creating great
visuals like this colorful heart:
Particles from examples/webgl_particles_shapes.html with shapes by zz85
 
Search WWH ::




Custom Search