Search code examples
javascriptcesiumjs

markers in Cesium are cut


This how it looks in non-terrain mode

: enter image description here

In order to add markers in Cesium, both in terrain mode and in non-terrain mode I'm doing this:

this.viewer = new Cesium.Viewer(this.container.nativeElement , {
       baseLayerPicker : true,
      selectedTerrainProviderViewModel: terrain[1]
    });
    this.viewer.terrainProvider = new Cesium.EllipsoidTerrainProvider();

and then, when the I give input of terrain url (terrain url is correct: https://assets.agi.com/stk-terrain/world)

 if(this.cesium.viewer.terrainProvider.hasOwnProperty("_url")) {
      this.cesiumHandler = new Cesium.ScreenSpaceEventHandler(this.cesium.viewer.scene.canvas);
      var pickedObject = this.cesium.viewer.scene.pick(event.position);
      let positionCartesian3 = this.cesium.viewer.scene.pickPosition(event.position);
      let positionCartographic = Cesium.Cartographic.fromCartesian(positionCartesian3);
      let lngDeg: number = Cesium.Math.toDegrees(positionCartographic.longitude);
      let latDeg: number = Cesium.Math.toDegrees(positionCartographic.latitude);
       position = [lngDeg, latDeg, positionCartographic.height];
    }
    else {
      this.cesiumHandler = new Cesium.ScreenSpaceEventHandler(this.cesium.container.nativeElement);
      let positionCartesian3 = this.cesium.viewer.camera.pickEllipsoid(event.position);
      let positionCartographic = Cesium.Cartographic.fromCartesian(positionCartesian3);
      let lngDeg: number = Cesium.Math.toDegrees(positionCartographic.longitude);
      let latDeg: number = Cesium.Math.toDegrees(positionCartographic.latitude);
      position= [lngDeg, latDeg];
    }

Solution

  • Whenever adding any entity on terrain, use

            this.cesium.viewer.scene.globe.depthTestAgainstTerrain = true;