I am utilizing reactjs for a website and within it I have some components that utilize babylonjs. I am seeing an issue where the mouse events are not being recognized on 3d buttons, but works fine with 2d buttons.
I am quite new to babylonjs and any/all feedback is most welcome!
Issue URL: Tyler Kokoszka | Profile
Github URL: GitHub - impurity-dev/professional-website
can you make sure the canvas is not covered by another control? can you point on your repo where is the code related to the issue?
This is the component seen in the original website link: professional-website/Stars.tsx at master · impurity-dev/professional-website · GitHub
From the best of my knowledge it is not being blocked by other components. Even when I make the canvas the full screen with nothing else on the page, it still does not work.
Do you mind reproducing your scene in the playground? I would like to get React out of the way
So the code in the playground works: https://playground.babylonjs.com/#2W65U0#1, which leads me to think there is something wrong with the workflow whilst using react?
So I was just testing some stuff and adding
made the 3d clicks work in my project. I’m not sure why, but I’m wondering if this thread should be closed as it may not be a bug in the framework, more user error?
@Deltakosh , so including the inspector just for 3d animations was undesirable since it bloated the bundle significantly. I decided to do some more investigating of this issue and discovered the exact import that will allow the 3d animation is
import '@babylonjs/core/XR/features/WebXRControllerTeleportation' which does not seem correct. You can get this also through
import '@babylonjs/core/Helpers/sceneHelpers' but this also seems a bit odd. Any ideas?
You need to get the sceneComponent that handles the input so helpers should be fine