chore(web): add flyToBBox (#865)

reearth · Jan 10, 2024 · 76ada0e · 76ada0e
1 parent a16870e
commit 76ada0e
Show file tree

Hide file tree

Showing 7 changed files with 53 additions and 0 deletions.
diff --git a/web/src/beta/lib/core/Crust/Plugins/api.ts b/web/src/beta/lib/core/Crust/Plugins/api.ts
@@ -435,6 +435,7 @@ export function commonReearth({
   isPositionVisible,
   setView,
   toWindowPosition,
+  flyToBBox,
   enableScreenSpaceCameraController,
   lookHorizontal,
   lookVertical,
@@ -489,6 +490,7 @@ export function commonReearth({
   isPositionVisible: GlobalThis["reearth"]["scene"]["isPositionVisible"];
   setView: GlobalThis["reearth"]["camera"]["setView"];
   toWindowPosition: GlobalThis["reearth"]["scene"]["toWindowPosition"];
+  flyToBBox: GlobalThis["reearth"]["camera"]["flyToBBox"];
   inEditor: () => GlobalThis["reearth"]["scene"]["inEditor"];
   built: () => GlobalThis["reearth"]["scene"]["built"];
   enableScreenSpaceCameraController: GlobalThis["reearth"]["camera"]["enableScreenSpaceController"];
@@ -537,6 +539,7 @@ export function commonReearth({
         moveOverTerrain,
         flyToGround,
         setView,
+        flyToBBox,
       },
       get property() {
         return sceneProperty?.();
@@ -601,6 +604,7 @@ export function commonReearth({
       moveOverTerrain,
       flyToGround,
       setView,
+      flyToBBox,
     },
     layers: {
       get layersInViewport() {

diff --git a/web/src/beta/lib/core/Crust/Plugins/hooks.ts b/web/src/beta/lib/core/Crust/Plugins/hooks.ts
@@ -295,6 +295,16 @@ export default function ({
     [engineRef],
   );
 
+  const flyToBBox = useCallback(
+    (
+      bbox: [number, number, number, number],
+      options?: CameraOptions & { heading?: number; pitch?: number; range?: number },
+    ) => {
+      return engineRef?.flyToBBox(bbox, options);
+    },
+    [engineRef],
+  );
+
   const enableScreenSpaceCameraController = useCallback(
     (enabled: boolean) => engineRef?.enableScreenSpaceCameraController(enabled),
     [engineRef],
@@ -466,6 +476,7 @@ export default function ({
         overrideSceneProperty: overrideScenePropertyCommon,
         layersInViewport,
         flyTo,
+        flyToBBox,
         lookAt,
         zoomIn,
         zoomOut,
@@ -529,6 +540,7 @@ export default function ({
       overrideScenePropertyCommon,
       layersInViewport,
       flyTo,
+      flyToBBox,
       lookAt,
       zoomIn,
       zoomOut,

diff --git a/web/src/beta/lib/core/Crust/Plugins/plugin_types.ts b/web/src/beta/lib/core/Crust/Plugins/plugin_types.ts
@@ -172,6 +172,10 @@ export type Camera = {
   readonly zoomOut: (amount: number, options?: CameraOptions) => void;
   /** Moves the camera position to the specified destination. */
   readonly flyTo: (destination: string | FlyToDestination, options?: CameraOptions) => void;
+  readonly flyToBBox: (
+    bbox: [number, number, number, number],
+    options?: CameraOptions & { heading?: number; pitch?: number; range?: number },
+  ) => void;
   /** Moves the camera position to look at the specified destination. */
   readonly lookAt: (destination: LookAtDestination, options?: CameraOptions) => void;
   /** Rotate the camera around the center of earth. */

diff --git a/web/src/beta/lib/core/Crust/Plugins/storybook.tsx b/web/src/beta/lib/core/Crust/Plugins/storybook.tsx
@@ -136,6 +136,7 @@ export const context: Context = {
       getFovInfo: act("getFovInfo"),
       enableScreenSpaceController: act("enableScreenSpaceController"),
       flyTo: act("flyTo"),
+      flyToBBox: act("flyToBBox"),
       lookAt: act("lookAt"),
       zoomIn: act("zoomIn"),
       zoomOut: act("zoomOut"),

diff --git a/web/src/beta/lib/core/Map/ref.ts b/web/src/beta/lib/core/Map/ref.ts
@@ -31,6 +31,7 @@ const engineRefKeys: FunctionKeys<EngineRef> = {
   setView: 1,
   toWindowPosition: 1,
   getViewport: 1,
+  flyToBBox: 1,
   lookAt: 1,
   lookAtLayer: 1,
   lookHorizontal: 1,

diff --git a/web/src/beta/lib/core/Map/types/index.ts b/web/src/beta/lib/core/Map/types/index.ts
@@ -97,6 +97,10 @@ export type EngineRef = {
     position: [x: number, y: number, z: number],
   ) => [x: number, y: number] | undefined;
   flyTo: FlyTo;
+  flyToBBox: (
+    bbox: [number, number, number, number],
+    options?: CameraOptions & { heading?: number; pitch?: number; range?: number },
+  ) => void;
   lookAt: (destination: LookAtDestination, options?: CameraOptions) => void;
   lookAtLayer: (layerId: string) => void;
   zoomIn: (amount: number, options?: CameraOptions) => void;

diff --git a/web/src/beta/lib/core/engines/Cesium/useEngineRef.ts b/web/src/beta/lib/core/engines/Cesium/useEngineRef.ts
@@ -338,6 +338,33 @@ export default function useEngineRef(
           }
         }
       },
+      flyToBBox: (bbox, options) => {
+        const viewer = cesium.current?.cesiumElement;
+        if (!viewer || viewer.isDestroyed()) return;
+
+        cancelCameraFlight.current?.();
+
+        const boundingSphere = Cesium.BoundingSphere.fromRectangle3D(
+          Cesium.Rectangle.fromDegrees(...bbox),
+        );
+
+        const camera = viewer.scene.camera;
+
+        viewer.camera.flyToBoundingSphere(boundingSphere, {
+          offset: {
+            heading: options?.heading
+              ? CesiumMath.toDegrees(options.heading)
+              : viewer.scene.camera.heading,
+            pitch: options?.pitch ? CesiumMath.toDegrees(options.pitch) : camera.pitch,
+            range: options?.range ?? 0,
+          },
+          duration: options?.duration,
+        });
+
+        cancelCameraFlight.current = () => {
+          camera?.cancelFlight();
+        };
+      },
       lookAt: (camera, options) => {
         const viewer = cesium.current?.cesiumElement;
         if (!viewer || viewer.isDestroyed()) return;