Adressing "isSelected" in gltf-object after Raycasting

Questions
, , ,
1

Hello

I’m using a raycaster on GLTF-objects.

I had a working project where I used a few standard geometries that could be selected by double clicking:

const object1 = new THREE.Mesh(
    new THREE.BoxGeometry(1.01, 1.01, 1.01),
    new THREE.MeshStandardMaterial({color: colorBase})
)
object1.isSelected = false

const object2 = new THREE.Mesh(
    new THREE.SphereGeometry(0.65, 16, 64),
    new THREE.MeshStandardMaterial({color: colorBase})
)
object2.isSelected = false

Whenever there was interaction with one of the objects through a raycaster, I could easily adress my custom added “isSelected”-property as shown here:

 window.addEventListener("dblclick", (event) =>
 {
     if(currentIntersect && currentIntersect.object.isSelected === false){
         currentIntersect.object.material.color.set(colorSelected)
         currentIntersect.object.isSelected = true
     }
     else if(currentIntersect && currentIntersect.object.isSelected === true){
         currentIntersect.object.material.color.set(colorBase)
         currentIntersect.object.isSelected = false
     }
 })

I try to use the same method with a GLTF-object. First I add the same “isSelected”-property:

loader.load(
    "model.gltf",
    function(gltf){
        model = gltf.scene
        model.isSelected = false
        scene.add(model)    
        }
)

which shows up when I do a console.log(model)

Group
animations: (0)
castShadow: false
children: [Object3D] (1)
frustumCulled: true
id: 25
isSelected: false

But this doesn’t seem to work the same way as with simple geometries.
When passed to the eventListener, object.isSelected cannot be found and returns as undefined.

What I figured out so far, is that a GLTF-object is a group of Object3D’s and Meshes, whereas a simple native geometry only seems to be a mesh that remembers previously added properties.
Does a raycaster “transform” whatever he intersects with into new meshes? If so, how can I add properties to this object?

Thanks!

2

You seem to be assigning isSelected to the gltf.scene, which contains the mesh you are raycasting against, you either need to assign isSelected to the mesh inside your gltf scene in your load function or check intersects[0].object.parent (gltf.scene) for isSelected…

1 Like