topic MapView.toMap doesn't supprort native mouse event in ArcGIS JavaScript Maps SDK Questions

MapView.toMap doesn't supprort native mouse event

YangJin — Fri, 29 Sep 2023 21:56:25 GMT

From the api docs, MapView.toMap support to take screenPoint or MouseEvent (which shows as a DOM mouse event type) and return a map Point. However, when implementing the code, I notice that the MouseEvent must be esri supported event (https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html#events-summary).

In my case, I need to let a div element to catch the right click event and convert the mouse position to be a map point, instead of relying on the mapView.on('click', clickCB). Thus, Im not able to directly get the esri supported event. I wonder Is there any public utils I can use to convert dom mouse event to esri supported event, or directly to screenPoint.

Here is what i found from the code, there is

screenUtils.createScreenPointFromNativeEvent(MapRef.current, event)

to convert dom mouse click to screenPoint, but I dont find it in the esri docs. does anyone know if I can use it in my code?

Re: MapView.toMap doesn't supprort native mouse event

ReneRubalcava — Sat, 30 Sep 2023 19:57:25 GMT

view.toMap supports native mouse events. All it needs are screen x and y coordinates. That's all that a ScreenPoint is.

https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html#ScreenPoint

Here is a demo:

https://codepen.io/odoe/pen/wvRxezP?editors=0010

elem.addEventListener("click", (event) => { const pt = view.toMap(event); view.graphics.add({ geometry: pt, attributes: { name: "My Point" }, popupTemplate: { title: "{name}", content: "This is my mouse event" } }); });

Re: MapView.toMap doesn't supprort native mouse event

YangJin — Sat, 30 Sep 2023 23:45:05 GMT

hmm, weird.. in my react case, screenpoint and {screenX, screenY} from native dom event are different.

Re: MapView.toMap doesn't supprort native mouse event

Martin_B — Tue, 03 Oct 2023 08:35:42 GMT

Are you cleaning up your event listeners after they are used? In React, leaving event listeners without cleaning them up may lead to unexpected behaviour. A new event listener could be added to your component on each re-render.

This article may be of help if you are not already cleaning them up. 😊

If this does not solve the problem, it would help a lot of you could provide some of your code for further debugging.