how to register multiple handlers for same ScreenSpaceEventHandler

CesiumJS
1

Hi,

can some one please explain how to register multiple handlers in cesium?

var viewer = new Cesium.Viewer(‘cesiumContainer’);

var handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas);

handler.setInputAction(

function (click) {

console.log(“second”+click);

},

Cesium.ScreenSpaceEventType.LEFT_CLICK

);

handler.setInputAction(

function (click) {

console.log(“first”+click);

},

Cesium.ScreenSpaceEventType.LEFT_CLICK

);

whenever left click event fired , i want to execute both the event handlers.

ref:

http://www.quirksmode.org/js/events_advanced.html

2

Hello,

Is there any reason you can’t use one handler function to accomplish both things you’re trying to do?

Best,

Hannah

3

Hi,

yes , i am using some of the cesium plugins, and i am writing some of the tools. I require that feature for multiple tools or plugins has to work simultaneously.

That features are available in DOM event handling. will that possible in cesium ?

Thank you,

pramod

4

Hi Pramod,

At the moment, the ScreenSpaceEventHandler is designed to only have one function per input action. However, you can create multiple SceenSpaceEventHandlers to handle this:

var handler1 = new Cesium.ScreenSpaceEventHandler(viewer.canvas);
var handler2 = new Cesium.ScreenSpaceEventHandler(viewer.canvas);

handler1.setInputAction(
function (click) {
console.log(“second”+click);
},
Cesium.ScreenSpaceEventType.LEFT_CLICK
);

handler2.setInputAction(
function (click) {
console.log(“first”+click);
},
Cesium.ScreenSpaceEventType.LEFT_CLICK
);

``

Best,

Hannah

1 Like
5

Thank you.

6

As an alternative, depending on your environment, to work around this same issue, I created a custom event emitter and made it so that, the screen space event handler just emitted an event through my shared event emitter. That allowed me to pass it around and use it as many times as I wanted

7

Hi Hannah,

according to the answer below, this code should retain the default behaviour of left-click (selection), no?

var handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);

handler.setInputAction(function(click) {

…

}, Cesium.ScreenSpaceEventType.LEFT_CLICK);

I loosing the selection function when adding an additional handler. What am I missing?

Klaus

8

Hi Klaus,
Each ScreenSpaceEventHandler can have one event of each type, so if you set a new LEFT_CLICK on some event it will override the previous one. If you want multiple LEFT_CLICK events, you can make several new ScreenSpaceEventHandlers.

Here’s Hannah’s example code as a Sandcastle example, so you can easily try it for yourself:

Hope that helps,

  • Rachel
9

Hi Klaus,

My link got formatting strangely, here it is again: http://cesiumjs.org/Cesium/Apps/Sandcastle/?src=Hello%20World.html&label=Showcases&gist=094b9291d0954de2e60c192133d308fc

Best,

  • Rachel
10

how can sumup how much handlers does cesium have at a moment