Create entity on a 3D tileset

[DavidDvpt]

hi, i’m using Cesium with Resium react wrapper.
i’ve created a map with 3D tiles and a selected poligon and point. but sometimes, the point is under the tileset layer because my entity is linked on the View and not 3D Layer

my viewer code :

 <Viewer
      ref={cesiumViewer}
      full
      animation={false}
      timeline={false}
      homeButton={false}
      baseLayerPicker={false}
      sceneModePicker={false}
      onClick={handleMapClick}
      geocoder={false}
      style={{
        width: '100%',
        height: '100vh',
      }}
      infoBox={false}
      useBrowserRecommendedResolution={true}
    >
      <ResiumFlyTo clicked3dPoint={center} />

      <Cesium3DTileset url={tilesetUrl} />
      <SelectedPlotEntity />

      <ClickedPoint center={center} />
    </Viewer>

my entity code :

<Entity
      position={getCartesian3FromDegrees(parcelle.lng, parcelle.lat, 200)}
      // pin image display
      billboard={{
        image: entityPin,
        show: true,
        eyeOffset: new Cartesian3(0.0, 0.0, 0.0),
        horizontalOrigin: HorizontalOrigin.CENTER,
        verticalOrigin: VerticalOrigin.BOTTOM,
        alignedAxis: Cartesian3.ZERO,
        width: 30,
        height: 46,
      }}
      // plot id display
      label={{
        text: `${parcelle?.parcelleId?.substring(5) ?? ''}`,
        font: '14pt Lato',
        style: LabelStyle.FILL_AND_OUTLINE,
        outlineWidth: 2,
        verticalOrigin: VerticalOrigin.TOP,
        pixelOffset: new Cartesian2(0, -80),
      }}
    >
      {/* plot polygon display */}
      <SelectedPlotPolygon />

      {/* line ground to pin */}
      <PolylineGraphics
        material={Color.WHITE.withAlpha(0.5)}
        positions={[
          getCartesian3FromDegrees(parcelle?.lng, parcelle?.lat, 0),
          getCartesian3FromDegrees(parcelle?.lng, parcelle?.lat, 200),
        ]}
      />
    </Entity>

the good display on screen is like this, we can see the point (red marker)

but on this second city the point markers are between layers but polygon is displayed on the good layer

the first image is Bayonne - France and the second is Lyon - France
i think i must link points on scene or 3D tileset but i don’t know how

any ideas?

thanks

[DavidDvpt]

i’ve fixed the problem after removing resium and create full cesiumjs instance in a simple react component.
i’ve used TerrainProvider to take the height of a clicked point, then use it to create an entity on scene like this :

async function createTerrainProvider(latLng: StreetViewLatLngType) {
  return await Cesium.createWorldTerrainAsync().then(function (terrainProvider) {
    return terrainProvider;
  });
}
async function getTerrainInfosFromLatLng(
  terrain: Cesium.TerrainProvider,
  lat: number,
  lng: number
) {
  const positions = [Cesium.Cartographic.fromDegrees(lng, lat)];

  // Query the terrain height at the given positions
  return Cesium.sampleTerrainMostDetailed(terrain, positions).then((result) => {
    return result[0].height;
  });
}

and use it like this :

        // get clicked3dPoint height
        const height = await getTerrainInfosFromLatLng(
          terrainProvider,
          clicked3dPoint.lat - 0.005,
          clicked3dPoint.lng
        );
        // calculate initial camera position
        const initialPosition = getCartesian3FromDegrees(
          clicked3dPoint.lng,
          clicked3dPoint.lat - 0.005,
          height + 600
        );

working fine