How to add a cone whose bottom is close to the ground in cesium

In cesium development, add a large cone, and how to set it so that the cone appears to “grow out” from the ground rather than hang in the air like a spaceship. I want to create a signal range for the satellite. thank you!

const viewer = new Cesium.Viewer("cesiumContainer");

const redCone = viewer.entities.add({
  name: "Red cone",
  position: Cesium.Cartesian3.fromDegrees(-105.0, 40.0, 200000.0),
  cylinder: {
    length: 400000.0,
    topRadius: 0.0,
    bottomRadius: 2000000.0,
    material: Cesium.Color.RED,
    heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
  },
});

viewer.zoomTo(viewer.entities);

You probably don’t want the heightReference: CLAMP_TO_GROUND part here. This basically causes the bottom of the cone to always touch the ground, regardless of its position (height) and length.

Here is a sandcastle that shows the three aspects that affect the appearance of the cone:

  • The “height” is the z-component of the position of the cone entity
  • The “length” is the overall length of the cone
  • The “clamp” checkbox allows enabling/disabling the CLAMP_TO_GROUND behavior

When clamping is disabled, then…

  • you can move the cone up and down with the “height” slider
  • you can change the length of the cone with the “length” slider

When clamping is enabled, then

  • you can change the length of the cone with the “length” slider
  • you can NOT move the cone up and down with the “height” slider. It will always stick to the ground.

An aside: You may notice that when you modify the “length”, then the cone stretches/shrinks about its center. If you want the tip of the cone to be fixed, then the length of the cone has to be taken into account when defining the z-component of the position. This can be achieved by defining the position as

  position: new Cesium.CallbackProperty(() => {
    const z = Number(viewModel.height) - 0.5 * Number(viewModel.length);
    return Cesium.Cartesian3.fromDegrees(
      -105.0,
      40.0,
      z
    );
  }, false),

Then, when you modify the length, the tip of the cone will stay fixed.


EDIT: It might be that all that you have been looking for was the

viewer.scene.globe.depthTestAgainstTerrain = true; setting.

But regardless of that, I hope that the sandcastle shows how to achieve the effect of the cone to “grow out” of the ground:

Cesium Cone

Thank you for taking the time to reply. Your answers and sandbox examples are very helpful to me.

Due to the height limitation given by the orbital data, I cannot adjust the cone height at will, but I can calculate the required orbital height according to the depth inserted into the surface. This requires some detours, but it is not a problem.

Thanks again for your reply.