Detect click on mesh in WebXr initialised using WebXRExperienceHelper

Questions
1 
const xrHelper = await BABYLON.WebXRExperienceHelper.CreateAsync(scene);

var dict_pass = { requiredFeatures: [ 'hit-test' ],
optionalFeatures: ["dom-overlay"],
domOverlay: {
root: document.getElementById("ar")
}
}


const sessionManager =  xrHelper.enterXRAsync("immersive-ar", "local-floor",undefined,dict_pass);

I tried , scene.onPointerDown and actionManager but its not working

2

pinging @RaananW

3

Hi @Ankit_Yadav,

A few things -
The dom-overlay module is very experimental, I am not really sure how many UAs actually support it. I have to admit thou that I haven’t tested, so it is very possible that chrome canary for android supports it well
I don’t see the mesh in your example, so it is very hard to say why you can’t interact with it. you should be able to click it if it is in front of you. If you do manage to see the overlay, it is not babylon that will click in it, but the US itself, meaning - you will need to take care of click events in the overlay itself and not in babylon.

If you want to share an example, please do, I will be able to test and answer better.

4

And alternate of dom-overlay , want to make ui button in immersive-ar , I tried CreateSimpleButton (https://www.babylonjs-playground.com/#XCPP9Y#3651) but its not working

5

Well, you were the one who submitted this - Cant interact with GUI.Button.CreateSimpleButton in WebXr immersive-ar mode. · Issue #8879 · BabylonJS/Babylon.js · GitHub .

You can create GUI element that are not full-screen, they will work for sure (attach them to an overlay that is following the camera, for example). The only issue is when using Full Screen UI, which is an overlay above the pointer clicks, and this is why it doesn’t work.

When I find the time to investigate and solve the issue I will take care of that. Probably not until next week (and I apologize for that). You can track the github issue to know when a fix is ready.

1 Like
6

@RaananW after adding these lines , scene.onPointerDown is working fine with dom-overlay enabled .

 xrHelper.input =  new BABYLON.WebXRInput(xrHelper.sessionManager, xrHelper.camera, {
      controllerOptions: {
          renderingGroupId: 0,
  }})

  xrHelper.pointerSelection = xrHelper.featuresManager.enableFeature(BABYLON.WebXRControllerPointerSelection.Name,  "stable", {
    xrInput: xrHelper.input,
    renderingGroupId: 0,
});
1 Like