javascript - Three.js 将对象附加到骨骼

Question

有没有办法将网格附加到骨骼上？例如，我加载动画 .js 角色，我想将武器附加到它的手上。

Answer 1

在 Bone 和 Object3D 原型上使用一些简单的 hack 是可能的。由于骨骼继承自 Object3D，它们可能有子节点，因此我们可以轻松地将网格 .add() 添加到任何骨骼。

但是，SkinnedMesh 只会对非骨骼子对象调用 updateMatrixWorld()，而对骨骼子对象调用 update()。此外，骨骼为它的每个孩子调用 update() （不管它是否是骨骼）。以下代码片段改变了这种行为：

// modify bone update function to also update its world matrix
// possibly do this only to skeletons you need it for, not for all bones
var update = THREE.Bone.prototype.update;
THREE.Bone.prototype.update = function(parentSkinMatrix, forceUpdate) {
    update.call(this, parentSkinMatrix, forceUpdate);
    this.updateMatrixWorld( true );
};

// add noop update function to Object3D prototype
// so any Object3D may be a child of a Bone
THREE.Object3D.prototype.update = function() {};

// create buffalo ...

// create a mesh and add it to some bone
var mesh = new THREE.Mesh( new THREE.SphereGeometry(20), new THREE.MeshNormalMaterial() );

var bone = buffalo.bones[5];
bone.add(mesh);

Answer 2

Three.js 版本 68 开箱即用地处理了这个问题，但有点不同。无需更改内部功能。

它现在是这样工作的：

现在可以在 SkinnedMesh 的子项中找到骨骼层次结构。

在子列表中找到骨骼并将对象附加到它：

player.children[0].add(testObj);

注意：如果您有一个骨骼层次结构（例如在您导出的搅拌机模型中），那么它也可以在 three.js 中表示。如果您的目标骨骼有一个父骨骼，它将如下所示：

player.children[0].children[1].add(testObj);