Re: [cesium-dev] How to get rid of "Green Box" that appears when you pick something?

[Matthew Amato]

Most Viewer functionality is configurable at construction time.  In this case you want to disable the selection indicator.

var viewer = new Cesium.Viewer('cesiumContainer', {

    selectionIndicator : false

});

On Sat, Feb 21, 2015 at 10:57 PM, Sai Asuka <asuka...@gmail.com> wrote:

Whenever I click an entity, a green box appears at the center of what I picked. Is there a way to disable that so the pick event fires, but no green box?

--
You received this message because you are subscribed to the Google Groups "cesium-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to cesium-dev+...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[ow...@minutesmatter.com]

Is there anyway to enable/disable the selectionIndicator after the viewer is constructed? For example, I would like to disable it for certain entity types based what is selected.

Something like...

if (viewer.selectedEntity.entityType == 'label'){
viewer.selectionIndicator.viewModel.isVisible = false
}

Thanks in advance,
OG

[Matthew Amato]

You simple pass `selectionIndicater : false` to the Viewer constructor.  This is true for all of the widgets in the Viewer, a complete list is in the documentation: https://cesiumjs.org/Cesium/Build/Documentation/Viewer.html

[Joshua Pappalardo]

That is not what he asked. He is asking if you can disable picking for certain objects? I too would find it very helpful if only map pins were pickable

[Hannah Pinkos]

As of now, I don't believe it is possible to selectively enable/disable picking for each entity.  We have an issue written up about improving this here: https://github.com/AnalyticalGraphicsInc/cesium/issues/1592

[ow...@minutesmatter.com]

I actually would like to pick an object so that the info box is show but I dont want to see the selectionIndicator. I have include a sandcastle sample where you can see why I dont want to see the selection indicator but still want the infoBox.

To use sample, hold down SHIFT and make a few left clicks. A line should be drawn between the points and the infoBox should display the total surface distance between the points.




var viewer = new Cesium.Viewer('cesiumContainer');

var scene = viewer.scene;
var ellipsoid = scene.globe.ellipsoid;
var handler;

// variables that support distance line
var distPosCarte = [];
var distPosCarto = [];
var surfaceDist = 0;
var distLine = viewer.entities.add({
id : 'distLine',
name : 'Distance Line',
polyline : {
width : 3,
positions : [],
material : new Cesium.PolylineOutlineMaterialProperty({
color : Cesium.Color.ORANGE,
outlineWidth : 2,
outlineColor : Cesium.Color.BLACK
})
}
});

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


