nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

ArcGIS JavaScript API 4.30 using Gamepad

MarcoGianaLXRP

Hi, has anyone successfully used a gamepad with ArcGIS JavaScript API 4.30?
From what I have read I understand the following,

https://developers.arcgis.com/javascript/latest/api-reference/esri-views-navigation-gamepad-GamepadSettings.html

I am using Edge and Chrome on Windows 10.

* Gamepad for navigation is activated by default.
* When a gamepad is connected it should pick it up automatically and the mapping done for navigation

I have connected a gamepad and tested using the Tester in this page
https://developers.arcgis.com/javascript/latest/api-reference/esri-views-input-gamepad-GamepadInputDevice.html

and all is working fine.

After the the gamepad has connected I check the
view.navigation.gamepad.device which is null according to this
https://developers.arcgis.com/javascript/latest/api-reference/esri-views-navigation-gamepad-GamepadSettings.html#device
"if unspecified then all connected gamepads will be able to navigate." so should be good.
But nothing is happening on my SceneView.

So I check view.input.gamepad.devices but this has no devices in it.

So I explicitly set view.navigation.gamepad.device to a device, but still view.input.gamepad.devices has not devices. I am assuming a device her has to be set for gamepad to interact with the SceneView.

Any example I have come across is old such as from 2018 and requires the developer to set gamepad mappings to the SceneView commands, but I thought this was all handled out of the box now.

Any information, examples would be much appreciated.

Regards
Marco Giana

Trouver plus de publications taguées avec

Accepted answers

MarcoGianaLXRP

Hi, I contacted ESRI Australia support and they just confirmed what the document states that only certain devices are supported
https://developers.arcgis.com/javascript/latest/api-reference/esri-views-input-gamepad-GamepadInputDevice.html

which fine but does not explain why. I went into browser debug mode and discovered that for a gamepad to connect it seeks the mapping property of the gamepad object to be set to "standard"
https://developer.mozilla.org/en-US/docs/Web/API/Gamepad/mapping
On closer investigation my controller input is actually not mapped to the :"standard" as per
https://w3c.github.io/gamepad/#dom-gamepad-mapping

I am good with that, I just need to figure out how to adjust the mapping so the browser recognise it as "standard"

Regards

Marco Giana

All comments

MarcoGianaLXRP

Hi @Noah-Sager thank you for the information.
Given what you mentioned I assume that using an ArcGIS Online SceneView should be able to pick up the gamepad as it uses ArcGIS JavaScript API 4.30 I tried the following Scene
https://www.arcgis.com/home/webscene/viewer.html?layers=71a855fc39fb4ac7ad063f174dc1399e

but unfortunately it still doesn't work.
I have attached an animation to demonstrate that the controller is recognised by the browser via the tester.

GamepadtestArcGIS.gif

Noah Sager

Hi @MarcoGianaLXRP, thanks for posting your question here. I have collected some information that will (hopefully) be useful.

The ArcGIS Maps SDK for JavaScript ignores gamepad events if the app is hosted in an insecure context (e.g. via "http")

Gamepads may not work as expected if using an online app sharing site like CodePen. This is because apps are hosted in an iFrame with additional security.

A browser may need to be restarted if a new gamepad is connected to the computer.

Due to new anti-fingerprinting provisions, gamepads are only discoverable after they are used (e.g. button pressed or joystick moved).

Gamepad interaction is enabled by default in both MapView and SceneView. No coding is required to "fly" in 2D or 3D provided your app is hosted in a secure context.

If more than one gamepad is connected to your computer then all gamepads are recognized and can be used to navigate. If more than one gamepad is connected to your computer, but you want a specific device to be used for navigation, then we recommend utilizing the view.input.gamepad.devices collection. This collection can be monitored for changes as gamepads are recognized by the browser. For example, if my computer has two gamepads connected, one standard and one spaceMouse gamepad, but I only want the spaceMouse to be used for navigation, then I can use the following snippet:

const { devices } = view.input.gamepad;
devices.on("change", () => {
const spaceMouse = devices.find(({ deviceType }) => deviceType === "spacemouse");

// Assign the spacemouse (if any)
view.navigation.gamepad.device = spaceMouse;

// Only enable gamepad navigation if a spacemouse is found.
view.navigation.gamepad.enabled = !!spaceMouse;
});

Hope this helps!

Rejoindre la conversation

Les membres connectés peuvent publier, suivre les mises à jour, et plus encore. Nouveau ici ? Inscrivez-vous gratuitement.

Liens rapides

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.