@reearth/core 0.0.7-alpha.7 → 0.0.7-alpha.70

package/src/engines/Cesium/hooks/useOverrideGlobeShader/useOverrideGlobeShader.ts

@@ -41,28 +41,36 @@ const defaultMatcher = new StringMatcher()
       initialColor = u_initialColor;
     #endif
     vec4 color = computeDayColor(initialColor`,
-  )
-  .erase([
-    "#ifdef APPLY_MATERIAL",
-    "czm_materialInput materialInput;",
-    "materialInput.st = v_textureCoordinates.st;",
-    "materialInput.normalEC = normalize(v_normalEC);",
-    "materialInput.positionToEyeEC = -v_positionEC;",
-    "materialInput.tangentToEyeMatrix = czm_eastNorthUpToEyeCoordinates(v_positionMC, normalize(v_normalEC));",
-    "materialInput.slope = v_slope;",
-    "materialInput.height = v_height;",
-    "materialInput.aspect = v_aspect;",
-    "czm_material material = czm_getMaterial(materialInput);",
-    "vec4 materialColor = vec4(material.diffuse, material.alpha);",
-    "color = alphaBlend(materialColor, color);",
-    "#endif",
-  ]);
+  );
+// Note: Commented out erase() call as it's not needed for Cesium 1.118.x
+// The replace() above already handles the material code modification
+// .erase([
+//   "#ifdef APPLY_MATERIAL",
+//   "czm_materialInput materialInput;",
+//   "materialInput.st = v_textureCoordinates.st;",
+//   "materialInput.normalEC = normalize(v_normalEC);",
+//   "materialInput.positionToEyeEC = -v_positionEC;",
+//   "materialInput.tangentToEyeMatrix = czm_eastNorthUpToEyeCoordinates(v_positionMC, normalize(v_normalEC));",
+//   "materialInput.slope = v_slope;",
+//   "materialInput.height = v_height;",
+//   "materialInput.aspect = v_aspect;",
+//   "czm_material material = czm_getMaterial(materialInput);",
+//   "vec4 materialColor = vec4(material.diffuse, material.alpha);",
+//   "color = alphaBlend(materialColor, color);",
+//   "#endif",
+// ]);
 
 function makeGlobeShadersDirty(globe: Globe): void {
   // Invoke the internal makeShadersDirty() by setting a material to globe to
   // reset surface shader source to the initial state (assuming that we never
   // use custom material on globe).
   // ref: https://github.com/CesiumGS/cesium/blob/1.106/packages/engine/Source/Scene/Globe.js#L562-L572
+
+  // Safety check: ensure globe's internal properties exist before manipulation
+  if (!globe || globe.isDestroyed() || !(globe as any)._surface) {
+    return;
+  }
+
   const material = globe.material;
   if (material == null) {
     globe.material = Material.fromType("Color");
@@ -73,6 +81,18 @@ function makeGlobeShadersDirty(globe: Globe): void {
   }
 }
 
+function withUniforms(globe: PrivateCesiumGlobe, add?: Record<string, () => any>) {
+  if (!globe._surface?._tileProvider) return;
+  const mm = (globe._surface._tileProvider as any)?.materialUniformMap ?? {};
+  (globe._surface._tileProvider as any).materialUniformMap = { ...mm, ...(add ?? {}) };
+}
+
+function removeUniforms(globe: PrivateCesiumGlobe, keys: string[]) {
+  const tp = globe._surface?._tileProvider as any;
+  if (!tp?.materialUniformMap) return;
+  for (const k of keys) delete tp.materialUniformMap[k];
+}
+
 const useIBL = ({
   sphericalHarmonicCoefficients,
   globeImageBasedLighting,
@@ -124,7 +144,7 @@ const useTerrainHeatmap = ({
   cesium,
   terrain,
 }: {
-  cesium: RefObject<CesiumComponentRef<Viewer>>;
+  cesium: RefObject<CesiumComponentRef<Viewer> | null>;
   terrain: TerrainProperty | undefined;
 }) => {
   const {
@@ -184,6 +204,18 @@ const useTerrainHeatmap = ({
   return { isCustomHeatmapEnabled, shaderForTerrainHeatmap };
 };
 
+async function waitTerrainReady(scene: any) {
+  const t = scene.terrain;
+  if (t?.ready) return;
+  await new Promise<void>(resolve => {
+    if (!t) return resolve();
+    const off = t.readyEvent.addEventListener(() => {
+      off();
+      resolve();
+    });
+  });
+}
+
 export const useOverrideGlobeShader = ({
   cesium,
   sphericalHarmonicCoefficients,
@@ -193,7 +225,7 @@ export const useOverrideGlobeShader = ({
   enableLighting,
   terrain,
 }: {
-  cesium: RefObject<CesiumComponentRef<Viewer>>;
+  cesium: RefObject<CesiumComponentRef<Viewer> | null>;
   sphericalHarmonicCoefficients?: Cartesian3[];
   globeShadowDarkness?: number;
   globeImageBasedLighting?: boolean;
@@ -201,6 +233,8 @@ export const useOverrideGlobeShader = ({
   enableLighting?: boolean;
   terrain: TerrainProperty | undefined;
 }) => {
+  const applyingRef = useRef(false);
+
   const { uniformMapForIBL, isIBLEnabled, shaderForIBL } = useIBL({
     sphericalHarmonicCoefficients,
     globeImageBasedLighting,
@@ -223,75 +257,85 @@ export const useOverrideGlobeShader = ({
 
   const needUpdateGlobeRef = useRef(false);
 
-  const handleGlobeShader = useCallback(() => {
+  const handleGlobeShader = useCallback(async () => {
     // NOTE: Support the spherical harmonic coefficient only when the terrain normal is enabled.
     // Because it's difficult to control the shader for the entire globe.
     // ref: https://github.com/CesiumGS/cesium/blob/af4e2bebbef25259f049b05822adf2958fce11ff/packages/engine/Source/Shaders/GlobeFS.glsl#L408
     if (!cesium.current?.cesiumElement || !needUpdateGlobeRef.current) return;
 
-    const globe = cesium.current.cesiumElement.scene.globe as PrivateCesiumGlobe;
+    if (applyingRef.current) return;
+    applyingRef.current = true;
 
-    const surfaceShaderSet = globe._surfaceShaderSet;
-    if (!surfaceShaderSet) {
-      if (import.meta.env.DEV) {
-        throw new Error("`globe._surfaceShaderSet` could not found");
-      }
-      return;
-    }
+    try {
+      const { scene } = cesium.current.cesiumElement;
+      await waitTerrainReady(scene);
 
-    const baseFragmentShaderSource = surfaceShaderSet.baseFragmentShaderSource;
+      const globe = cesium.current.cesiumElement.scene.globe as PrivateCesiumGlobe;
 
-    const GlobeFS = baseFragmentShaderSource?.sources[baseFragmentShaderSource.sources.length - 1];
+      // Reset shaders first so we patch the freshest base
+      makeGlobeShadersDirty(globe);
 
-    if (!GlobeFS || !baseFragmentShaderSource) {
-      if (import.meta.env.DEV) {
-        throw new Error("GlobeFS could not find.");
+      const surfaceShaderSet = globe._surfaceShaderSet;
+      if (!surfaceShaderSet) {
+        if (import.meta.env.DEV) {
+          throw new Error("`globe._surfaceShaderSet` could not found");
+        }
+        return;
       }
-      return;
-    }
 
-    const matchers: StringMatcher[] = [];
-    const shaders: string[] = [];
-    if (isIBLEnabled && globe.enableLighting && globe.terrainProvider.hasVertexNormals) {
-      matchers.push(shaderForIBL);
-      shaders.push(IBLFS);
-    }
+      const baseFragmentShaderSource = surfaceShaderSet.baseFragmentShaderSource;
+      const GlobeFS =
+        baseFragmentShaderSource?.sources[baseFragmentShaderSource.sources.length - 1];
 
-    if (isCustomHeatmapEnabled) {
-      // This will log the variables needed in the shader below.
-      // we need the minHeight, maxHeight and logarithmic
-      matchers.push(shaderForTerrainHeatmap);
-      shaders.push(HeatmapForTerrainFS);
-    }
+      if (!GlobeFS || !baseFragmentShaderSource) {
+        if (import.meta.env.DEV) {
+          throw new Error("GlobeFS could not find.");
+        }
+        return;
+      }
 
-    // This means there is no overridden shader.
-    if (!matchers.length) return;
+      const matchers: StringMatcher[] = [];
+      const shaders: string[] = [];
+      const terrainHasNormals = !!(globe.terrainProvider as any)?.hasVertexNormals;
 
-    needUpdateGlobeRef.current = false;
+      if (isIBLEnabled && globe.enableLighting && terrainHasNormals) {
+        matchers.push(shaderForIBL);
+        shaders.push(IBLFS);
+      }
 
-    if (!globe?._surface?._tileProvider) {
-      if (import.meta.env.DEV) {
-        throw new Error("`globe._surface._tileProvider.materialUniformMap` could not found");
+      if (isCustomHeatmapEnabled && terrainHasNormals) {
+        // This will log the variables needed in the shader below.
+        // we need the minHeight, maxHeight and logarithmic
+        matchers.push(shaderForTerrainHeatmap);
+        shaders.push(HeatmapForTerrainFS);
       }
-      return;
-    }
 
-    makeGlobeShadersDirty(globe);
+      // This means there is no overridden shader.
+      if (!matchers.length) return;
 
-    const replacedGlobeFS = defaultMatcher.concat(...matchers).execute(GlobeFS);
+      needUpdateGlobeRef.current = false;
 
-    globe._surface._tileProvider.materialUniformMap = {
-      ...(globe._surface._tileProvider.materialUniformMap ?? {}),
-      ...uniformMapForIBL,
-    };
+      if (!globe?._surface?._tileProvider) {
+        if (import.meta.env.DEV) {
+          throw new Error("`globe._surface._tileProvider.materialUniformMap` could not found");
+        }
+        return;
+      }
 
-    surfaceShaderSet.baseFragmentShaderSource = new ShaderSource({
-      sources: [
-        ...baseFragmentShaderSource.sources.slice(0, -1),
-        GlobeFSDefinitions + replacedGlobeFS + shaders.join(""),
-      ],
-      defines: baseFragmentShaderSource.defines,
-    });
+      const replacedGlobeFS = defaultMatcher.concat(...matchers).execute(GlobeFS);
+
+      withUniforms(globe, isIBLEnabled ? uniformMapForIBL : undefined);
+
+      surfaceShaderSet.baseFragmentShaderSource = new ShaderSource({
+        sources: [
+          ...baseFragmentShaderSource.sources.slice(0, -1),
+          GlobeFSDefinitions + replacedGlobeFS + shaders.join(""),
+        ],
+        defines: baseFragmentShaderSource.defines,
+      });
+    } finally {
+      applyingRef.current = false;
+    }
   }, [
     cesium,
     isCustomHeatmapEnabled,
@@ -317,6 +361,10 @@ export const useOverrideGlobeShader = ({
 
     return () => {
       if (!globe.isDestroyed()) {
+        removeUniforms(globe, [
+          "u_reearth_sphericalHarmonicCoefficients",
+          "u_reearth_globeImageBasedLighting",
+        ]);
         // Reset customized shader to default
         makeGlobeShadersDirty(globe);
       }

package/src/engines/Cesium/hooks/useViewerProperty.ts

@@ -9,7 +9,7 @@ export default ({
   cesium,
   property,
 }: {
-  cesium: RefObject<CesiumComponentRef<Viewer>>;
+  cesium: RefObject<CesiumComponentRef<Viewer> | null>;
   property?: ViewerProperty;
 }) => {
   const sceneLight = useMemo(() => {

package/src/engines/Cesium/hooks.ts

@@ -1,7 +1,6 @@
 import {
   Entity,
   Cesium3DTileFeature,
-  Ion,
   Cesium3DTileset,
   JulianDate,
   Cesium3DTilePointFeature,
@@ -27,6 +26,8 @@ import type {
 import { e2eAccessToken, setE2ECesiumViewer } from "../../e2eConfig";
 import { ComputedFeature, DataType, SelectedFeatureInfo, LatLng, Camera } from "../../mantle";
 import {
+  Credits,
+  CustomProviderConfig,
   LayerLoadEvent,
   LayerSelectWithRectEnd,
   LayerSelectWithRectMove,
@@ -35,9 +36,9 @@ import {
   RequestingRenderMode,
 } from "../../Map";
 import { TimelineManagerRef } from "../../Map/useTimelineManager";
-import { FEATURE_FLAGS } from "../../Visualizer/featureFlags";
+import { FEATURE_FLAGS } from "../../shared/featureFlags";
 
-import { isSelectable } from "./common";
+import { getCredits, isSelectable } from "./common";
 import { getTag, type Context as FeatureContext } from "./Feature";
 import { arrayToCartecian3 } from "./helpers/sphericalHaromic";
 import useCamera from "./hooks/useCamera";
@@ -69,6 +70,7 @@ export default ({
   selectedLayerId,
   selectionReason,
   meta,
+  customProvider,
   layersRef,
   featureFlags,
   timelineManagerRef,
@@ -89,6 +91,7 @@ export default ({
   onLayerLoad,
   onCameraChange,
   onMount,
+  onCreditsUpdate,
 }: {
   ref: React.ForwardedRef<EngineRef>;
   property?: ViewerProperty;
@@ -97,9 +100,10 @@ export default ({
     layerId?: string;
     featureId?: string;
   };
-  layersRef?: RefObject<LayersRef>;
+  layersRef?: RefObject<LayersRef | null>;
   selectionReason?: LayerSelectionReason;
   meta?: Record<string, unknown>;
+  customProvider?: CustomProviderConfig;
   featureFlags: number;
   timelineManagerRef?: TimelineManagerRef;
   isLayerDraggable?: boolean;
@@ -128,13 +132,14 @@ export default ({
   onLayerLoad?: (e: LayerLoadEvent) => void;
   onCameraChange?: (camera: Camera) => void;
   onMount?: () => void;
+  onCreditsUpdate?: (credits: Credits) => void;
 }) => {
   const cesium = useRef<CesiumComponentRef<CesiumViewer>>(null);
 
   const cesiumIonAccessToken =
     typeof meta?.cesiumIonAccessToken === "string" && meta.cesiumIonAccessToken
       ? meta.cesiumIonAccessToken
-      : Ion.defaultAccessToken;
+      : undefined;
 
   // expose ref
   const engineAPI = useEngineRef(ref, cesium);
@@ -237,8 +242,8 @@ export default ({
     | Primitive
     | GroundPrimitive
     | ImageryLayer
-  >();
-  const prevSelectedImageryFeatureId = useRef<string | undefined>();
+  >(undefined);
+  const prevSelectedImageryFeatureId = useRef<string | undefined>(undefined);
 
   // manage layer selection
   useEffect(() => {
@@ -334,8 +339,8 @@ export default ({
 
     if (entity) {
       const layer = tag?.layerId
-        ? layersRef?.current?.overriddenLayers().find(l => l.id === tag.layerId) ??
-          layersRef?.current?.findById(tag.layerId)
+        ? (layersRef?.current?.overriddenLayers().find(l => l.id === tag.layerId) ??
+          layersRef?.current?.findById(tag.layerId))
         : undefined;
       // Sometimes only featureId is specified, so we need to sync entity tag.
       onLayerSelect?.(
@@ -462,8 +467,8 @@ export default ({
       if (target && "id" in target && target.id instanceof Entity && isSelectable(target.id)) {
         const tag = getTag(target.id);
         const layer = tag?.layerId
-          ? layersRef?.current?.overriddenLayers().find(l => l.id === tag.layerId) ??
-            layersRef?.current?.findById(tag.layerId)
+          ? (layersRef?.current?.overriddenLayers().find(l => l.id === tag.layerId) ??
+            layersRef?.current?.findById(tag.layerId))
           : undefined;
         onLayerSelect?.(
           tag?.layerId,
@@ -557,8 +562,11 @@ export default ({
         if (pickRay) {
           const l = await scene.imageryLayers.pickImageryLayerFeatures(pickRay, scene);
 
-          // NOTE: For now we only send the first selected feature to onLayerSelect instead of sending all of them: @pyshx
-          const f = l?.[0];
+          // Find the topmost overlaid feature.
+          const f = l?.findLast(f => {
+            const appearanceType = f?.data?.appearanceType;
+            return appearanceType && f?.data?.feature?.[appearanceType]?.show !== false;
+          });
 
           const appearanceType = f?.data?.appearanceType;
 
@@ -581,8 +589,8 @@ export default ({
             }
 
             const layer = tag?.layerId
-              ? layersRef?.current?.overriddenLayers().find(l => l.id === tag.layerId) ??
-                layersRef?.current?.findById(tag.layerId)
+              ? (layersRef?.current?.overriddenLayers().find(l => l.id === tag.layerId) ??
+                layersRef?.current?.findById(tag.layerId))
               : undefined;
             const content = getEntityContent(
               f.data.feature ?? f,
@@ -648,10 +656,27 @@ export default ({
     viewer.scene.requestRender();
   }, []);
 
+  const onCreditsUpdateRef = useRef(onCreditsUpdate);
+  onCreditsUpdateRef.current = onCreditsUpdate;
+  const updateCredits = useCallback(() => {
+    if (!onCreditsUpdateRef.current) return;
+    // currently we don't have a proper way to get the credits update event
+    // wait for 3 seconds to get latest credits
+    // some internal property is been used here.
+    setTimeout(() => {
+      if (!onCreditsUpdateRef.current) return;
+      const viewer = cesium.current?.cesiumElement;
+      if (!viewer || viewer.isDestroyed()) return;
+      const credits = getCredits(viewer);
+      onCreditsUpdateRef.current(credits);
+    }, 3000);
+  }, []);
+
   const context = useMemo<FeatureContext>(
     () => ({
       selectionReason,
       timelineManagerRef,
+      customProvider,
       flyTo: engineAPI.flyTo,
       getCamera: engineAPI.getCamera,
       onLayerEdit,
@@ -662,8 +687,18 @@ export default ({
       toXYZ: engineAPI.toXYZ,
       toWindowPosition: engineAPI.toWindowPosition,
       isPositionVisible: engineAPI.isPositionVisible,
+      updateCredits,
     }),
-    [selectionReason, engineAPI, onLayerEdit, onLayerVisibility, onLayerLoad, timelineManagerRef],
+    [
+      selectionReason,
+      timelineManagerRef,
+      customProvider,
+      engineAPI,
+      onLayerEdit,
+      onLayerVisibility,
+      onLayerLoad,
+      updateCredits,
+    ],
   );
 
   useEffect(() => {
@@ -699,7 +734,13 @@ export default ({
 
   useLayerDragDrop({ cesium, onLayerDrag, onLayerDrop, isLayerDraggable });
 
-  useExplicitRender({ cesium, requestingRenderMode, isLayerDragging, shouldRender, property });
+  useExplicitRender({
+    cesium,
+    requestingRenderMode,
+    isLayerDragging,
+    shouldRender,
+    property,
+  });
 
   const {
     cameraViewBoundaries,
@@ -728,6 +769,14 @@ export default ({
     unmountCamera?.();
   }, [unmountCamera]);
 
+  const handleTilesChange = useCallback(() => {
+    updateCredits();
+  }, [updateCredits]);
+
+  const handleTerrainProviderChange = useCallback(() => {
+    updateCredits();
+  }, [updateCredits]);
+
   return {
     cesium,
     cesiumIonAccessToken,
@@ -747,6 +796,8 @@ export default ({
     handleClick,
     handleMount,
     handleUnmount,
+    handleTilesChange,
+    handleTerrainProviderChange,
   };
 };
 

package/src/engines/Cesium/index.stories.tsx

@@ -6,7 +6,6 @@ import { engine } from ".";
 
 export default {
   component: Map,
-  parameters: { actions: { argTypesRegex: "^on.*" } },
 } as Meta;
 
 const Template: StoryFn<Props> = args => <Map {...args} />;

package/src/engines/Cesium/index.tsx

@@ -47,6 +47,8 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
     shouldRender,
     layerSelectionReason,
     meta,
+    customProvider,
+    displayCredits,
     layersRef,
     featureFlags,
     requestingRenderMode,
@@ -63,6 +65,7 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
     onMount,
     onLayerVisibility,
     onLayerLoad,
+    onCreditsUpdate,
   },
   ref,
 ) => {
@@ -85,6 +88,8 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
     handleClick,
     handleMount,
     handleUnmount,
+    handleTilesChange,
+    handleTerrainProviderChange,
   } = useHooks({
     ref,
     property,
@@ -92,6 +97,7 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
     selectedLayerId,
     selectionReason: layerSelectionReason,
     meta,
+    customProvider,
     layersRef,
     featureFlags,
     timelineManagerRef,
@@ -112,8 +118,13 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
     onLayerLoad,
     onCameraChange,
     onMount,
+    onCreditsUpdate,
   });
 
+  const verticalExaggeration = property?.terrain?.enabled
+    ? (property?.scene?.verticalExaggeration ?? 1)
+    : 1;
+
   return (
     <Viewer
       ref={cesium}
@@ -133,7 +144,7 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
       navigationHelpButton={false}
       projectionPicker={false}
       sceneModePicker={false}
-      creditContainer={creditContainer}
+      creditContainer={displayCredits ? undefined : creditContainer}
       style={{
         width: small ? "300px" : "auto",
         height: small ? "300px" : "100%",
@@ -155,10 +166,16 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
       onMouseMove={mouseEventHandles.mouseMove}
       onMouseEnter={mouseEventHandles.mouseEnter}
       onMouseLeave={mouseEventHandles.mouseLeave}
-      onWheel={mouseEventHandles.wheel}>
+      onWheel={mouseEventHandles.wheel}
+      automaticallyTrackDataSourceClocks={false}>
       <Event onMount={handleMount} onUnmount={handleUnmount} />
       <Clock timelineManagerRef={timelineManagerRef} />
-      <ImageryLayers tiles={property?.tiles} cesiumIonAccessToken={cesiumIonAccessToken} />
+      <ImageryLayers
+        tiles={property?.tiles}
+        cesiumIonAccessToken={cesiumIonAccessToken}
+        customProvider={customProvider}
+        onTilesChange={handleTilesChange}
+      />
       <LabelImageryLayers tileLabels={property?.tileLabels} />
       <Indicator property={property} timelineManagerRef={timelineManagerRef} />
       <ScreenSpaceEventHandler useDefault>
@@ -201,7 +218,7 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
       <ScreenSpaceCameraController
         maximumZoomDistance={
           property?.camera?.limiter?.enabled
-            ? property.camera?.limiter?.targetArea?.height ?? Number.POSITIVE_INFINITY
+            ? (property.camera?.limiter?.targetArea?.height ?? Number.POSITIVE_INFINITY)
             : Number.POSITIVE_INFINITY
         }
         enableCollisionDetection={!property?.camera?.allowEnterGround}
@@ -236,11 +253,11 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
         light={sceneLight}
         mode={sceneMode}
         msaaSamples={sceneMsaaSamples}
-        useDepthPicking={false}
+        useDepthPicking={true}
         useWebVR={!!property?.scene?.vr || undefined} // NOTE: useWebVR={false} will crash Cesium
         debugShowFramesPerSecond={!!property?.debug?.showFramesPerSecond}
         verticalExaggerationRelativeHeight={property?.scene?.verticalExaggerationRelativeHeight}
-        verticalExaggeration={property?.scene?.verticalExaggeration}
+        verticalExaggeration={verticalExaggeration}
       />
       <SkyBox show={property?.sky?.skyBox?.show ?? true} />
       <Fog enabled={property?.sky?.fog?.enabled ?? true} density={property?.sky?.fog?.density} />
@@ -252,7 +269,11 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
         saturationShift={property?.sky?.skyAtmosphere?.saturationShift}
         brightnessShift={property?.sky?.skyAtmosphere?.brightnessShift}
       />
-      <Globe property={property} cesiumIonAccessToken={cesiumIonAccessToken} />
+      <Globe
+        property={property}
+        cesiumIonAccessToken={cesiumIonAccessToken}
+        onTerrainProviderChange={handleTerrainProviderChange}
+      />
       <featureContext.Provider value={context}>{ready ? children : null}</featureContext.Provider>
       <AmbientOcclusion
         {...AMBIENT_OCCLUSION_QUALITY[property?.render?.ambientOcclusion?.quality || "low"]}
@@ -279,5 +300,14 @@ export const engine: Engine = {
   featureComponent: Feature,
   clusterComponent: Cluster,
   sketchComponent: Sketch,
-  delegatedDataTypes: ["czml", "wms", "mvt", "3dtiles", "osm-buildings", "kml"],
+  delegatedDataTypes: [
+    "czml",
+    "wms",
+    "mvt",
+    "3dtiles",
+    "osm-buildings",
+    "reearth-buildings",
+    "google-photorealistic",
+    "kml",
+  ],
 };

package/src/engines/Cesium/pickMany.ts

@@ -152,6 +152,8 @@ function getPickCullingVolume(
   const camera = scene.camera;
   const frustum = camera.frustum;
   invariant(frustum instanceof PerspectiveFrustum);
+  invariant(frustum.fovy !== undefined);
+  invariant(frustum.aspectRatio !== undefined);
 
   const near = frustum.near;
   const tanPhi = Math.tan(frustum.fovy / 2);

package/src/engines/Cesium/types.ts

@@ -21,4 +21,4 @@ export type PrivateCesiumGlobe = Globe & {
   };
 };
 
-export type CursorType = "default" | "auto" | "help" | "pointer" | "grab" | "crosshair";
+export type CursorType = "default" | "auto" | "help" | "pointer" | "grab" | "crosshair" | "wait";

package/src/engines/Cesium/utils/mouse.ts

@@ -10,7 +10,7 @@ export const makeMouseEventProps = (viewer: Viewer, e: CesiumMovementEvent) => {
   const props: MouseEventProps = {
     x: position?.x,
     y: position?.y,
-    ...(position ? getLocationFromScreen(viewer.scene, position.x, position.y, true) ?? {} : {}),
+    ...(position ? (getLocationFromScreen(viewer.scene, position.x, position.y, true) ?? {}) : {}),
   };
   return props;
 };

package/src/engines/Cesium/utils/utils.ts

@@ -357,7 +357,7 @@ export const getEntityContent = (
     },
   };
 
-  return defaultContent ? content[defaultContent] : content.attributes ?? content.description;
+  return defaultContent ? content[defaultContent] : (content.attributes ?? content.description);
 };
 
 function propertiesToTableContent(properties: Record<string, any>): { key: string; value: any }[] {