XR Experience Helper and camera & controller positions


I am trying to switch to XR from VR. Could someone give me pointers to materials with examples how to read camera and controller positions? I could not find anything with fast googling.

Kind regards,

Everything can be found at the docs - The WebXR Camera - Babylon.js Documentation and Introduction to WebXR - Babylon.js Documentation . Pages are new, google probably doesn’t like them yet.

Thanks, super!



Is there some way to check which XRSessionModes the browser supports?

Kind regards,

Figured that at least something like this works:

const xr = (navigator as any).xr;
    if (await xr.isSessionSupported('immersive-vr')) {
      const sessionManager = await this.xrHelper.enterXRAsync('immersive-vr', "local-floor" /*, optionalRenderTarget */ );

Our WebXRSessionManager class had the same static function so you can avoid the any hack. But it does the same :blush:

Another question:

How can I ger reference to input used in below example when using WebXRExperienceHelper.CreateAsync:

const featuresManager = xr.baseExperience.featuresManager; // or any other way to get a features manager
featuresManager.enableFeature(WebXRFeatureName.TELEPORTATION, 'stable' /* or latest */ , {
    xrInput: xr.input,
    // add options here
    floorMeshes: [ground, secondFloor, thirdFloor],


You will need to create it yourself:

const xrInput = new WebXRInput(helper.sessionManager, helper.camera, {/*options/*});

Sweet thanks!

Is there better way to read controller position and orientation than this:

const position = (this.leftMotionController.rootMesh!!.parent!! as Mesh).position;
const quaternion = (this.leftMotionController.rootMesh!!.parent!! as Mesh).rotationQuaternion!!;

I ask this first here and if needed will open another topic.

When using either XR helper approach the initialization of VR fails randomly on Oculus Quest / Oculus Browser & WebXRPolyfill. When it fails I just see the dual view screen hovering on lower left quadrant of my view through Oculus.

The overall quality and performance seems to be better with Oculus Quest when using XR than VR.

However when I enable pointer selection and teleportation I get 100 CPU usage when I enter VR (both firefox on macos with xr polyfil and oculus browser on oculus quest with xr polyfil. The pointer selection seems to work but teleportation does nothing for some reason and experience is very laggy due to high CPU load.

— Update

Latest 4.2.0-alpha.9 solves the performance problem. For some reason the teleportation does not work and I am still facing the random initialization problem.

– Update

The BabylonJS webxr teleportation example works with my oculus quest. I wonder if some fixes has been done related to teleportation since latest alpha release.

The randomly failing VR init with quest actually happens only first time I enter VR scene. If I exit and re-enter then it works and this is systematic behavior. The example work in this regard without problem.

Thank you,

Hi Tommi,

I guess a new topic would have been more helpful for future searchers, but this is fine.

No major changes were made to the teleportation since 4.1 was released. I am going to work on it soon (when I get the chance) and fix the issue with the touch controllers (they sometimes don’t register the “touched” correctly).

The oculus browser (and the quest) support WebXR natively, and I never tried with the WebXRPolyfill so I can’t comment on that. The experience should be somewhat the same (thou i would guess that the constant generation of webxr frames would be a bit CPU costly).

What DID happen in regards to the pointer delection is that the scene’s onPointerPredicate is kicking in if defined. The pointer move event is triggered once a frame (if you use the pointer selection), twice. so it can be a CPU hog if your scene has a lot of elements.

Regarding this question:

Yes, there is :slight_smile: the pointer element on each xrInputSource is a direct copy of its position from XR. Notice that there are two reference spaces - the pointer and the grip. In your case, you will want to check the grip, and this is the parent of the motion controller.

Thanks Raanan, need to dig deeper tomorrow on the remaining issues.


For some reason both of my problems the initilization and teleportation not working seem to be solved when I serve the website over HTTPS. When I run the site locally over HTTP these problems appear. When I run the website in cloud over https both of them disappear. I tried also running the production build locally but I still had the same problems so I suppose it is somehow related to serving content over HTTPS. Any thoughts? I need to setup a proxy or something to work around this issue. I did not observe this happening with VR so its likely something related to XR.

Kind regards,

Oh, there is a very simple explanation to that.

XR is not available when not served over https. navigator.xt is simply not there when you use http.


Would be cool to get some clear error about that. Can save the next guy some time as the system seems to work somewhat (at least when using polyfil) but fails for some functionalities. Can be hard to figure out even if you have heard that https is not supported for XR.


IsSessionSupported will return false if you check. I agree that it is not an optimal implementation, but this is a restriction imposed by the browser.

We can’t know why navigator.xr is not available. It can happen due to many reasons. All are usually not entirely in our hands.


In my case it actually returned true and the session was started on the second try correctly. This is probably due to polyfil trying to run the session over VR which was partially working. I am thinkin if you could just check if page was loaded over https and give visual cue like: “XR not supported over HTTP” or something. Of course this is primarly polyfil problem then but as long as most of the browsers are supporting XR all sites and developers will be running polyfil.


This is something we cannot control. Babylon serves more than just browsers (see babylon native), is used in headless local browsers, and in general doesn’t know what server, browser, or environment you are using. If IsSessionSupported returns true, you as a developer need to know what to do with it.

I would expect the browser to throw an exception if the xr object is being accesses not over https. And I would also expect the WebXR polyfill to not work.

Nod, it could be good to mention in something like troubleshooting XR if there is such section in the documentation.


1 Like