Al igual que su ejemplo oficial, podemos usar Raycaster para obtener objetos coincidentes actuales https://threejs.org/docs/?q=Raycaster#api/en/core/Raycaster .

El ejemplo oficial es:

 const raycaster = new THREE.Raycaster(); const pointer = new THREE.Vector2(); function onPointerMove( event ) { // calculate pointer position in normalized device coordinates // (-1 to +1) for both components pointer.x = ( event.clientX / window.innerWidth ) * 2 - 1; pointer.y = - ( event.clientY / window.innerHeight ) * 2 + 1; } function render() { // update the picking ray with the camera and pointer position raycaster.setFromCamera( pointer, camera ); // calculate objects intersecting the picking ray const intersects = raycaster.intersectObjects( scene.children ); for ( let i = 0; i < intersects.length; i ++ ) { intersects[ i ].object.material.color.set( 0xff0000 ); } renderer.render( scene, camera ); } window.addEventListener( 'pointermove', onPointerMove ); window.requestAnimationFrame(render);

Según este ejemplo, según tengo entendido, solo puedo obtener intersects[i].object , que es una instancia de la clase Threejs Mesh .

Quiero vincular la función onClick a object3d de esta manera:

 function createObject(id, position) { // ... const mesh = new Mesh() // ... mesh.onClick = () => handleClickFn(id, position); scene.add(mesh); }

Entonces puedo llamar a intersects[i].object.onClick(); para activarlo.

Todos los ejemplos que encontré parecen hacer alguna operación para intersects[i].object directamente. Al igual que intersects[ i ].object.material.color.set( 0xff0000 ); .

Entonces, ¿hay alguna forma en que pueda vincular funciones a cada objeto de intersects[i].object como este?