Is it possible to get the original DOM event?

I have added an input handler looking for MOUSE_MOVE events. I am getting the events. However, the only information I am receiving is the position of the cursor. I would like to be able to get the original DOM event which trigger the mouse move because I need to check to see if the mouse button is down.

I can use document.body.matches(':active') to test, but this seems like it is overkill when the information is available in the original event.

But, I am not sure how to get to that original event. Is it possible?

I have a sandcastle

I have attached a MOUSE_MOVE input action.

If I am correct, the MOUSE_MOVE input action expects a function that can receive a Cesium.ScreenSpaceEventHandler.MotionEvent. I do not see an event property here and when I try to log an event property, it tells me it is undefined.

Have I missed something? Can you provide a corrected sandcastle?

I am guessing you thought I was referring to Element: mousemove event - Web APIs | MDN, but am not. However, I assume that Cesium is using these Dom events. I just need to be able to get access to the original Dom event. But, I do not see how.


As the sandcastle I provided shows, the event parameter passed in does not contain the original DOM event object.

you need to add event listeners to the gl rendering context for the canvas object which holds the cesium instance, not cesium itself. I have an example of handling mouse dragging that can be found here: webGraphicsEngine/mouseControls.ts at main · shanebenlolo/webGraphicsEngine · GitHub

This example concerns itself with rotating a webgl cube, but the core functionality of checking for if a mouse is dragging should satisfy whatever requirements you’re trying to fulfill. Let me know if you have any questions.

@shane_benlolo, thank you. I think I will stick with document.body.matches(':active') for now.

It seems a bit extreme to go down into the webgl layer for this purpose.

To test this, I tried

handler.setInputAction((event) => {
  console.log( 'mouse move', event );
  console.log( 'mouse move', event.event );
  console.log( 'mouse move', event.originalEvent );

}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);

and the logging of originalEvent is undefined.

Can you provide a sandcastle or some code to demonstrate your solution? What did I do wrong?

Hi @eric-g-97477, if you are wanting to do something with a mouse motion while the button is down, could you use the DRAG events instead? See CameraEventType.

Check this : ScreenSpaceEventHandler - Cesium Documentation

In case of MOUSE_MOVE you’re waiting a Cesium.ScreenSpaceEventHandler.MotionEvent, so arguments are coordinates.

On my app, I can use window.event. But it is due to react (Resium ?) , I think, not cesium .