Issue with Points animation with morphTargets


I am trying to animate both Mesh object and a Points object using morph target, very similar to this:

Note that I have a separate AnimationMixer for each.

The model is built from a JSON file which contains all of the vertices for both of the objects in a single array, and another array which contains the indices of the vertices which will make up the points object. Morph targets also contain vertices for both objects. To animate, I use those same indices to find the appropriate vertices, and use those values to create new morphTargets and AnimationClips for the Points object. Since Points does not have a updateMorphTargets function, I then copy the morphTargetDictionary from the Mesh and create a new morphTargetInfluences for the Points.

The models both appear as expected before animation begins, but as soon as the animation starts all of the points in the Points object appear at the (0,0,0) position. The values in the geometry remain the same.

Can anyone explain what may be happening? Am I using Three.Points or AnimationMixer in the wrong way?

Here is a JSFiddle that shows the issue. Click on the display to start the animation:

The points should be moving with the box, but instead move to the origin point (0,0,0).

three.js internally converts Geometry to BufferGeometry. For objects of type Points, the conversion process does not regard morph target data. Only for objects of type Mesh. That’s the reason why your points are not animated. It’s like no morph targets are defined.

Since Geometry is going to be deprecated, the solution is to use BufferGeometry like in the following fiddle:

1 Like