Use case is there is a mesh (ex:- room built with Blender and has different parts with names like Door, window, floor etc…). Mesh is loaded via gltf to the scene. User can select these mesh parts (door, window etc…) and change the texture from a given list.
What is working now in my code is;
Raycast on mouseover and capture the mesh under the mouse cursor (door, window etc…)
Apply the selected texture to the selected part
So raycasting & selecting code goes like below;
let intersects = this.raycaster.intersectObjects( this.customizableList ); // where customizable list has the meshes that can be selected for customization
let selectedMesh = intersects[ 0 ].object; //selectedMesh.name confirms that it has the expected object to customize.
selectedMesh .material.emissive.setHex( 0xff0000 ); //just highlight the selected mesh only.
What’s NOT working as expected is; it highlights some other mesh parts also! For example if selectedMesh is just the door, it highlights some unrelated mesh parts even if it’s NOT connected to selectedMesh!
So, to troubleshoot, without doing raycasting, I tried below code;
In above line window.content has the full scene details loaded from gltf. so now I specifically get the reference for “c-image-posters-1” mesh and resulting variable get the correct mesh. But changing it’s emmisive color still highlights some other unrelated meshes! Btw… names given to each mesh parts are unque!