question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Raycaster does not detect click on GltfModel

See original GitHub issue

Great library!

When I use Raycaster it does not detect clicks on loaded Gltf-Models. When I activate the option intersectRecursive and then console log the click event, the intersectObjects list only contains meshes with a direct parent of scene and no loaded models. Is there a hidden attribute that has to be set in the Gltf-Model loading process?

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:12 (6 by maintainers)

github_iconTop GitHub Comments

5reactions
klevroncommented, Jun 7, 2021

Hi, sorry, will handle this tomorrow

4reactions
klevroncommented, Jun 8, 2021

This should work with 0.3.2, you can use :

<Renderer :pointer="{ intersectRecursive: true }">
  <Camera :position="{ z: 1 }" />
  <Scene>
    <GltfModel @click="onClick" src="..." />
  </Scene>
</Renderer>

Or :

<Renderer>
  <Camera :position="{ z: 1 }" />
  <Scene>
    <Raycaster intersect-recursive @click="onClick" />
    <GltfModel src="..." />
  </Scene>
</Renderer>
Read more comments on GitHub >

github_iconTop Results From Across the Web

Three js raycaster not working for gltf model - Stack Overflow
I add a gltf format model to scene, and it shows. when i try to get intersects by raycaster.intersectObjects( scene.children ). its not...
Read more >
Clicking on gltf models - Questions - three.js forum
I want click on a model and it will zoom in and other model will hide but it not work. How do I...
Read more >
Raycaster doesn't detect intersection with .gltf object-three.js
Coding example for the question Raycaster doesn't detect intersection with .gltf ... Three.js detect click on an object with Raycaster don't work ...
Read more >
Raycaster Mouse Picking - Three.js Tutorials
This is a basic example of using the Raycaster to mouse pick objects in the scene. ... are deliberately excluded from this so...
Read more >
cursor - A-Frame
The cursor component provides hover and click states for interaction on top of the raycaster component. The cursor component can be used for...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found