3dtiles-inspector 0.2.4 → 0.2.6

package/CHANGELOG.md

@@ -6,6 +6,19 @@ The format is based on Keep a Changelog and this project follows Semantic Versio
 
 ## [Unreleased]
 
+## [0.2.6] - 2026-05-05
+
+### Added
+
+- Added realtime `camerapose` URL synchronization so shared viewer URLs can restore the current camera pose.
+
+## [0.2.5] - 2026-05-05
+
+### Fixed
+
+- Fixed coordinate move actions leaving the camera at the previous view by flying back to the relocated tileset after the root transform is moved.
+- Fixed near-linear fly-to paths snapping to the start direction instead of interpolating toward the destination.
+
 ## [0.2.4] - 2026-05-04
 
 ### Added

package/dist/inspector-assets/viewer/app.js

@@ -67762,7 +67762,12 @@ function getFlyToPosition(flight, t2) {
     }
     _flyDirection.copy(_flyDirectionStart).applyAxisAngle(_flyAxis, angle * t2).normalize();
   } else {
-    _flyDirection.copy(_flyDirectionStart);
+    _flyDirection.lerpVectors(_flyDirectionStart, _flyDirectionEnd, t2);
+    if (_flyDirection.lengthSq() < 1e-12) {
+      _flyDirection.copy(_flyDirectionEnd);
+    } else {
+      _flyDirection.normalize();
+    }
   }
   const radius = MathUtils.lerp(startLength, endLength, t2) + Math.sin(Math.PI * t2) * arcHeight;
   return _flyDirection.multiplyScalar(radius);
