@reearth/core 0.0.7-alpha.1 → 0.0.7-alpha.11

package/src/Map/types/index.ts

@@ -38,8 +38,7 @@ import type {
   LayerSelectionReason,
   Ref as LayersRef,
 } from "../Layers";
-import { SketchComponentType } from "../Sketch";
-import { SketchAppearance, SketchType } from "../Sketch/types";
+import { SketchType, SketchOptions, SketchComponentType } from "../Sketch/types";
 import type { TimelineManagerRef } from "../useTimelineManager";
 
 import type { SceneMode, ViewerProperty } from "./viewerProperty";
@@ -89,7 +88,7 @@ export type EngineRef = {
   getLocationFromScreen: (x: number, y: number, withTerrain?: boolean) => LatLngHeight | undefined;
   sampleTerrainHeight: (lng: number, lat: number) => Promise<number | undefined>;
   computeGlobeHeight: (lng: number, lat: number, height?: number) => number | undefined;
-  getGlobeHeight: () => void;
+  getGlobeHeight: () => number | undefined;
   toXYZ: (
     lng: number,
     lat: number,
@@ -300,18 +299,18 @@ export type MouseEventCallback = (props: MouseEventProps) => void;
 export type MouseWheelEventCallback = (props: MouseEventProps) => void;
 export type MouseEventTypes =
   | "click"
-  | "doubleclick"
-  | "mousedown"
-  | "mouseup"
-  | "rightclick"
-  | "rightdown"
-  | "rightup"
-  | "middleclick"
-  | "middledown"
-  | "middleup"
-  | "mousemove"
-  | "mouseenter"
-  | "mouseleave"
+  | "doubleClick"
+  | "mouseDown"
+  | "mouseUp"
+  | "rightClick"
+  | "rightDown"
+  | "rightUp"
+  | "middleClick"
+  | "middleDown"
+  | "middleUp"
+  | "mouseMove"
+  | "mouseEnter"
+  | "mouseLeave"
   | "wheel";
 
 export type MouseEvents = {
@@ -322,18 +321,18 @@ export type MouseEvents = {
 
 export type MouseEventHandles = {
   onClick: (fn: MouseEvents["click"]) => void;
-  onDoubleClick: (fn: MouseEvents["doubleclick"]) => void;
-  onMouseDown: (fn: MouseEvents["mousedown"]) => void;
-  onMouseUp: (fn: MouseEvents["mouseup"]) => void;
-  onRightClick: (fn: MouseEvents["rightclick"]) => void;
-  onRightDown: (fn: MouseEvents["rightdown"]) => void;
-  onRightUp: (fn: MouseEvents["rightup"]) => void;
-  onMiddleClick: (fn: MouseEvents["middleclick"]) => void;
-  onMiddleDown: (fn: MouseEvents["middledown"]) => void;
-  onMiddleUp: (fn: MouseEvents["middleup"]) => void;
-  onMouseMove: (fn: MouseEvents["mousemove"]) => void;
-  onMouseEnter: (fn: MouseEvents["mouseenter"]) => void;
-  onMouseLeave: (fn: MouseEvents["mouseleave"]) => void;
+  onDoubleClick: (fn: MouseEvents["doubleClick"]) => void;
+  onMouseDown: (fn: MouseEvents["mouseDown"]) => void;
+  onMouseUp: (fn: MouseEvents["mouseUp"]) => void;
+  onRightClick: (fn: MouseEvents["rightClick"]) => void;
+  onRightDown: (fn: MouseEvents["rightDown"]) => void;
+  onRightUp: (fn: MouseEvents["rightUp"]) => void;
+  onMiddleClick: (fn: MouseEvents["middleClick"]) => void;
+  onMiddleDown: (fn: MouseEvents["middleDown"]) => void;
+  onMiddleUp: (fn: MouseEvents["middleUp"]) => void;
+  onMouseMove: (fn: MouseEvents["mouseMove"]) => void;
+  onMouseEnter: (fn: MouseEvents["mouseEnter"]) => void;
+  onMouseLeave: (fn: MouseEvents["mouseLeave"]) => void;
   onWheel: (fn: MouseEvents["wheel"]) => void;
 };
 
@@ -357,12 +356,8 @@ export type Engine = {
 export type RequestingRenderMode = -1 | 0 | 1; // -1: force render on every postUpdate, 0: no request to render, 1: request one frame
 
 export type SketchRef = {
+  getType: () => SketchType | undefined;
   setType: (type: SketchType | undefined, from?: "editor" | "plugin") => void;
-  setColor: (color: string) => void;
-  setDefaultAppearance: (appearance: SketchAppearance) => void;
-  disableShadow: (disable: boolean) => void;
-  enableRelativeHeight: (enable: boolean) => void;
-  createDataOnly: (dataOnly: boolean) => void;
-  allowRightClickToAbort: (allow: boolean) => void;
-  allowAutoResetInteractionMode: (allow: boolean) => void;
+  getOptions: () => SketchOptions;
+  overrideOptions: (options: SketchOptions) => void;
 };

package/src/Map/types/viewerProperty.ts

@@ -69,10 +69,10 @@ export type TerrainProperty = {
   type?: "cesium" | "arcgis" | "cesiumion";
   url?: string;
   normal?: boolean;
-  heightMap?: HeightMapProperty;
+  elevationHeatMap?: ElevationHeatMapProperty;
 };
 
-export type HeightMapProperty = {
+export type ElevationHeatMapProperty = {
   type?: "custom";
   colorLUT?: LUT;
   minHeight?: number;
@@ -167,7 +167,6 @@ export type SkyAtmosphereProperty = {
 };
 
 export type CameraProperty = {
-  camera?: Camera;
   allowEnterGround?: boolean;
   limiter?: CameraLimiterProperty;
 };
@@ -203,7 +202,7 @@ export type AssetsProperty = {
 };
 
 export type AssetsCesiumProperty = {
-  terrian?: {
+  terrain?: {
     ionAccessToken?: string;
     ionAsset?: string;
     ionUrl?: string;

package/src/Map/useTimelineManager.ts

@@ -193,7 +193,9 @@ export default ({ init, engineRef, timelineManagerRef }: Props) => {
       onCommit,
       offCommit,
       handleTick,
-      tick: engineRef?.current?.tick,
+      get tick() {
+        return engineRef?.current?.tick;
+      },
     };
   }, [
     options,

package/src/Visualizer/hooks.ts

@@ -82,12 +82,24 @@ export default function useHooks(
       reason: LayerSelectionReason | undefined,
       info: SelectedFeatureInfo | undefined,
     ) => {
-      if (selectedLayer.layerId === layerId && selectedLayer.featureId === featureId) return;
+      const isSketchLayer =
+        selectedLayer.layer?.layer.type === "simple" &&
+        selectedLayer.layer?.layer?.data?.isSketchLayer;
+      // Sketch layer feature has a fixed featureId, we need to exclude it from the skip condition
+      if (
+        selectedLayer.layerId === layerId &&
+        selectedLayer.featureId === featureId &&
+        !isSketchLayer
+      )
+        return;
 
       const computedLayer = await layer?.();
       const computedFeature =
         layerId && featureId
-          ? mapRef.current?.engine.findComputedFeatureById?.(layerId, featureId) ?? info?.feature
+          ? (isSketchLayer
+              ? computedLayer?.features?.find(f => f.id === featureId)
+              : mapRef.current?.engine.findComputedFeatureById?.(layerId, featureId)) ??
+            info?.feature
           : undefined;
 
       selectFeature(

package/src/Visualizer/useCoreAPI.ts

@@ -5,7 +5,7 @@ import { ViewerProperty } from "../engines";
 
 interface CoreAPI {
   readonly version: string;
-  readonly property?: ViewerProperty;
+  readonly viewerProperty?: ViewerProperty;
 }
 
 export default ({ viewerProperty }: { viewerProperty?: ViewerProperty }) => {
@@ -17,7 +17,7 @@ export default ({ viewerProperty }: { viewerProperty?: ViewerProperty }) => {
       get version() {
         return version;
       },
-      get property() {
+      get viewerProperty() {
         return viewerPropertyRef.current;
       },
     }),

package/src/engines/Cesium/Feature/Tileset/useClippingBox.ts

@@ -411,7 +411,16 @@ export const useClippingBox = ({
     eventHandler.setInputAction(handleMouseUp, ScreenSpaceEventType.LEFT_UP);
   }, [eventHandler, handleMouseDown, handleRawMouseMove, handleMouseUp]);
 
-  useEffect(() => () => eventHandler.destroy(), [eventHandler]);
+  useEffect(
+    () => () => {
+      requestAnimationFrame(() => {
+        if (!eventHandler.isDestroyed()) {
+          eventHandler.destroy();
+        }
+      });
+    },
+    [eventHandler],
+  );
 
   const boxProperty = useMemo(
     () => ({ ...boxState, ...dimensions, allowEnterGround }),

package/src/engines/Cesium/Feature/utils.tsx

@@ -17,7 +17,7 @@ import {
   GroundPrimitive,
 } from "cesium";
 import md5 from "js-md5";
-import { pick } from "lodash-es";
+import { isEqual, pick } from "lodash-es";
 import {
   ComponentProps,
   ComponentType,
@@ -87,8 +87,17 @@ function EntityExtComponent(
   ref: ForwardedRef<CesiumComponentRef<CesiumEntity>>,
 ) {
   const r = useRef<CesiumComponentRef<CesiumEntity>>(null);
+  const entityRef = useRef<CesiumEntity | undefined>(r?.current?.cesiumElement);
 
   useLayoutEffect(() => {
+    // Note: Sketch feature's tag cannot be attached properly when first load
+    // The cesiumElement is undefined when attach, and doesn't have a chance to attach again.
+    // Root cause is still not clear.
+    // Here we add r.current as a dependency and check cesiumElement instead.
+    if (entityRef.current !== undefined && isEqual(entityRef.current, r.current?.cesiumElement))
+      return;
+    entityRef.current = r.current?.cesiumElement;
+
     attachTag(r.current?.cesiumElement, {
       layerId: layerId || props.id,
       featureId,
@@ -97,6 +106,7 @@ function EntityExtComponent(
       legacyLocationPropertyKey,
       hideIndicator,
     });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [
     draggable,
     featureId,
@@ -105,6 +115,7 @@ function EntityExtComponent(
     props.id,
     unselectable,
     hideIndicator,
+    r.current,
   ]);
 
   return <Entity ref={composeRefs(ref, r)} {...props} />;

package/src/engines/Cesium/Shaders/OverriddenShaders/GlobeFS/IBL.glsl

@@ -6,8 +6,7 @@
 // https://github.com/CesiumGS/cesium/blob/1.106/packages/engine/Source/Shaders/Model/ImageBasedLightingStageFS.glsl
 // Specular term was removed, as I never apply it on terrain.
 vec3 reearth_imageBasedLightingStage(vec3 positionEC, vec3 normalEC,
-                                     vec3 lightDirectionEC, vec3 lightColorHdr,
-                                     czm_pbrParameters pbrParameters) {
+                                     vec3 lightDirectionEC, czm_modelMaterial material) {
   vec3 v = -positionEC;
   vec3 n = normalEC;
   vec3 l = normalize(lightDirectionEC);
@@ -24,21 +23,18 @@ vec3 reearth_imageBasedLightingStage(vec3 positionEC, vec3 normalEC,
   vec3 diffuseIrradiance =
       czm_sphericalHarmonics(cubeDir, u_reearth_sphericalHarmonicCoefficients);
 
-  return pbrParameters.diffuseColor * diffuseIrradiance;
+  return material.diffuse * diffuseIrradiance;
 }
 
 vec4 reearth_computeImageBasedLightingColor(vec4 color) {
   if (u_reearth_globeImageBasedLighting) {
-    czm_pbrParameters pbrParameters;
-    pbrParameters.diffuseColor = color.rgb;
+    czm_modelMaterial material;
+    material.diffuse = color.rgb;
 
     vec3 normalEC = normalize(v_normalEC);
     vec3 lighting =
-        czm_pbrLighting(v_positionEC, normalEC, czm_lightDirectionEC,
-                        czm_lightColorHdr, pbrParameters);
-    lighting += reearth_imageBasedLightingStage(
-                    v_positionEC, normalEC, czm_lightDirectionEC,
-                    czm_lightColorHdr, pbrParameters) *
+        czm_pbrLighting(v_positionEC, normalEC, czm_lightDirectionEC, material) * czm_lightColorHdr;
+    lighting += reearth_imageBasedLightingStage(v_positionEC, normalEC, czm_lightDirectionEC, material) *
                 u_vertexShadowDarkness;
 
 #ifndef HDR

package/src/engines/Cesium/core/Globe.tsx

@@ -30,9 +30,9 @@ export default function Globe({ property, cesiumIonAccessToken }: Props): JSX.El
       terrain: terrainProperty?.enabled,
       terrainType: terrainProperty?.type,
       normal: terrainProperty?.normal,
-      ionAccessToken: property?.assets?.cesium?.terrian?.ionAccessToken || cesiumIonAccessToken,
-      ionAsset: property?.assets?.cesium?.terrian?.ionAsset,
-      ionUrl: property?.assets?.cesium?.terrian?.ionUrl,
+      ionAccessToken: property?.assets?.cesium?.terrain?.ionAccessToken || cesiumIonAccessToken,
+      ionAsset: property?.assets?.cesium?.terrain?.ionAsset,
+      ionUrl: property?.assets?.cesium?.terrain?.ionUrl,
     };
     const provider = opts.terrain ? terrainProviders[opts.terrainType || "cesium"] : undefined;
     return (typeof provider === "function" ? provider(opts) : provider) ?? defaultTerrainProvider;
@@ -40,9 +40,9 @@ export default function Globe({ property, cesiumIonAccessToken }: Props): JSX.El
     terrainProperty?.enabled,
     terrainProperty?.type,
     terrainProperty?.normal,
-    property?.assets?.cesium?.terrian?.ionAccessToken,
-    property?.assets?.cesium?.terrian?.ionAsset,
-    property?.assets?.cesium?.terrian?.ionUrl,
+    property?.assets?.cesium?.terrain?.ionAccessToken,
+    property?.assets?.cesium?.terrain?.ionAsset,
+    property?.assets?.cesium?.terrain?.ionUrl,
     cesiumIonAccessToken,
   ]);
 
@@ -72,7 +72,7 @@ const terrainProviders: {
   [k in NonNullable<TerrainProperty["type"]>]:
     | TerrainProvider
     | ((
-        opts: Pick<TerrainProperty, "normal"> & AssetsCesiumProperty["terrian"],
+        opts: Pick<TerrainProperty, "normal"> & AssetsCesiumProperty["terrain"],
       ) => Promise<TerrainProvider> | TerrainProvider | null);
 } = {
   cesium: ({ ionAccessToken, normal }) =>

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

@@ -84,21 +84,12 @@ export default ({
       initialCameraFlight.current = true;
       if (property?.camera?.limiter?.enabled && property?.camera?.limiter?.targetArea) {
         engineAPI.flyTo(property?.camera?.limiter?.targetArea, { duration: 0 });
-      } else if (property?.camera?.camera) {
-        const camera = property?.camera?.camera;
-        engineAPI.flyTo(camera as Camera, { duration: 0 });
-      }
-      const camera = getCamera(cesium?.current?.cesiumElement);
-      if (camera) {
-        onCameraChange?.(camera);
+      } else if (camera) {
+        engineAPI.flyTo(camera, { duration: 0 });
       }
     },
-    [engineAPI, property?.camera?.camera, property?.camera?.limiter?.enabled, onCameraChange],
-    (prevDeps, nextDeps) =>
-      prevDeps[0] === nextDeps[0] &&
-      isEqual(prevDeps[1], nextDeps[1]) &&
-      prevDeps[2] === nextDeps[2] &&
-      prevDeps[3] === nextDeps[3],
+    [engineAPI, property?.camera?.limiter?.enabled],
+    (prevDeps, nextDeps) => prevDeps[0] === nextDeps[0] && prevDeps[1] === nextDeps[1],
   );
 
   const unmountCamera = useCallback(() => {

package/src/engines/Cesium/hooks/useEngineRef.test.tsx

@@ -57,86 +57,86 @@ test("bind mouse events", () => {
   expect(mockMouseEventCallback).toHaveBeenCalledWith(props);
 
   result.current.current?.onDoubleClick(mockMouseEventCallback);
-  expect(result.current.current?.mouseEventCallbacks.doubleclick[0]).toBe(mockMouseEventCallback);
+  expect(result.current.current?.mouseEventCallbacks.doubleClick[0]).toBe(mockMouseEventCallback);
 
-  result.current.current?.mouseEventCallbacks.doubleclick[0]?.(props);
+  result.current.current?.mouseEventCallbacks.doubleClick[0]?.(props);
   expect(mockMouseEventCallback).toHaveBeenCalledTimes(2);
   expect(mockMouseEventCallback).toHaveBeenCalledWith(props);
 
   result.current.current?.onMouseDown(mockMouseEventCallback);
-  expect(result.current.current?.mouseEventCallbacks.mousedown[0]).toBe(mockMouseEventCallback);
+  expect(result.current.current?.mouseEventCallbacks.mouseDown[0]).toBe(mockMouseEventCallback);
 
-  result.current.current?.mouseEventCallbacks.mousedown[0]?.(props);
+  result.current.current?.mouseEventCallbacks.mouseDown[0]?.(props);
   expect(mockMouseEventCallback).toHaveBeenCalledTimes(3);
   expect(mockMouseEventCallback).toHaveBeenCalledWith(props);
 
   result.current.current?.onMouseUp(mockMouseEventCallback);
-  expect(result.current.current?.mouseEventCallbacks.mouseup[0]).toBe(mockMouseEventCallback);
+  expect(result.current.current?.mouseEventCallbacks.mouseUp[0]).toBe(mockMouseEventCallback);
 
-  result.current.current?.mouseEventCallbacks.mouseup[0]?.(props);
+  result.current.current?.mouseEventCallbacks.mouseUp[0]?.(props);
   expect(mockMouseEventCallback).toHaveBeenCalledTimes(4);
   expect(mockMouseEventCallback).toHaveBeenCalledWith(props);
 
   result.current.current?.onRightClick(mockMouseEventCallback);
-  expect(result.current.current?.mouseEventCallbacks.rightclick[0]).toBe(mockMouseEventCallback);
+  expect(result.current.current?.mouseEventCallbacks.rightClick[0]).toBe(mockMouseEventCallback);
 
-  result.current.current?.mouseEventCallbacks.rightclick[0]?.(props);
+  result.current.current?.mouseEventCallbacks.rightClick[0]?.(props);
   expect(mockMouseEventCallback).toHaveBeenCalledTimes(5);
   expect(mockMouseEventCallback).toHaveBeenCalledWith(props);
 
   result.current.current?.onRightDown(mockMouseEventCallback);
-  expect(result.current.current?.mouseEventCallbacks.rightdown[0]).toBe(mockMouseEventCallback);
+  expect(result.current.current?.mouseEventCallbacks.rightDown[0]).toBe(mockMouseEventCallback);
 
-  result.current.current?.mouseEventCallbacks.rightdown[0]?.(props);
+  result.current.current?.mouseEventCallbacks.rightDown[0]?.(props);
   expect(mockMouseEventCallback).toHaveBeenCalledTimes(6);
   expect(mockMouseEventCallback).toHaveBeenCalledWith(props);
 
   result.current.current?.onRightUp(mockMouseEventCallback);
-  expect(result.current.current?.mouseEventCallbacks.rightup[0]).toBe(mockMouseEventCallback);
+  expect(result.current.current?.mouseEventCallbacks.rightUp[0]).toBe(mockMouseEventCallback);
 
-  result.current.current?.mouseEventCallbacks.rightup[0]?.(props);
+  result.current.current?.mouseEventCallbacks.rightUp[0]?.(props);
   expect(mockMouseEventCallback).toHaveBeenCalledTimes(7);
   expect(mockMouseEventCallback).toHaveBeenCalledWith(props);
 
   result.current.current?.onMiddleClick(mockMouseEventCallback);
-  expect(result.current.current?.mouseEventCallbacks.middleclick[0]).toBe(mockMouseEventCallback);
+  expect(result.current.current?.mouseEventCallbacks.middleClick[0]).toBe(mockMouseEventCallback);
 
-  result.current.current?.mouseEventCallbacks.middleclick[0]?.(props);
+  result.current.current?.mouseEventCallbacks.middleClick[0]?.(props);
   expect(mockMouseEventCallback).toHaveBeenCalledTimes(8);
   expect(mockMouseEventCallback).toHaveBeenCalledWith(props);
 
   result.current.current?.onMiddleDown(mockMouseEventCallback);
-  expect(result.current.current?.mouseEventCallbacks.middledown[0]).toBe(mockMouseEventCallback);
+  expect(result.current.current?.mouseEventCallbacks.middleDown[0]).toBe(mockMouseEventCallback);
 
-  result.current.current?.mouseEventCallbacks.middledown[0]?.(props);
+  result.current.current?.mouseEventCallbacks.middleDown[0]?.(props);
   expect(mockMouseEventCallback).toHaveBeenCalledTimes(9);
   expect(mockMouseEventCallback).toHaveBeenCalledWith(props);
 
   result.current.current?.onMiddleUp(mockMouseEventCallback);
-  expect(result.current.current?.mouseEventCallbacks.middleup[0]).toBe(mockMouseEventCallback);
+  expect(result.current.current?.mouseEventCallbacks.middleUp[0]).toBe(mockMouseEventCallback);
 
-  result.current.current?.mouseEventCallbacks.middleup[0]?.(props);
+  result.current.current?.mouseEventCallbacks.middleUp[0]?.(props);
   expect(mockMouseEventCallback).toHaveBeenCalledTimes(10);
   expect(mockMouseEventCallback).toHaveBeenCalledWith(props);
 
   result.current.current?.onMouseMove(mockMouseEventCallback);
-  expect(result.current.current?.mouseEventCallbacks.mousemove[0]).toBe(mockMouseEventCallback);
+  expect(result.current.current?.mouseEventCallbacks.mouseMove[0]).toBe(mockMouseEventCallback);
 
-  result.current.current?.mouseEventCallbacks.mousemove[0]?.(props);
+  result.current.current?.mouseEventCallbacks.mouseMove[0]?.(props);
   expect(mockMouseEventCallback).toHaveBeenCalledTimes(11);
   expect(mockMouseEventCallback).toHaveBeenCalledWith(props);
 
   result.current.current?.onMouseEnter(mockMouseEventCallback);
-  expect(result.current.current?.mouseEventCallbacks.mouseenter[0]).toBe(mockMouseEventCallback);
+  expect(result.current.current?.mouseEventCallbacks.mouseEnter[0]).toBe(mockMouseEventCallback);
 
-  result.current.current?.mouseEventCallbacks.mouseenter[0]?.(props);
+  result.current.current?.mouseEventCallbacks.mouseEnter[0]?.(props);
   expect(mockMouseEventCallback).toHaveBeenCalledTimes(12);
   expect(mockMouseEventCallback).toHaveBeenCalledWith(props);
 
   result.current.current?.onMouseLeave(mockMouseEventCallback);
-  expect(result.current.current?.mouseEventCallbacks.mouseleave[0]).toBe(mockMouseEventCallback);
+  expect(result.current.current?.mouseEventCallbacks.mouseLeave[0]).toBe(mockMouseEventCallback);
 
-  result.current.current?.mouseEventCallbacks.mouseleave[0]?.(props);
+  result.current.current?.mouseEventCallbacks.mouseLeave[0]?.(props);
   expect(mockMouseEventCallback).toHaveBeenCalledTimes(13);
   expect(mockMouseEventCallback).toHaveBeenCalledWith(props);
 

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

@@ -53,18 +53,18 @@ export default function useEngineRef(
   const cancelCameraFlight = useRef<() => void>();
   const mouseEventCallbacks = useRef<MouseEventCallbacks>({
     click: [],
-    doubleclick: [],
-    mousedown: [],
-    mouseup: [],
-    rightclick: [],
-    rightdown: [],
-    rightup: [],
-    middleclick: [],
-    middledown: [],
-    middleup: [],
-    mousemove: [],
-    mouseenter: [],
-    mouseleave: [],
+    doubleClick: [],
+    mouseDown: [],
+    mouseUp: [],
+    rightClick: [],
+    rightDown: [],
+    rightUp: [],
+    middleClick: [],
+    middleDown: [],
+    middleUp: [],
+    mouseMove: [],
+    mouseEnter: [],
+    mouseLeave: [],
     wheel: [],
   });
   const tickEventCallback = useRef<TickEventCallback[]>([]);
@@ -237,6 +237,8 @@ export default function useEngineRef(
       setView: camera => {
         const viewer = cesium.current?.cesiumElement;
         if (!viewer || viewer.isDestroyed()) return false;
+        if (camera.lat === undefined || camera.lng === undefined || camera.height === undefined)
+          return false;
         const scene = viewer.scene;
         if (camera.lng || camera.lat || camera.height) {
           const xyz = Cesium.Cartesian3.fromDegrees(camera.lng, camera.lat, camera.height);
@@ -675,40 +677,40 @@ export default function useEngineRef(
         mouseEventCallbacks.current.click.push(cb);
       },
       onDoubleClick: (cb: (props: MouseEventProps) => void) => {
-        mouseEventCallbacks.current.doubleclick.push(cb);
+        mouseEventCallbacks.current.doubleClick.push(cb);
       },
       onMouseDown: (cb: (props: MouseEventProps) => void) => {
-        mouseEventCallbacks.current.mousedown.push(cb);
+        mouseEventCallbacks.current.mouseDown.push(cb);
       },
       onMouseUp: (cb: (props: MouseEventProps) => void) => {
-        mouseEventCallbacks.current.mouseup.push(cb);
+        mouseEventCallbacks.current.mouseUp.push(cb);
       },
       onRightClick: (cb: (props: MouseEventProps) => void) => {
-        mouseEventCallbacks.current.rightclick.push(cb);
+        mouseEventCallbacks.current.rightClick.push(cb);
       },
       onRightDown: (cb: (props: MouseEventProps) => void) => {
-        mouseEventCallbacks.current.rightdown.push(cb);
+        mouseEventCallbacks.current.rightDown.push(cb);
       },
       onRightUp: (cb: (props: MouseEventProps) => void) => {
-        mouseEventCallbacks.current.rightup.push(cb);
+        mouseEventCallbacks.current.rightUp.push(cb);
       },
       onMiddleClick: (cb: (props: MouseEventProps) => void) => {
-        mouseEventCallbacks.current.middleclick.push(cb);
+        mouseEventCallbacks.current.middleClick.push(cb);
       },
       onMiddleDown: (cb: (props: MouseEventProps) => void) => {
-        mouseEventCallbacks.current.middledown.push(cb);
+        mouseEventCallbacks.current.middleDown.push(cb);
       },
       onMiddleUp: (cb: (props: MouseEventProps) => void) => {
-        mouseEventCallbacks.current.middleup.push(cb);
+        mouseEventCallbacks.current.middleUp.push(cb);
       },
       onMouseMove: (cb: (props: MouseEventProps) => void) => {
-        mouseEventCallbacks.current.mousemove.push(cb);
+        mouseEventCallbacks.current.mouseMove.push(cb);
       },
       onMouseEnter: (cb: (props: MouseEventProps) => void) => {
-        mouseEventCallbacks.current.mouseenter.push(cb);
+        mouseEventCallbacks.current.mouseEnter.push(cb);
       },
       onMouseLeave: (cb: (props: MouseEventProps) => void) => {
-        mouseEventCallbacks.current.mouseleave.push(cb);
+        mouseEventCallbacks.current.mouseLeave.push(cb);
       },
       onWheel: (cb: (props: MouseEventProps) => void) => {
         mouseEventCallbacks.current.wheel.push(cb);

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

@@ -133,7 +133,7 @@ const useTerrainHeatmap = ({
     minHeight: heatmapMinHeight,
     logarithmic: heatmapLogarithmic,
     colorLUT: heatmapColorLUT,
-  } = terrain?.heightMap ?? {};
+  } = terrain?.elevationHeatMap ?? {};
 
   const isCustomHeatmapEnabled = useMemo(() => heatmapType === "custom", [heatmapType]);
 
@@ -143,7 +143,7 @@ const useTerrainHeatmap = ({
         [
           "#ifdef APPLY_COLOR_TO_ALPHA",
           "vec3 colorDiff = abs(color.rgb - colorToAlpha.rgb);",
-          "colorDiff.r = max(max(colorDiff.r, colorDiff.g), colorDiff.b);",
+          "colorDiff.r = czm_maximumComponent(colorDiff);",
           "alpha = czm_branchFreeTernary(colorDiff.r < colorToAlpha.a, 0.0, alpha);",
           "#endif",
         ],

package/src/engines/Cesium/hooks.ts

@@ -412,18 +412,18 @@ export default ({
       wheel: CesiumMouseWheelEvent | undefined;
     } = {
       click: undefined,
-      doubleclick: undefined,
-      mousedown: undefined,
-      mouseup: undefined,
-      rightclick: undefined,
-      rightdown: undefined,
-      rightup: undefined,
-      middleclick: undefined,
-      middledown: undefined,
-      middleup: undefined,
-      mousemove: undefined,
-      mouseenter: undefined,
-      mouseleave: undefined,
+      doubleClick: undefined,
+      mouseDown: undefined,
+      mouseUp: undefined,
+      rightClick: undefined,
+      rightDown: undefined,
+      rightUp: undefined,
+      middleClick: undefined,
+      middleDown: undefined,
+      middleUp: undefined,
+      mouseMove: undefined,
+      mouseEnter: undefined,
+      mouseLeave: undefined,
       wheel: (delta: number) => {
         handleMouseWheel(delta);
       },
@@ -666,16 +666,15 @@ export default ({
     [selectionReason, engineAPI, onLayerEdit, onLayerVisibility, onLayerLoad, timelineManagerRef],
   );
 
-  const globe = cesium.current?.cesiumElement?.scene.globe;
-
   useEffect(() => {
+    const globe = cesium.current?.cesiumElement?.scene.globe;
     if (globe) {
       const surface = (globe as any)._surface as CustomGlobeSurface;
       if (surface) {
         surface.tileProvider._debug.wireframe = property?.debug?.showGlobeWireframe ?? false;
       }
     }
-  }, [globe, property?.debug?.showGlobeWireframe]);
+  }, [property?.debug?.showGlobeWireframe]);
 
   useEffect(() => {
     if (!time) return;

package/src/engines/Cesium/index.tsx

@@ -143,18 +143,18 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
       }}
       shadows={!!property?.scene?.shadow?.enabled}
       onClick={handleClick}
-      onDoubleClick={mouseEventHandles.doubleclick}
-      onMouseDown={mouseEventHandles.mousedown}
-      onMouseUp={mouseEventHandles.mouseup}
-      onRightClick={mouseEventHandles.rightclick}
-      onRightDown={mouseEventHandles.rightdown}
-      onRightUp={mouseEventHandles.rightup}
-      onMiddleClick={mouseEventHandles.middleclick}
-      onMiddleDown={mouseEventHandles.middledown}
-      onMiddleUp={mouseEventHandles.middleup}
-      onMouseMove={mouseEventHandles.mousemove}
-      onMouseEnter={mouseEventHandles.mouseenter}
-      onMouseLeave={mouseEventHandles.mouseleave}
+      onDoubleClick={mouseEventHandles.doubleClick}
+      onMouseDown={mouseEventHandles.mouseDown}
+      onMouseUp={mouseEventHandles.mouseUp}
+      onRightClick={mouseEventHandles.rightClick}
+      onRightDown={mouseEventHandles.rightDown}
+      onRightUp={mouseEventHandles.rightUp}
+      onMiddleClick={mouseEventHandles.middleClick}
+      onMiddleDown={mouseEventHandles.middleDown}
+      onMiddleUp={mouseEventHandles.middleUp}
+      onMouseMove={mouseEventHandles.mouseMove}
+      onMouseEnter={mouseEventHandles.mouseEnter}
+      onMouseLeave={mouseEventHandles.mouseLeave}
       onWheel={mouseEventHandles.wheel}>
       <Event onMount={handleMount} onUnmount={handleUnmount} />
       <Clock timelineManagerRef={timelineManagerRef} />