Morph Targets Three.js

Question

I'm trying to get started with morph targets and three.js. However, there doesn't seem to be much documentation on this subject.

As I'm looking at the source code, morphTargetInfluences[] seems to be the magic.

How does this work? How do I use this? Is a value of 1 full strength? How can I differentiate between different morph targets on the same model?

I'm just trying to understand morphTargetInfluences[]

Thanks in advance

Answer 1

http://threejs.org/examples/webgl_morphtargets.html

Morph targets are sets of geometry vertices positions for automatic interpolation between them. You can change geometry appearance in real time, using different vertices positions written in morphTargetInfluences[0], morphTargetInfluences[1], morphTargetInfluences[nSet]. You can mix many appearances (morphTargetInfluences) of geometry at the same time. Best way is JSONLoader format, wchich you can export from 3DSMax for example: frame0 as morphTargetInfluences[0], frame1 as morphTargetInfluences[1], ect.

The original geometry vertices are untouched, which you can check using geometry.computeBoundingBox(); geometry.boundingBox();

Answer 2

I would be cautious about pursuing this approach. It seems to be based on an incomplete understanding of the technology.

1. The value of Morph Targets is not that you can animate by swapping out individual vertices, but that you can use an alternative shape (same mesh with same vertices, but each can be in a new location) as a deformation target for your model. (eg: Neutral Face and Smile Face)

2. The morphTargetInfluence contains NO vertices. It is an array of scalar values that represent the weight assigned to each target during the morph. In the Face example above, [0.3] might result is a timid Mona Lisa-like smile, while [0.9] would be a robust grin.