Listening to XR touchpad or thumbstick motion controller events

I’m using XRControllerModelFactory to detect the “selectstart” motion controller event in my WebXR app.
However I’m not finding how to access other events such as thumbstick or touchpad.
Where are these found?

More detailed controller information are currently not accessible. State information of the thumbstick or touchpad are stored in gamepad property of an XRInputSource. An input source is currently a hidden property which can’t be accessed over the respective instance of WebXRController. However, it is of course technically possible to expose it in some way.

@mrdoob Do you already have something in mind for exposing inputSource.gamepad? Right now, an instance of WebXRController receives its inputSource in the updated method called by WebXRManager. Meaning the controller has no permanent reference to its input source. That makes it a bit more complicate to provide access to it…

Related standard:

1 Like

I had the same question some time ago and found an answer on three.js Github, but I can’t find the issue again.

It’s clumsy but better than nothing :

const controller = renderer.xr.getController(0);

controller.addEventListener( 'connected', (e) => {

	controller.gamepad =


Nice! I did not though to access the input source over the connected event listener. Indeed better than nothing :+1:.


In my opinion gamepad should be found in controller.gamepad without this, as accessing buttons and thumb-stick is pretty useful for rich experiences.

1 Like

Definitely. However, it’s a bit complicated to use a property for this use case since getting the gamepad only works when an input source is available. Could be confusing if you don’t know when the property is set and usable…


I found this and it absolutely works and works well.

1 Like

Is this the library you are looking for ? Look at the Readme for more details on how to use the gamepads :slight_smile: