It's quite strange that an Object3D with fewer morph targets can be influenced by another one with more morph targets.
To demonstrate this issue, I replicated the error here by introducing a cube with 4 morph targets into the Three.js official example webgl_morphtargets. The original example featured only one cube with 8 morph targets.
In the updated example, adjusting the values in the top 8 input bars affects the morphTargetInfluences of the gray cube, while changing the bottom 4 bars influences the blue cube. Despite having different geometries and materials, tweaking the top 8 input bars still impacts the blue cube.
The snippet of code related to morphTargets is displayed below. I've been struggling with this issue for some time now and haven't been able to solve it. Any guidance on this matter would be greatly appreciated. Thank you!
// creating the first cube
var geometry = new THREE.BoxGeometry(100, 100, 100);
var material = new THREE.MeshLambertMaterial({color: 0xffffff, morphTargets: true});
// generating 8 blend shapes
for (var i = 0; i < geometry.vertices.length; i++) {
var vertices = [];
for (var v = 0; v < geometry.vertices.length; v++) {
vertices.push(geometry.vertices[v].clone());
if (v === i) {
vertices[vertices.length - 1].x *= 2;
vertices[vertices.length - 1].y *= 2;
vertices[vertices.length - 1].z *= 2;
}
}
geometry.morphTargets.push({name: "target" + i, vertices: vertices});
}
mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);
// creating the second cube
var geometry2 = new THREE.BoxGeometry(100, 100, 100);
var material2 = new THREE.MeshLambertMaterial({color: 0x00ffff, morphTargets: true});
// generating 4 blend shapes
for (var i = 0; i < geometry2.vertices.length/2; i++) {
var vertices = [];
for (var v = 0; v < geometry2.vertices.length; v++) {
vertices.push(geometry2.vertices[v].clone());
if (v === i) {
vertices[vertices.length - 1].x *= 2;
vertices[vertices.length - 1].y *= 2;
vertices[vertices.length - 1].z *= 2;
}
}
geometry2.morphTargets.push({name: "target" + i, vertices: vertices});
}
geometry2.computeMorphNormals();
mesh2 = new THREE.Mesh(geometry2, material2);
mesh2.position.x = 200;
scene.add(mesh2);