Three.js Mesh Animation
This mesh-animation demo uses an object of type THREE.MorphAnimation to animate models of a running horse and a flying stork.
The models are in the JSON format used by three.js and are part of the three.js download. Each of the two model files includes a set of "morph targets." A morph target is an alternate set of vertices for the mesh geomety of the model. The morph targets describe the geometry of the model at different points in time. Those points in time are "key frames" for the animation; that is, the geometry for points between the key frames is obtained by interpolating the vertex positions from their values at the key frames. A MorphAnimation is used to apply the interpolation to the mesh object.
The techniques for this demo are based on the sample program webgl_morphtargets_horse.html, which is part of the download of three.js from its web site, threejs.org. You can look at the source code of this demo or of that sample program to see how the animation is programmed.
You can use your mouse to rotate the model, even when it is animating.