@@ -68034,11 +68039,7 @@ function getCenterModeHeadingPitchRollForward(heading, pitch) {
   const sinPitch = Math.sin(pitch);
   const cosHeading = Math.cos(heading);
   const sinHeading = Math.sin(heading);
-  _flyForward.set(
-    sinHeading * cosPitch,
-    cosHeading * cosPitch,
-    sinPitch
-  );
+  _flyForward.set(sinHeading * cosPitch, cosHeading * cosPitch, sinPitch);
   return _flyForward.normalize();
 }
 function getHeadingPitchRollBasis(referencePoint, heading, pitch, roll) {
@@ -68130,11 +68131,7 @@ var init_cameraFlyTo = __esm({
     _flyReferenceUp = new Vector3();
     _flyReferenceRight = new Vector3();
     _flyQuaternion = new Quaternion();
-    _ellipsoidRadii = new Vector3(
-      6378137,
-      6378137,
-      6356752314245179e-9
-    );
+    _ellipsoidRadii = new Vector3(6378137, 6378137, 6356752314245179e-9);
     _oneOverRadiiSquared = new Vector3(
       1 / (_ellipsoidRadii.x * _ellipsoidRadii.x),
       1 / (_ellipsoidRadii.y * _ellipsoidRadii.y),
@@ -68248,6 +68245,10 @@ function createFlyToController({
     }
     return true;
   }
+  function cancelCameraFlight() {
+    activeCameraFlight = null;
+    activeCameraFlightStatus = "";
+  }
   async function applyTilesSetPositionFromPointerEvent(event) {
     const coordinate = pickCoordinateFromPointerEvent(event);
     if (!coordinate) {
@@ -68312,6 +68313,7 @@ function createFlyToController({
   }
   return {
     applyTilesSetPositionFromPointerEvent,
+    cancelCameraFlight,
     frameTileset,
     getActiveEllipsoid,
     moveCameraToCoordinate,
@@ -68328,6 +68330,148 @@ var init_flyTo = __esm({
   }
 });
 
+// src/viewer/navigation/cameraUrlPose.js
+function formatPoseNumber(value) {
+  const fixed = value.toFixed(9);
+  const trimmed = fixed.replace(/(\.\d*?[1-9])0+$/, "$1").replace(/\.0+$/, "");
+  return trimmed === "-0" ? "0" : trimmed;
+}
+function serializeCameraPose(camera) {
+  camera.updateMatrixWorld(true);
+  const values = [
+    camera.position.x,
+    camera.position.y,
+    camera.position.z,
+    camera.quaternion.x,
+    camera.quaternion.y,
+    camera.quaternion.z,
+    camera.quaternion.w
+  ];
+  if (camera.isOrthographicCamera) {
+    values.push(camera.zoom);
+  }
+  if (!values.every(Number.isFinite)) {
+    return null;
+  }
+  return values.map(formatPoseNumber).join(CAMERA_POSE_VALUE_SEPARATOR);
+}
+function getCameraPoseParam(url) {
+  return url.searchParams.get(CAMERA_POSE_PARAM) ?? url.searchParams.get(CAMERA_POSE_ALIAS_PARAM);
+}
+function parseCameraPose(value) {
+  if (typeof value !== "string" || value.trim().length === 0) {
+    return null;
+  }
+  const parts = value.trim().split(/[,_\s]+/).filter(Boolean);
+  if (parts.length !== CAMERA_POSE_COMPONENT_COUNT && parts.length !== CAMERA_POSE_COMPONENT_COUNT_WITH_ZOOM) {
+    return null;
+  }
+  const values = parts.map(Number);
+  if (!values.every(Number.isFinite)) {
+    return null;
+  }
+  const quaternionLength = Math.hypot(
+    values[3],
+    values[4],
+    values[5],
+    values[6]
+  );
+  if (quaternionLength <= 1e-12) {
+    return null;
+  }
+  const zoom = values.length === CAMERA_POSE_COMPONENT_COUNT_WITH_ZOOM ? values[7] : null;
+  if (zoom !== null && zoom <= 0) {
+    return null;
+  }
+  return {
+    position: values.slice(0, 3),
+    quaternion: values.slice(3, 7),
+    zoom
+  };
+}
+function replaceCameraPoseUrl(serializedPose) {
+  const url = new URL(window.location.href);
+  url.searchParams.delete(CAMERA_POSE_ALIAS_PARAM);
+  url.searchParams.set(CAMERA_POSE_PARAM, serializedPose);
+  window.history.replaceState(window.history.state, "", url.href);
+}
+function getInvalidCameraPoseMessage() {
+  return "Invalid camerapose URL parameter ignored. Expected x_y_z_qx_qy_qz_qw.";
+}
+function createCameraUrlPoseController({
+  camera,
+  cameraController,
+  setStatus
+}) {
+  let lastSerializedPose = null;
+  let lastUrlWriteTime = 0;
+  function applyPose(pose) {
+    camera.position.fromArray(pose.position);
+    camera.quaternion.fromArray(pose.quaternion).normalize();
+    if (pose.zoom !== null && camera.isOrthographicCamera) {
+      camera.zoom = Math.max(pose.zoom, 1e-6);
+      camera.updateProjectionMatrix();
+    }
+    camera.updateMatrixWorld(true);
+    cameraController.setCamera(camera);
+  }
+  function applyFromUrl({ showStatus = false } = {}) {
+    const url = new URL(window.location.href);
+    const value = getCameraPoseParam(url);
+    if (value === null) {
+      return false;
+    }
+    const pose = parseCameraPose(value);
+    if (!pose) {
+      if (showStatus && setStatus) {
+        setStatus(getInvalidCameraPoseMessage(), true);
+      }
+      return false;
+    }
+    applyPose(pose);
+    lastSerializedPose = serializeCameraPose(camera);
+    lastUrlWriteTime = performance.now();
+    if (lastSerializedPose) {
+      replaceCameraPoseUrl(lastSerializedPose);
+    }
+    if (showStatus && setStatus) {
+      setStatus("Applied camera pose from URL.");
+    }
+    return true;
+  }
+  function flush() {
+    const serializedPose = serializeCameraPose(camera);
+    if (!serializedPose || serializedPose === lastSerializedPose) {
+      return;
+    }
+    replaceCameraPoseUrl(serializedPose);
+    lastSerializedPose = serializedPose;
+    lastUrlWriteTime = performance.now();
+  }
+  function update(time = performance.now()) {
+    if (time - lastUrlWriteTime < CAMERA_POSE_UPDATE_INTERVAL_MS) {
+      return;
+    }
+    flush();
+  }
+  return {
+    applyFromUrl,
+    flush,
+    update
+  };
+}
+var CAMERA_POSE_PARAM, CAMERA_POSE_ALIAS_PARAM, CAMERA_POSE_COMPONENT_COUNT, CAMERA_POSE_COMPONENT_COUNT_WITH_ZOOM, CAMERA_POSE_UPDATE_INTERVAL_MS, CAMERA_POSE_VALUE_SEPARATOR;
+var init_cameraUrlPose = __esm({
+  "src/viewer/navigation/cameraUrlPose.js"() {
+    CAMERA_POSE_PARAM = "camerapose";
+    CAMERA_POSE_ALIAS_PARAM = "cameraPose";
+    CAMERA_POSE_COMPONENT_COUNT = 7;
+    CAMERA_POSE_COMPONENT_COUNT_WITH_ZOOM = 8;
+    CAMERA_POSE_UPDATE_INTERVAL_MS = 100;
+    CAMERA_POSE_VALUE_SEPARATOR = "_";
+  }
+});
+
 // src/viewer/screenSelection/state.js
 function clamp3(value, min, max) {
   return Math.min(max, Math.max(min, value));
@@ -71055,6 +71199,7 @@ var require_app = __commonJS({
     init_shutdown();
     init_setPositionController();
     init_flyTo();
+    init_cameraUrlPose();
     init_cropController();
     init_rootTransformController();
     init_transformModeController();
@@ -71259,6 +71404,14 @@ var require_app = __commonJS({
       getTiles: () => tiles,
       getTilesetBoundingSphere
     });
+    var cameraUrlPose = createCameraUrlPoseController({
+      camera,
+      cameraController,
+      setStatus
+    });
+    var appliedInitialCameraPose = cameraUrlPose.applyFromUrl({
+      showStatus: true
+    });
     setPositionController = createSetPositionController({
       cameraController,
       maxClickDistanceSq: SET_POSITION_CLICK_MAX_DISTANCE_SQ,
@@ -71378,6 +71531,7 @@ var require_app = __commonJS({
           coordinate.longitude,
           coordinate.height
         );
+        flyTo2.moveCameraToTiles();
         setStatus(
           "Moved tileset root to the specified coordinate using ENU orientation. Click Save to persist."
         );
@@ -71561,10 +71715,19 @@ var require_app = __commonJS({
       renderer,
       setStatus
     });
-    loadTileset(TILESET_URL);
+    window.addEventListener("popstate", () => {
+      if (cameraUrlPose.applyFromUrl({ showStatus: true })) {
+        flyTo2.cancelCameraFlight();
+        cancelPositionPickModes();
+      }
+    });
+    window.addEventListener("pagehide", cameraUrlPose.flush);
+    cameraController.addEventListener("finish", cameraUrlPose.flush);
+    loadTileset(TILESET_URL, { frameOnLoad: !appliedInitialCameraPose });
     function frame() {
       cameraController.update();
       flyTo2.update();
+      cameraUrlPose.update();
       rootTransform.flush();
       globeController.update();
       tiles?.update();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "3dtiles-inspector",
-  "version": "0.2.4",
+  "version": "0.2.6",
   "description": "Inspect, align, and save local 3D Tiles root transforms in an interactive browser session.",
   "author": "William Liu <lyz15972107087@gmail.com>",
   "license": "Apache-2.0",

package/src/viewer/app.js

@@ -17,6 +17,7 @@ import { bindViewerEvents } from './dom/events.js';
 import { createViewerShutdownRequester } from './io/shutdown.js';
 import { createSetPositionController } from './io/setPositionController.js';
 import { createFlyToController } from './navigation/flyTo.js';
+import { createCameraUrlPoseController } from './navigation/cameraUrlPose.js';
 import { createCropController } from './screenSelection/cropController.js';
 import { createRootTransformController } from './transform/rootTransformController.js';
 import { createTransformModeController } from './transform/transformModeController.js';
@@ -269,6 +270,15 @@ const flyTo = createFlyToController({
   getTilesetBoundingSphere,
 });
 
+const cameraUrlPose = createCameraUrlPoseController({
+  camera,
+  cameraController,
+  setStatus,
+});
+const appliedInitialCameraPose = cameraUrlPose.applyFromUrl({
+  showStatus: true,
+});
+
 setPositionController = createSetPositionController({
   cameraController,
   maxClickDistanceSq: SET_POSITION_CLICK_MAX_DISTANCE_SQ,
@@ -308,7 +318,8 @@ cropController = createCropController({
   transformControls,
   viewerElements,
   cancelOtherPositionPickModes: () => setPositionController.cancelMode(),
-  getCurrentRootTransformArray: () => rootTransform.getCurrentRootTransformArray(),
+  getCurrentRootTransformArray: () =>
+    rootTransform.getCurrentRootTransformArray(),
   getTilesetBoundingSphere,
 });
 
@@ -402,6 +413,7 @@ async function moveTilesToCoordinate() {
       coordinate.longitude,
       coordinate.height,
     );
+    flyTo.moveCameraToTiles();
     setStatus(
       'Moved tileset root to the specified coordinate using ENU orientation. Click Save to persist.',
     );
@@ -510,7 +522,8 @@ async function saveTransform() {
   );
 
   const currentMatrix = rootTransform.getCurrentMatrix();
-  const incrementalMatrix = rootTransform.getIncrementalSinceSaved(currentMatrix);
+  const incrementalMatrix =
+    rootTransform.getIncrementalSinceSaved(currentMatrix);
   const saveState = geometricError.getSaveState();
   let unlockSaveUi = true;
 
@@ -602,11 +615,21 @@ bindViewerEvents({
   setStatus,
 });
 
-loadTileset(TILESET_URL);
+window.addEventListener('popstate', () => {
+  if (cameraUrlPose.applyFromUrl({ showStatus: true })) {
+    flyTo.cancelCameraFlight();
+    cancelPositionPickModes();
+  }
+});
+window.addEventListener('pagehide', cameraUrlPose.flush);
+cameraController.addEventListener('finish', cameraUrlPose.flush);
+
+loadTileset(TILESET_URL, { frameOnLoad: !appliedInitialCameraPose });
 
 function frame() {
   cameraController.update();
   flyTo.update();
+  cameraUrlPose.update();
   rootTransform.flush();
   globeController.update();
   tiles?.update();

package/src/viewer/navigation/cameraFlyTo.js

@@ -30,11 +30,7 @@ const _flyCameraRight = new Vector3();
 const _flyReferenceUp = new Vector3();
 const _flyReferenceRight = new Vector3();
 const _flyQuaternion = new Quaternion();
-const _ellipsoidRadii = new Vector3(
-  6378137.0,
-  6378137.0,
-  6356752.3142451793,
-);
+const _ellipsoidRadii = new Vector3(6378137.0, 6378137.0, 6356752.3142451793);
 const _oneOverRadiiSquared = new Vector3(
   1 / (_ellipsoidRadii.x * _ellipsoidRadii.x),
   1 / (_ellipsoidRadii.y * _ellipsoidRadii.y),
@@ -72,12 +68,7 @@ function eastNorthUpToFixedFrame(origin) {
   );
 }
 
-export function createCameraFlight(
-  camera,
-  position,
-  target,
-  options = {},
-) {
+export function createCameraFlight(camera, position, target, options = {}) {
   const duration = options.duration ?? 2500;
   const endPosition = position.clone();
   const endQuaternion = getEndQuaternion(endPosition, target, options);
@@ -98,11 +89,7 @@ export function createCameraFlight(
   });
 }
 
-export function createCameraPoseFlight(
-  camera,
-  position,
-  options,
-) {
+export function createCameraPoseFlight(camera, position, options) {
   const duration = options.duration ?? 2500;
   const endPosition = position.clone();
   const endQuaternion = getHeadingPitchRollQuaternion(
@@ -165,11 +152,7 @@ export function getFlyToParamsFromBoundingSphere(
   };
 }
 
-export function flyTo(
-  camera,
-  flight,
-  time,
-) {
+export function flyTo(camera, flight, time) {
   if (flight.startTime === null) {
     flight.startTime = time;
   }
@@ -227,7 +210,12 @@ function getFlyToPosition(flight, t) {
       .applyAxisAngle(_flyAxis, angle * t)
       .normalize();
   } else {
-    _flyDirection.copy(_flyDirectionStart);
+    _flyDirection.lerpVectors(_flyDirectionStart, _flyDirectionEnd, t);
+    if (_flyDirection.lengthSq() < 1e-12) {
+      _flyDirection.copy(_flyDirectionEnd);
+    } else {
+      _flyDirection.normalize();
+    }
   }
 
   const radius =
@@ -236,11 +224,7 @@ function getFlyToPosition(flight, t) {
   return _flyDirection.multiplyScalar(radius);
 }
 
-function getUprightInterpolatedQuaternion(
-  flight,
-  position,
-  t,
-) {
+function getUprightInterpolatedQuaternion(flight, position, t) {
   const heading = lerpAngle(flight.startHeading, flight.endHeading, t);
   const pitch = MathUtils.lerp(flight.startPitch, flight.endPitch, t);
   return getHeadingPitchRollQuaternion(position, heading, pitch, 0);
@@ -366,10 +350,7 @@ function getForwardFromQuaternion(quaternion, target) {
   return target.set(0, 0, -1).applyQuaternion(quaternion).normalize();
 }
 
-function getUprightHeadingPitchAtPose(
-  position,
-  quaternion,
-) {
+function getUprightHeadingPitchAtPose(position, quaternion) {
   if (isCenterModePosition(position)) {
     const forward = getForwardFromQuaternion(quaternion, _flyForward);
     _flyCameraRight.set(1, 0, 0).applyQuaternion(quaternion);
@@ -489,11 +470,7 @@ function getRollAtPose(position, quaternion) {
   );
 }
 
-function getEndQuaternion(
-  position,
-  target,
-  options,
-) {
+function getEndQuaternion(position, target, options) {
   const { heading, pitch, roll } = options;
   if (heading === undefined && pitch === undefined && roll === undefined) {
     return getLookAtQuaternion(position, target);
@@ -516,12 +493,7 @@ function getEndQuaternion(
   );
 }
 
-function getBoundingSphereFlyToPosition(
-  camera,
-  target,
-  range,
-  options,
-) {
+function getBoundingSphereFlyToPosition(camera, target, range, options) {
   const { heading, pitch } = options;
   if (heading === undefined && pitch === undefined) {
     const direction =
@@ -554,12 +526,7 @@ function getBoundingSphereFlyToPosition(
   return _flyDirection.copy(target).addScaledVector(forward, -range);
 }
 
-function getHeadingPitchRollQuaternion(
-  referencePoint,
-  heading,
-  pitch,
-  roll,
-) {
+function getHeadingPitchRollQuaternion(referencePoint, heading, pitch, roll) {
   if (isCenterModePosition(referencePoint)) {
     getCenterModeHeadingPitchRollBasis(heading, pitch, roll);
     _matrix1.makeBasis(_flyRight, _flyUp, _flyBackward);
@@ -575,11 +542,7 @@ function getHeadingPitchRollQuaternion(
   return new Quaternion().setFromRotationMatrix(_matrix1);
 }
 
-function getHeadingPitchRollForward(
-  referencePoint,
-  heading,
-  pitch,
-) {
+function getHeadingPitchRollForward(referencePoint, heading, pitch) {
   if (isCenterModePosition(referencePoint)) {
     return getCenterModeHeadingPitchRollForward(heading, pitch);
   }
@@ -604,30 +567,18 @@ function getHeadingPitchRollForward(
   return _flyForward;
 }
 
-function getCenterModeHeadingPitchRollForward(
-  heading,
-  pitch,
-) {
+function getCenterModeHeadingPitchRollForward(heading, pitch) {
   const cosPitch = Math.cos(pitch);
   const sinPitch = Math.sin(pitch);
   const cosHeading = Math.cos(heading);
   const sinHeading = Math.sin(heading);
 
-  _flyForward.set(
-    sinHeading * cosPitch,
-    cosHeading * cosPitch,
-    sinPitch,
-  );
+  _flyForward.set(sinHeading * cosPitch, cosHeading * cosPitch, sinPitch);
 
   return _flyForward.normalize();
 }
 
-function getHeadingPitchRollBasis(
-  referencePoint,
-  heading,
-  pitch,
-  roll,
-) {
+function getHeadingPitchRollBasis(referencePoint, heading, pitch, roll) {
   if (isCenterModePosition(referencePoint)) {
     getCenterModeHeadingPitchRollBasis(heading, pitch, roll);
     return;
@@ -650,11 +601,7 @@ function getHeadingPitchRollBasis(
   _flyBackward.copy(_flyForward).negate();
 }
 
-function getCenterModeHeadingPitchRollBasis(
-  heading,
-  pitch,
-  roll,
-) {
+function getCenterModeHeadingPitchRollBasis(heading, pitch, roll) {
   getCenterModeHeadingPitchRollForward(heading, pitch);
 
   _flyRight
@@ -683,13 +630,7 @@ function isCenterModePosition(position) {
   return position.lengthSq() <= CAMERA_CENTER_MODE_DISTANCE_SQ;
 }
 
-function getReferenceBasis(
-  forward,
-  east,
-  up,
-  rightTarget,
-  upTarget,
-) {
+function getReferenceBasis(forward, east, up, rightTarget, upTarget) {
   rightTarget.crossVectors(forward, up);
   if (rightTarget.lengthSq() < 1e-6) {
     rightTarget.copy(east).projectOnPlane(forward);
@@ -712,12 +653,7 @@ function lerpAngle(start, end, t) {
   return start + delta * t;
 }
 
-function applyFlyToPose(
-  camera,
-  position,
-  quaternion,
-  zoom = null,
-) {
+function applyFlyToPose(camera, position, quaternion, zoom = null) {
   camera.position.copy(position);
   camera.quaternion.copy(quaternion);
 

package/src/viewer/navigation/cameraUrlPose.js

@@ -0,0 +1,172 @@
+const CAMERA_POSE_PARAM = 'camerapose';
+const CAMERA_POSE_ALIAS_PARAM = 'cameraPose';
+const CAMERA_POSE_COMPONENT_COUNT = 7;
+const CAMERA_POSE_COMPONENT_COUNT_WITH_ZOOM = 8;
+const CAMERA_POSE_UPDATE_INTERVAL_MS = 100;
+const CAMERA_POSE_VALUE_SEPARATOR = '_';
+
+function formatPoseNumber(value) {
+  const fixed = value.toFixed(9);
+  const trimmed = fixed
+    .replace(/(\.\d*?[1-9])0+$/, '$1')
+    .replace(/\.0+$/, '');
+
+  return trimmed === '-0' ? '0' : trimmed;
+}
+
+function serializeCameraPose(camera) {
+  camera.updateMatrixWorld(true);
+
+  const values = [
+    camera.position.x,
+    camera.position.y,
+    camera.position.z,
+    camera.quaternion.x,
+    camera.quaternion.y,
+    camera.quaternion.z,
+    camera.quaternion.w,
+  ];
+
+  if (camera.isOrthographicCamera) {
+    values.push(camera.zoom);
+  }
+
+  if (!values.every(Number.isFinite)) {
+    return null;
+  }
+
+  return values.map(formatPoseNumber).join(CAMERA_POSE_VALUE_SEPARATOR);
+}
+
+function getCameraPoseParam(url) {
+  return (
+    url.searchParams.get(CAMERA_POSE_PARAM) ??
+    url.searchParams.get(CAMERA_POSE_ALIAS_PARAM)
+  );
+}
+
+function parseCameraPose(value) {
+  if (typeof value !== 'string' || value.trim().length === 0) {
+    return null;
+  }
+
+  const parts = value.trim().split(/[,_\s]+/).filter(Boolean);
+  if (
+    parts.length !== CAMERA_POSE_COMPONENT_COUNT &&
+    parts.length !== CAMERA_POSE_COMPONENT_COUNT_WITH_ZOOM
+  ) {
+    return null;
+  }
+
+  const values = parts.map(Number);
+  if (!values.every(Number.isFinite)) {
+    return null;
+  }
+
+  const quaternionLength = Math.hypot(
+    values[3],
+    values[4],
+    values[5],
+    values[6],
+  );
+  if (quaternionLength <= 1e-12) {
+    return null;
+  }
+
+  const zoom = values.length === CAMERA_POSE_COMPONENT_COUNT_WITH_ZOOM
+    ? values[7]
+    : null;
+  if (zoom !== null && zoom <= 0) {
+    return null;
+  }
+
+  return {
+    position: values.slice(0, 3),
+    quaternion: values.slice(3, 7),
+    zoom,
+  };
+}
+
+function replaceCameraPoseUrl(serializedPose) {
+  const url = new URL(window.location.href);
+  url.searchParams.delete(CAMERA_POSE_ALIAS_PARAM);
+  url.searchParams.set(CAMERA_POSE_PARAM, serializedPose);
+  window.history.replaceState(window.history.state, '', url.href);
+}
+
+function getInvalidCameraPoseMessage() {
+  return 'Invalid camerapose URL parameter ignored. Expected x_y_z_qx_qy_qz_qw.';
+}
+
+export function createCameraUrlPoseController({
+  camera,
+  cameraController,
+  setStatus,
+}) {
+  let lastSerializedPose = null;
+  let lastUrlWriteTime = 0;
+
+  function applyPose(pose) {
+    camera.position.fromArray(pose.position);
+    camera.quaternion.fromArray(pose.quaternion).normalize();
+
+    if (pose.zoom !== null && camera.isOrthographicCamera) {
+      camera.zoom = Math.max(pose.zoom, 1e-6);
+      camera.updateProjectionMatrix();
+    }
+
+    camera.updateMatrixWorld(true);
+    cameraController.setCamera(camera);
+  }
+
+  function applyFromUrl({ showStatus = false } = {}) {
+    const url = new URL(window.location.href);
+    const value = getCameraPoseParam(url);
+    if (value === null) {
+      return false;
+    }
+
+    const pose = parseCameraPose(value);
+    if (!pose) {
+      if (showStatus && setStatus) {
+        setStatus(getInvalidCameraPoseMessage(), true);
+      }
+      return false;
+    }
+
+    applyPose(pose);
+    lastSerializedPose = serializeCameraPose(camera);
+    lastUrlWriteTime = performance.now();
+    if (lastSerializedPose) {
+      replaceCameraPoseUrl(lastSerializedPose);
+    }
+    if (showStatus && setStatus) {
+      setStatus('Applied camera pose from URL.');
+    }
+    return true;
+  }
+
+  function flush() {
+    const serializedPose = serializeCameraPose(camera);
+    if (!serializedPose || serializedPose === lastSerializedPose) {
+      return;
+    }
+
+    replaceCameraPoseUrl(serializedPose);
+    lastSerializedPose = serializedPose;
+    lastUrlWriteTime = performance.now();
+  }
+
+  function update(time = performance.now()) {
+    if (time - lastUrlWriteTime < CAMERA_POSE_UPDATE_INTERVAL_MS) {
+      return;
+    }
+    flush();
+  }
+
+  return {
+    applyFromUrl,
+    flush,
+    update,
+  };
+}

package/src/viewer/navigation/flyTo.js

@@ -133,6 +133,11 @@ export function createFlyToController({
     return true;
   }
 
+  function cancelCameraFlight() {
+    activeCameraFlight = null;
+    activeCameraFlightStatus = '';
+  }
+
   async function applyTilesSetPositionFromPointerEvent(event) {
     const coordinate = pickCoordinateFromPointerEvent(event);
     if (!coordinate) {
@@ -204,6 +209,7 @@ export function createFlyToController({
 
   return {
     applyTilesSetPositionFromPointerEvent,
+    cancelCameraFlight,
     frameTileset,
     getActiveEllipsoid,
     moveCameraToCoordinate,