Seeking Help: Avatar Not Rotating with Head(HMD) in react-three/xr Emulator

[vimal-hash]

Hi all – I’m learning React Three Fiber + react-three/xr and running into an issue with the built-in emulator:

I have a Man model and I’m using <XROrigin> to place the camera at its head.

In DevTools “Play Mode,” the XR session starts, but looking around with the emulator doesn’t rotate the Man model.

I don’t have a real headset, so I’m relying on the emulator only.

Has anyone gotten their avatar to follow head rotation under the emulator? Any tips or minimal code examples would be a huge help. Thanks!

[bbohlender]

have you looked at this: https://pmndrs.github.io/xr/docs/getting-started/faq#how-can-i-read-the-camera-position-or-rotation-in-xr?

[vimal-hash]

Thanks for the link! I’ve looked into it and managed to log values from camera.getWorldQuaternion() — I can extract yaw, pitch, and roll. Those three values are changing only while camera moving not while rotating. The model doesn't rotate with the headset in the emulator (DevTools Play Mode). Is there something extra I should do to sync the avatar with camera yaw? Appreciate any pointers!

[bbohlender]

if you can log the correct values, it rather seems like problem on your end. If you share the code in a codesandbox or github repo, I can take a look :)

[vimal-hash]

Thanks for offering help!

I've pushed code to repo. https://github.com/vimal-hash/ReactXr-Man

The problem is that although I can read camera yaw/pitch/roll using camera.getWorldQuaternion(), the model does not rotate with the HMD in DevTools "Play Mode" using the emulator.

Additionally there is new issue is coming:

three.module.js:29956 Uncaught TypeError: material.onBuild is not a function

This only appears after entering XR, and not when clicking Play Mode — where everything otherwise runs fine. Appreciate your time and any insights 🙏 Thanks

[vimal-hash]

Hi sir, any suggestions or idea on this?