inputAction on left Mouseclick shows InfoBox - can I prevent?

CesiumJS
1

I have the problem, that I setInputAction on left mouse click.

I would like to do something with the coordinate, but at this moment the show of infobox is a problem.

Can I prevent showing InfoBox on a special setInputAction ?

I don’t find a possibility in the viewer options and my dataset, which is click is a 3dtiles set, for which I also don’t find a switch

Rüdiger

2

This is still a problem - does anyone knows a solution ?

3

Hi @Ruediger_Brand,

Apologies for the delayed response. I put together a Sandcastle that demonstrates how to hide the infobox:

Let me know if you have any other concerns.

Best,
Janine

4

Hi Janine,

this looks great - thank you forthe tip !

Rüdiger

6

Hello,
similar question again - is there any way for the Author/content creator to control which specific objects will have the “InfoBox feature” dis-/enabled?
The example mentioned in the Sandcastle example above seems to cover just dis-/enabling all InfoBoxes in the scene…(?)
Perhaps the showInfo member of InfoBoxViewModel can be somehow of help?

My example user case is:
Scene with several 3D models of individual buildings, each with a descriptive label attached.
Desired goal is to have the labels generate InfoBoxes when clicked, while the models themselves not (make them “not clickable”).
(how to hint the user, what is clickable and what is not, using mouse cursor change to “pointer”, is discussed here).

7

I use an event handler to intercept all left clicks, and pass them to a callback function. The callback then checks if an entity exists at the location that was clicked, and based on the entity id you can take different actions as you like.

// register event handler
viewer.screenSpaceEventHandler.setInputAction(function (movement) {leftClick(movement);},
    Cesium.ScreenSpaceEventType.LEFT_CLICK);

// handles any LEFT-CLICK event in the viewer
function leftClick(movement){

    // handle any object selection
    let object = viewer.scene.pick(movement.position);
    if (Cesium.defined(object) && Cesium.defined(object.id)) {
        let entity = object.id;
        console.log(`Selected object: ${entity.id}`);

        // call async data loader fct
        loadInfobox(entity);

        // show the objects InfoBox
        viewer.selectedEntity = entity;
    }

}

You can just have a conditional based on the entity id to set which objects should show the InfoBox.

8

Thanks!
The simplest and straight solution I have found so far is in this post.