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
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"
}
});
});
hmm, weird.. in my react case, screenpoint and {screenX, screenY} from native dom event are different.
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.