1
タイトルとしては、より少ないモーフターゲットを持つObject3Dが、より多くのモーフターゲットを持つ別のものによって影響を受けることは非常に奇妙です。Three.js - より少ないモーフターゲットを持つメッシュは、より多くのモーフターゲットを持つメッシュの影響を受けますか?
エラーhereは、4つのモーフターゲットを含む立方体をThree.js公式の例webgl_morphtargetsに追加して複製しました。元の例は8つのモーフターゲットを持つ1つのキューブしか持っていません。
この例では、上の8つの入力バーが灰色のキューブのmorphTargetInfluencesを変更し、下の4つのバーが青いキューブを変更します。 2つのキューブのジオメトリとマテリアルは異なりますが、上位8つの入力バーを調整すると青いキューブに影響します。
一部のmorphTargetsコードが以下に貼り付けられました。これによって数日間悩まされ、それを理解することができませんでした。どんな指導も大変感謝しています。ありがとう!
// first cube
var geometry = new THREE.BoxGeometry(100, 100, 100);
var material = new THREE.MeshLambertMaterial({ color: 0xffffff, morphTargets: true });
// construct 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);
// second cube
var geometry2 = new THREE.BoxGeometry(100, 100, 100);
var material2 = new THREE.MeshLambertMaterial({ color: 0x00ffff, morphTargets: true });
// construct 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);