Hello.
I am new to Three.js and have a question. I tried importing the model from Blender (few meshes exported together). Import it into three.js using THREE.Group(). I would like to be able to hide part of that model with a press of a button, so now I cannot get it to work to hide only one specific part of a model inside a group and outside load() function. I got it to work with Object3D() but that is a longer route as I would need to export each mesh separately from the Blender. So my question is how can I reference part of a model in a Group() outside load() function and hide it?
This is what works with Object3D(). So this is one object exported from Blender:
var torso = new THREE.Object3D();
loader.load('models/character.gltf', function(gltf){
torso = gltf.scene;
torso.name = "torso"
scene.add(torso)
});
torso = scene.getObjectByName(torso.name);
torso.visible = true;
Now I would like to do it but with a group. So I have torso and hair meshes in a group and would like to hide only hair. This is what I tried:
var group = new THREE.Group();
scene.add(group);
var torso, hair1;
loader.load('models/mesh.gltf', (gltf) => {
torso = gltf.scene.getObjectByName('torso');
torso.name = 'tor';
hair1 = gltf.scene.getObjectByName('hair1');
group.add(torso, hair1);
})
torso = scene.group.getObjectByName(torso.name);
torso.visible = true;
Could someone point me in the right direction? Thank you.