handler.setInputAction(function(movement) {
// clear distPos arrays on single click without SHIFT
distPosCarto.length = 0;
distPosCarte.length = 0;
surfaceDist = 0;
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);

handler.setInputAction(function(movement) {
var cartesian = viewer.camera.pickEllipsoid(movement.position, ellipsoid);
if (cartesian) {
distPosCarte.push(cartesian);
var cartographic = ellipsoid.cartesianToCartographic(cartesian);
distPosCarto.push(cartographic);
if(distPosCarte.length >= 2) {
var posArray = [];
// Build array with all points
for (var i = 0; i < distPosCarte.length; i++){
posArray.push(distPosCarte[i]);
}
// Calculate surface distance between each point
for (var j = 1; j < distPosCarto.length; j++){
var geodesic = new Cesium.EllipsoidGeodesic(distPosCarto[j-1], distPosCarto[j]);
surfaceDist += geodesic.surfaceDistance;
}

distLine.polyline.positions = posArray;
distLine.description = ((surfaceDist)/1000).toFixed(2) + ' km';

viewer.selectedEntity = distLine;
}
}
}, Cesium.ScreenSpaceEventType.LEFT_CLICK, Cesium.KeyboardEventModifier.SHIFT);

[Hannah Pinkos]

Okay, Matt's comment above was exactly what you're looking for then.  

var viewer = new Cesium.Viewer('cesiumContainer', {

    selectionIndicator : false

}); 

The SelectionIndicator widget is what makes the green box.  Disabling it will get rid of the green box, but picking and the info box will still work.

Best,

-Hannah

[Owen Green]

Sorry Hannah for the confusion…

I don’t want the selection indicator shown for the distance line ONLY. The selection indicator produces undesirable results when drawing a multi point polyline.

Thanks,

Owen

[Owen Green]

I found viewer.selectionIndicator.viewModel.showSelection but setting it to false doesn’t seem to work. 

https://cesiumjs.org/Cesium/Build/Documentation/SelectionIndicatorViewModel.html?classFilter=selec

showSelection :Boolean

Gets or sets the visibility of the selection indicator.

Source: Widgets/SelectionIndicator/SelectionIndicatorViewModel.js, line 67

On Jul 14, 2015, at 10:33 AM, Owen Green <ow...@minutesmatter.com> wrote:

Sorry Hannah for the confusion…

I don’t want the selection indicator shown for the distance line ONLY. The selection indicator produces undesirable results when drawing a multi point polyline.

<PastedGraphic-2.png>

[Hannah Pinkos]

No problem, Owen.  Sorry for not understanding.

showSelection is being overridden by the Viewer every frame, so that's why setting it false from the code isn't working.

Right now, there's no way to turn the selection indicator on and off based on entity type.  To get the behavior you want, you'll have to make some changes to the Viewer code.  [Here] you can find the code that's responsible for displaying the selection indicator.

The Contributor's Guide on GitHub wiki has instructions for downloading and building the code.

-Hannah

[ow...@minutesmatter.com]

Joshua,

We add an 'entityType' property to any entities we add to the viewer and then you can unselect a certain type if needed. I am sure there is a better way but it seems to work.

var theEntity = viewer.entities.add('someEntity');
theEntity.addProperty('entityType');
theEntity.entityType = 'label';

viewer.clock.onTick.addEventListener(function() {

// Do not select Labels
if(viewer.selectedEntity && viewer.selectedEntity.entityType == "label"){
viewer.selectedEntity = undefined;
}
});

[Scott Haynes]

I have the same issue.  The selectionIndicator is a really nice feature, but I have an some different modes where I would like to disable this feature.  Could the SelectionIndicator object just support an 'enable' property?  

Scott

[gedem...@gmail.com]

I needed something similar: showing InfoBox only for polygons, while there are KML ground overlays at the same place. I've managed to do this by modifying the Scene object's pick method: (cv is the Cesium.Viewer object)

//
// CESIUM HACK - pick polygons only
//

// store original pick
cv.scene.oldPick=cv.scene.pick;
// new pick function
cv.scene.pick=function(e) {
var notToPick=[]; // stack for non-polygons
// use the original pick until a polygon is found or there areno more pickables.
// If the object is not a polygon, hide the primitive from picking
while (typeof (o=cv.scene.oldPick(e))=='object' && !o.id.polygon) {
o.primitive.show=false;
notToPick.push(o.primitive);
}
// reset 'show' attribute of non-picked primitives
while (notToPick.length>0)
notToPick.pop().show=true;
// if the last object was a polygon, return it, otherwise nothing
if (typeof o=='object' && o.id.polygon)
return o;
else
return;
}

best,
Mátyás

[ben.ge...@gmail.com]

Hi Owen,

I ran into a similar issue and was able to solve it by doing the following...


var leftClickHandler = new Cesium.ScreenSpaceEventHandler(cesiumViewer.scene.canvas);

leftClickHandler.setInputAction(function(action) {
//reset visibility of selectionIndicator and infoBox
cesiumViewer.selectionIndicator.viewModel.selectionIndicatorElement.style.visibility = 'visible';
document.getElementsByClassName('cesium-infoBox')[0].style.visibility = "visible";

var pickedObject = cesiumViewer.scene.pick(action.position);
//don't do anything if we didn't click on an object
if (!Cesium.defined(pickedObject)) { return; }

//don't do anything if it's not the entity we care about
if(entity !== pickedObject.id){ return; }

//if this is the entity we care about, hide the selectionIndicator and infoBox
cesiumViewer.selectionIndicator.viewModel.selectionIndicatorElement.style.visibility = 'hidden';
document.getElementsByClassName('cesium-infoBox')[0].style.visibility = "hidden";
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);

Hopefully that helps.

- Ben

On Tuesday, July 14, 2015 at 11:32:48 AM UTC-4, Owen Green wrote:
> Sorry Hannah for the confusion…
>
>
> I don’t want the selection indicator shown for the distance line ONLY. The selection indicator produces undesirable results when drawing a multi point polyline.
>
>
>
>
>