How to correctly obtain the relative coordinates of a glb model from a mouse click?

Hi folks,
I’m quite new to 3D stuff, and I’m having trouble on how to obtain the correct coordinates from a mouse click on the glb model my coworker gave me. (Here is my code on codesandbox)
The process I’ve done was:

  1. Load the model
  2. Add click event of getting the coordinates of the mouse click
  3. Get the click coordinates from Raycaster.intersect().
  4. Convert the coordinates through intersectionPoint.applyMatrix4(object.matrixWorld)

But the coordinates I obtained in these small areas are the same, respectively. For example:


I obtained the same coordinates when clicking in Area A, and likewise, I obtained the same coordinates when clicking in Area B. The same applies to Area C.(But the coordinates I obtained from Area A/B/C are different).
I thought it was because I selected the wrong object to do the raycasting, but the situation didn’t change after I changed the object from
object = gltf.scene
to
object = gltf.scene.getObjectByName('top_layer_t_fill') // or any other object name

Besides, regardless of the scale issue, the coordinates I obtained are totally different from the ones when the model in the simulation software(e.g HFSS)
Could anyone please give me some help? :melting_face:

Does the situation improve if you add line threshold?

var raycaster = new THREE.Raycaster();
    raycaster.params.Line.threshold = 0; // add this
2 Likes

Hi @PavelBoytchev ,
It seems that adding line threshold improve the situation quite well.
Big thanks for the quick reply and help :star_struck:

1 Like