I’m trying to place a basic rigged model of a human in my scene. I can do it by just adding the entire contents of gltf.scene
but that doesn’t exactly do what I want. What I’m trying to do is to retrieve the SkinnedMesh and create a SkeletonHelper to add with it to the scene.
From the hierarchy, I’ve deduced that the SkinnedMesh is located at gltf.scene.children[0].children[3]
and then its skeleton and geometry are simply .skeleton
and geometry
I’ve tried adding that SkinnedMesh directly to the scene and I’ve also tried using its geometry to create a new SkinnedMesh, binding that to the skeleton and then adding that to the scene but neither has resulted in anything showing up
Here is the relevant code (mesh, skeleton, geometry and skeletonHelper are global)
const loader = new THREE.GLTFLoader();
loader.load(
'./assets/models/male.glb',
function( gltf ) {
console.log(gltf)
mesh = gltf.scene.children[0].children[3]
skeleton = mesh.skeleton
geometry = mesh.geometry
var material = new THREE.MeshPhongMaterial( {
skinning : true,
color: 0x156289,
emissive: 0x072534,
side: THREE.DoubleSide,
flatShading: true,
vertexColors: true
} );
var lineMaterial = new THREE.MeshBasicMaterial({
skinning : true,
wireframe: true
});
var new_mesh = new THREE.SkinnedMesh(geometry, [material, lineMaterial])
new_mesh.bind(skeleton)
skeletonHelper = new THREE.SkeletonHelper(new_mesh);
skeletonHelper.material.linewidth = 5;
scene.add(skeletonHelper);
scene.add(new_mesh)
},
function( xhr ) {
console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
},
function( err ) {
console.error( 'An error happened' );
});
}
Any help or advice would be greatly appreciated.