Three.js 为骨骼创建网格

Question

我的目标是将单独的对象（例如：可穿戴物品）附加到动画模型，以便绑定对象由模型动画控制。

我找到了这些，但似乎都过时了。

Three.js attaching object to bone
https://github.com/mrdoob/three.js/issues/3187

我正在试验从 blender 导入的角色，该角色已蒙皮、装配和动画化。

我的问题是：当我向模型的特定骨骼（代码中注释掉的部分）添加新网格时，当前动画片段切换到第一个（t-pose），并且蒙皮破损（模型变白）。然而，对象连接到骨骼，并随之移动。

const {scene, animations} = await Utils.loadModel('model/someName.gltf');
const model = scene.children[0];

const material = new THREE.MeshBasicMaterial();
material.alphaTest = 0.5;
material.skinning = true;

model.traverse((child) => {     
    if (child.material) {
        material.map = child.material.map;
        child.material = material;
        child.material.needsUpdate = true;
    }
    if (child.isBone && child.name === 'RightHand') {
        // child.add(createMesh());
    }
});

gScene.add(model);

它不能正常工作，即使添加了一个简单的立方体，但如果我可以为角色添加靴子，那就更好了，那就是它的脚移动。

Answer 1

看来我找到了解决办法。

我更新了演示（这只是一个 PoC）https://github.com/tomo0613/3d-animated-char-test

首先（在搅拌机中）：

为应该随角色移动的鞋子添加骨骼。（我想这些应该有相同的骨骼[位置、旋转、大小]；演示中存在差异）

然后是JS代码：

将鞋子（整个网格）作为子网格添加到腿骨。
在每次渲染之前，将角色骨骼属性复制到鞋骨属性[位置和四元数]

我仍然很好奇，是否有任何预期/或更好的方法来做到这一点？

Three.js 为骨骼创建网格

Three.js parenting mesh to bone

three.js

skeletal-mesh