Show/Hide entities using Cesium.CallbackProperty

CesiumJS
1

I’m trying to show/hide entities using Cesium.CallbackProperty . My code is below:

viewer.entities.add({
      id,
      position: position,
      image: image,
      verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
      width: size,
      height: size,
      pixelOffset: Cesium.Cartesian2.fromElements(0, 0),
      heightReference: Cesium.HeightReference.NONE,
      eyeOffset: new Cesium.Cartesian3(0.0, 0.0, -1.0),
      show: new Cesium.CallbackProperty(toggleCallback, true),
    })

The callback code is just simple for a test:

function toggleCallback() {
    return false
  }

Now, whether I return true or false, the entity still shows.

Is Cesium.CallbackProperty perhaps not available on the show property?

What is a strategy for doing this? I imagine it’s quite a common use-case. I’m trying to hide/show an entity based on the position of the timeline.

2

Welcome to the Cesium Community!

There are actually two ways you can indicate an entity’s visibility: one in the outer entity element itself and one in the entity type. For example:

var greenCylinder = viewer.entities.add({
  name: "Green cylinder with black outline",
  position: Cesium.Cartesian3.fromDegrees(-100.0, 40.0, 200000.0),
  cylinder: {
    length: 400000.0,
    topRadius: 200000.0,
    bottomRadius: 200000.0,
    material: Cesium.Color.GREEN.withAlpha(0.5),
    outline: true,
    outlineColor: Cesium.Color.DARK_GREEN,
    show: true, // SHOW CAN BE PLACED INSIDE THE CYLINDER 
  },
});

var greenCylinder = viewer.entities.add({
  name: "Green cylinder with black outline",
  position: Cesium.Cartesian3.fromDegrees(-100.0, 40.0, 200000.0),
  show: true, // SHOW CAN ALSO BE PLACED OUTSIDE THE CYLINDER 
  cylinder: {
    length: 400000.0,
    topRadius: 200000.0,
    bottomRadius: 200000.0,
    material: Cesium.Color.GREEN.withAlpha(0.5),
    outline: true,
    outlineColor: Cesium.Color.DARK_GREEN,
  },
});

In the first case, show is of type Boolean. In the second case, show is of type Property. Since CallbackProperty is of parent type Property, for the CallbackProperty to work, you would need to put it inside the cylinder.

Here is a Sandcastle example.

2 Likes