jQuery mouse events on Cesium widget not working in IE

CesiumJS
1

Hi,

The following way to attach event handlers (using jQuery) is not working in IE:

$(’#cesiumContainer’).on(‘mousedown’, function() {alert(‘mousedown’)});

$(’#cesiumContainer’).mousedown(function() {alert(‘mousedown’)});

However, a native DOM implementation do work:

$(’#cesiumContainer’).addEventListener(‘mousedown’, function() {alert(‘mousedown’)});

I do not think this is caused by a stopPropagation() call as this would also impact the addEventListener.

Perhaps the event.target is nullified somewhere in the callback chain.

Any idea, pointer?

Thanks,

Xavier.

2

Hi Xavier,

This is a really strange problem. For IE, we use pointer events instead of mouse events because they’re better supported.

But it looks like us registering ‘pointerdown’ somehow breaks jquery’s ‘mousedown’? I looked into it a little bit, but I have no idea why that is happening.

So, there are a few workarounds.

You can check Cesium.FeatureDetection.supportsPointerEvents() and use on(‘pointerdown’, …) when that returns true

Or, we also have a ScreenSpaceEventHandler class for mouse event handling. You could use that to avoid any other conflicts.

You can look at our picking demo for an example of how to use the ScreenSpaceEventHandler: http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=Picking.html&label=Showcases

Best,

Hannah

3

Hi Hannah,

following up on this mouse events issue:

  • I was wrong: using native DOM addEventListener does not work in IE. It is not just jQuery.

  • falling back on pointerdown is not an option for me as it prevent the natural mousemove behavior (impossible to implement drag behavior)

  • as far as I could see, ScreenSpaceEventHandler are only meant to handle clicks on the globe, not on the whole widget.

My conclusion is:

  • I did a quick search/replace for “pointerdown” (replaced with “bla”) in the un-minimized Cesium source and my mouse event handlers started working.

  • something, somewhere in Cesium code, stops the propagation of the mouse event back to the container element - for IE only.

… and this is quite a problem.

Regards,

Xavier.