@vcmap/core 6.2.2 → 6.3.0-rc.1

package/src/panorama/panoramaImageView.ts

@@ -1,5 +1,15 @@
-import type { Camera, Primitive, Scene } from '@vcmap-cesium/engine';
-import { Cartesian2, Matrix4, Cartesian3 } from '@vcmap-cesium/engine';
+import type {
+  Camera,
+  PerspectiveFrustum,
+  Primitive,
+  Scene,
+} from '@vcmap-cesium/engine';
+import {
+  Cartesian2,
+  Matrix4,
+  Cartesian3,
+  Math as CesiumMath,
+} from '@vcmap-cesium/engine';
 import { getWidth } from 'ol/extent.js';
 import type { Size } from 'ol/size.js';
 import { getLogger } from '@vcsuite/logger';
@@ -26,6 +36,10 @@ export type PanoramaImageView = {
    * Suspends the loading of tiles. This is used as a debug feature.
    */
   suspendTileLoading: boolean;
+  /**
+   * The default field of view to set when a new image is loaded in radians.
+   */
+  defaultFov: number;
   /**
    * The primitive collection that contains the panorama tiles.
    */
@@ -369,8 +383,12 @@ function setupEmptyImageOverlay(container: HTMLElement): () => void {
  * to the panorama camera and updates the panorama tiles accordingly. Typically, you will not
  * have to create this directly, but rather use the PanoramaMap's imageView property.
  * @param map
+ * @param [initialFov=CesiumMath.PI_OVER_FOUR] The default field of view to set when a new image is loaded in radians
  */
-export function createPanoramaImageView(map: PanoramaMap): PanoramaImageView {
+export function createPanoramaImageView(
+  map: PanoramaMap,
+  initialFov = CesiumMath.PI_OVER_FOUR,
+): PanoramaImageView {
   const { scene } = map.getCesiumWidget();
   const primitiveCollection = scene.primitives.add(
     new PanoramaTilePrimitiveCollection({
@@ -382,6 +400,7 @@ export function createPanoramaImageView(map: PanoramaMap): PanoramaImageView {
   const defaultPosition = Cartesian3.fromDegrees(12, 53, 0);
 
   let currentView: ImageWrapper | undefined;
+  let defaultFov = initialFov;
   let removeOverlay: (() => void) | undefined;
   scene.camera.setView({
     destination: defaultPosition,
@@ -400,6 +419,7 @@ export function createPanoramaImageView(map: PanoramaMap): PanoramaImageView {
     if (image) {
       currentView = createImageWrapper(image, primitiveCollection, scene, map);
       currentView.suspendTileLoading = suspendTileLoading;
+      (scene.camera.frustum as PerspectiveFrustum).fov = defaultFov;
     } else {
       currentView = undefined;
       if (scene.canvas.parentElement) {
@@ -433,6 +453,12 @@ export function createPanoramaImageView(map: PanoramaMap): PanoramaImageView {
     get tilePrimitiveCollection(): PanoramaTilePrimitiveCollection {
       return primitiveCollection;
     },
+    get defaultFov(): number {
+      return defaultFov;
+    },
+    set defaultFov(value: number) {
+      defaultFov = value;
+    },
     render,
     destroy(): void {
       this.render = (): void => {};

package/src/panorama/panoramaTileMaterial.ts

@@ -52,6 +52,8 @@ export type PanoramaTileMaterialUniforms = {
   u_imageReady: boolean;
   u_intensityReady: boolean;
   u_cursorColor: Color;
+  u_contrast: number;
+  u_brightness: number;
 };
 
 function createDebugCanvas(tileSize: Size, text: string): HTMLCanvasElement {
@@ -100,6 +102,8 @@ export function getDefaultPanoramaTileMaterialUniforms(): PanoramaTileMaterialUn
     u_depthReady: false,
     u_overlayNaNColor: Color.RED,
     u_cursorColor: Color.fromCssColorString(defaultCursorColor),
+    u_contrast: 1,
+    u_brightness: 0,
   };
 }
 
@@ -205,6 +209,22 @@ export default class PanoramaTileMaterial extends Material {
     this.uniforms.u_opacity = value;
   }
 
+  get contrast(): number {
+    return this.uniforms.u_contrast;
+  }
+
+  set contrast(value: number) {
+    this.uniforms.u_contrast = value;
+  }
+
+  get brightness(): number {
+    return this.uniforms.u_brightness;
+  }
+
+  set brightness(value: number) {
+    this.uniforms.u_brightness = value;
+  }
+
   /**
    * The position of the cursor in the panorama tile. Internal API to render the depth cursor.
    * (-1, -1, -1) means no data is available.

package/src/panorama/panoramaTileMaterialFS.glsl

@@ -22,6 +22,8 @@
  * @uniform {bool} u_intensityReady - Flag indicating if intensity data is ready
  * @uniform {bool} u_depthReady - Flag indicating if depth data is ready
  * @uniform {vec4} u_overlayNaNColor - Color used for missing/NaN overlay values
+ * @uniform {float} u_brightness - Brightness adjustment
+ * @uniform {float} u_contrast - Contrast adjustment
  */
 
 #define OVERLAY_INTENSITY 1.0
@@ -92,7 +94,20 @@ czm_material czm_getMaterial(czm_materialInput materialInput)
     vec2 clamped_uv = clamp(materialInput.st, u_minUV, u_maxUV);
     vec2 scaled_uv = (clamped_uv - u_minUV) / (u_maxUV - u_minUV);
 
-    vec4 t_color = texture(u_rgb, scaled_uv);
+    vec4 t_color = czm_srgbToLinear(texture(u_rgb, scaled_uv));
+
+    if (u_brightness != 0.0)
+    {
+        t_color.rgb += u_brightness;
+    }
+
+    if (u_contrast != 1.0)
+    {
+        t_color.rgb = ((t_color.rgb - 0.5) * u_contrast) + 0.5;
+    }
+
+    clamp(t_color, 0.0, 1.0);
+
     if (u_intensityReady && u_overlay == OVERLAY_INTENSITY)
     {
         float inensity_value = get_texel_value(u_intensity, scaled_uv);

package/src/panorama/panoramaTilePrimitiveCollection.ts

@@ -28,6 +28,10 @@ export default class PanoramaTilePrimitiveCollection extends PrimitiveCollection
 
   private _cursorColor: Color = Color.fromCssColorString(defaultCursorColor);
 
+  private _contrast = 1.0;
+
+  private _brightness = 0.0;
+
   overlayChanged = new VcsEvent<PanoramaOverlayMode>();
 
   constructor(options?: ConstructorParameters<typeof PrimitiveCollection>[0]) {
@@ -104,6 +108,34 @@ export default class PanoramaTilePrimitiveCollection extends PrimitiveCollection
     }
   }
 
+  get contrast(): number {
+    return this._contrast;
+  }
+
+  set contrast(value: number) {
+    if (this._contrast !== value) {
+      this._contrast = value;
+      this._primitives.forEach((primitive) => {
+        (primitive.appearance.material as PanoramaTileMaterial).contrast =
+          value;
+      });
+    }
+  }
+
+  get brightness(): number {
+    return this._brightness;
+  }
+
+  set brightness(value: number) {
+    if (this._brightness !== value) {
+      this._brightness = value;
+      this._primitives.forEach((primitive) => {
+        (primitive.appearance.material as PanoramaTileMaterial).brightness =
+          value;
+      });
+    }
+  }
+
   get cursorPosition(): Cartesian3 {
     return this._cursorPosition;
   }
@@ -152,6 +184,8 @@ export default class PanoramaTilePrimitiveCollection extends PrimitiveCollection
     material.opacity = this.opacity;
     material.cursorPosition = this.cursorPosition;
     material.cursorColor = this.cursorColor;
+    material.brightness = this.brightness;
+    material.contrast = this.contrast;
 
     return super.add(primitive, index) as Primitive;
   }

package/src/util/clipping/clippingPolygonObject.ts

@@ -82,8 +82,8 @@ class ClippingPolygonObject extends VcsObject {
   terrainChanged = new VcsEvent<boolean>();
 
   constructor(options: ClippingPolygonObjectOptions) {
-    super(options);
     const defaultOptions = ClippingPolygonObject.getDefaultOptions();
+    super({ ...defaultOptions, ...options });
 
     this.activeOnStartup = parseBoolean(
       options.activeOnStartup,
@@ -190,12 +190,13 @@ class ClippingPolygonObject extends VcsObject {
     }
   }
 
-  toJSON(): ClippingPolygonObjectOptions {
+  toJSON(
+    defaultOptions = ClippingPolygonObject.getDefaultOptions(),
+  ): ClippingPolygonObjectOptions {
     const config: ClippingPolygonObjectOptions = {
-      ...super.toJSON(),
+      ...super.toJSON(defaultOptions),
       coordinates: structuredClone(this._coordinates),
     };
-    const defaultOptions = ClippingPolygonObject.getDefaultOptions();
 
     if (!deepEqual(this._layerNames, defaultOptions.layerNames)) {
       config.layerNames = getLayerNamesClone(this._layerNames);

package/src/util/displayQuality/displayQuality.ts

@@ -1,10 +1,10 @@
 import { check, oneOf } from '@vcsuite/check';
 import type VcsApp from '../../vcsApp.js';
 import FeatureStoreLayer from '../../layer/featureStoreLayer.js';
-import CesiumMap from '../../map/cesiumMap.js';
 import { isMobile } from '../isMobile.js';
 import CesiumTilesetLayer from '../../layer/cesiumTilesetLayer.js';
 import VcsEvent from '../../vcsEvent.js';
+import BaseCesiumMap from '../../map/baseCesiumMap.js';
 
 export enum DisplayQualityLevel {
   LOW = 'low',
@@ -104,7 +104,7 @@ class DisplayQuality {
     this._listeners = [
       this._app.maps.mapActivated.addEventListener(() => {
         if (
-          this._app.maps.activeMap instanceof CesiumMap &&
+          this._app.maps.activeMap instanceof BaseCesiumMap &&
           !this.currentQualityLevel
         ) {
           if (isMobile()) {
@@ -115,7 +115,7 @@ class DisplayQuality {
         }
       }),
       this._app.layers.stateChanged.addEventListener((layer) => {
-        if (layer.active && this._app.maps.activeMap instanceof CesiumMap) {
+        if (layer.active && this._app.maps.activeMap instanceof BaseCesiumMap) {
           this._setLayerQuality(layer.name);
         }
       }),
@@ -222,7 +222,7 @@ class DisplayQuality {
       ),
     );
 
-    if (!(this._app.maps.activeMap instanceof CesiumMap)) {
+    if (!(this._app.maps.activeMap instanceof BaseCesiumMap)) {
       this._currentQualityLevel = undefined;
       this._viewModelSettings.startingQualityLevel = level;
       this._viewModelSettings.startingMobileQualityLevel = level;

package/src/util/editor/createFeatureSession.ts

@@ -126,7 +126,7 @@ function startCreateFeatureSession<T extends GeometryType>(
     interactionChain,
     removed: interactionRemoved,
     destroy: destroyInteractionChain,
-  } = setupInteractionChain(app.maps.eventHandler);
+  } = setupInteractionChain(app.maps);
   const { layer: scratchLayer, destroy: destroyScratchLayer } =
     setupScratchLayer(app.layers, app.maps.eventHandler.featureInteraction);
 
@@ -340,6 +340,7 @@ function startCreateFeatureSession<T extends GeometryType>(
   if (app.maps.target) {
     app.maps.target.style.cursor = cursorMap.edit;
   }
+  app.maps.pausePanoramaImageSelection = true;
 
   const stop = (): void => {
     isStopped = true; // setting stopped true immediately, to prevent the recreation of the interaction chain on finished
@@ -348,6 +349,8 @@ function startCreateFeatureSession<T extends GeometryType>(
     if (app.maps.target) {
       app.maps.target.style.cursor = cursorMap.auto;
     }
+    app.maps.pausePanoramaImageSelection = false;
+
     mapChangedListener();
     obliqueImageChangedListener();
     if (currentInteraction) {

package/src/util/editor/editFeaturesSession.ts

@@ -39,6 +39,7 @@ import type VcsApp from '../../vcsApp.js';
 import type VectorLayer from '../../layer/vectorLayer.js';
 import type VcsMap from '../../map/vcsMap.js';
 import RightClickInteraction from './interactions/rightClickInteraction.js';
+import BaseCesiumMap from '../../map/baseCesiumMap.js';
 
 /**
  * Saves the original allowPicking settings and sets them to false if CTRL is not pressed.
@@ -189,7 +190,7 @@ function startEditFeaturesSession(
     interactionChain,
     removed: interactionRemoved,
     destroy: destroyInteractionChain,
-  } = setupInteractionChain(app.maps.eventHandler, interactionId);
+  } = setupInteractionChain(app.maps, interactionId);
 
   const { exclusiveInteractionId } = app.maps.eventHandler;
   const removeRightClickStart = app.maps.eventHandler.addExclusiveInteraction(
@@ -328,7 +329,9 @@ function startEditFeaturesSession(
 
   const createTransformations = (): void => {
     destroyTransformation();
-
+    const currentEnsurePositionActive =
+      app.maps.eventHandler.ensurePositionInteraction.active;
+    app.maps.eventHandler.ensurePositionInteraction.setActive(false);
     transformationHandler = createTransformationHandler(
       app.maps.activeMap!,
       layer,
@@ -374,6 +377,9 @@ function startEditFeaturesSession(
     interactionChain.addInteraction(interaction);
 
     destroyTransformation = (): void => {
+      app.maps.eventHandler.ensurePositionInteraction.setActive(
+        currentEnsurePositionActive,
+      );
       interactionChain.removeInteraction(interaction);
       interaction.destroy();
       transformationHandler?.destroy();
@@ -410,7 +416,10 @@ function startEditFeaturesSession(
     } else {
       obliqueImageChangedListener = (): void => {};
     }
-    if (mode === TransformationMode.EXTRUDE && !(map instanceof CesiumMap)) {
+    if (
+      mode === TransformationMode.EXTRUDE &&
+      !(map instanceof BaseCesiumMap)
+    ) {
       setMode(TransformationMode.TRANSLATE);
     } else {
       createTransformations();
@@ -432,7 +441,7 @@ function startEditFeaturesSession(
   };
 
   const originalCreateSyncMap = new Map<string | number, boolean>();
-
+  app.maps.pausePanoramaImageSelection = true;
   const stop = (): void => {
     destroyTransformation();
     destroyInteractionChain();
@@ -440,6 +449,7 @@ function startEditFeaturesSession(
     mapChangedListener();
     modifierChangedListener();
     unByKey(featureListeners);
+    app.maps.pausePanoramaImageSelection = false;
     currentFeatures.forEach((feature) => {
       clearAllowPicking(feature, allowPickingMap);
       clearCreateSync(feature, originalCreateSyncMap);

package/src/util/editor/editGeometrySession.ts

@@ -456,7 +456,7 @@ function startEditGeometrySession(
     interactionChain,
     removed: interactionRemoved,
     destroy: destroyInteractionChain,
-  } = setupInteractionChain(app.maps.eventHandler, interactionId);
+  } = setupInteractionChain(app.maps, interactionId);
 
   const { layer: scratchLayer, destroy: destroyScratchLayer } =
     setupScratchLayer(app.layers, app.maps.eventHandler.featureInteraction);
@@ -617,6 +617,7 @@ function startEditGeometrySession(
   const mapActivatedListener =
     app.maps.mapActivated.addEventListener(setupActiveMap);
   setupActiveMap();
+  app.maps.pausePanoramaImageSelection = true;
 
   const stop = (): void => {
     destroyScratchLayer();
@@ -624,6 +625,7 @@ function startEditGeometrySession(
       unByKey(featureListener);
     }
     mapActivatedListener();
+    app.maps.pausePanoramaImageSelection = false;
     mapInteractionController.reset();
     mouseOverInteraction.reset();
     destroyCurrentInteractionSet();

package/src/util/editor/editorSessionHelpers.ts

@@ -10,10 +10,10 @@ import type LayerCollection from '../layerCollection.js';
 import { maxZIndex } from '../layerCollection.js';
 import { markVolatile } from '../../vcsModule.js';
 import { PrimitiveOptionsType } from '../../layer/vectorProperties.js';
-import type EventHandler from '../../interaction/eventHandler.js';
 import type VcsApp from '../../vcsApp.js';
 import type { InteractionEvent } from '../../interaction/abstractInteraction.js';
 import type FeatureAtPixelInteraction from '../../interaction/featureAtPixelInteraction.js';
+import type MapCollection from '../mapCollection.js';
 
 export const alreadySnapped = Symbol('alreadySnapped');
 
@@ -50,6 +50,7 @@ export function setupScratchLayer(
 ): { layer: VectorLayer; destroy: () => void } {
   // IDEA pass in stopped and cleanup ourselves?
   const layer = new VectorLayer({
+    ignoreMapLayerTypes: true,
     projection: mercatorProjection.toJSON(),
     vectorProperties: {
       altitudeMode: 'clampToGround',
@@ -110,18 +111,19 @@ export function setupScratchLayer(
  * Sets up the default interaction chain for the editors. This will set the provided event handlers
  * feature interaction to be active on CLICKMOVE & DRAGSTART. Destroying the setup will reset the interaction
  * to its previous active state.
- * @param  eventHandler
+ * @param  maps
  * @param  [interactionId]
  * @private
  */
 export function setupInteractionChain(
-  eventHandler: EventHandler,
+  maps: MapCollection,
   interactionId?: string,
 ): {
   interactionChain: InteractionChain;
   removed: VcsEvent<void>;
   destroy(this: void): void;
 } {
+  const { eventHandler } = maps;
   const interactionChain = new InteractionChain();
   const removed = new VcsEvent<void>();
   const listener = eventHandler.addExclusiveInteraction(

package/src/util/editor/interactions/creationSnapping.ts

@@ -19,6 +19,7 @@ import type VectorLayer from '../../../layer/vectorLayer.js';
 import { validityPlaceholder } from './createPolygonInteraction.js';
 import type { SnappingInteractionEvent } from '../editorSessionHelpers.js';
 import { alreadySnapped } from '../editorSessionHelpers.js';
+import PanoramaMap from '../../../map/panoramaMap.js';
 
 function getBearings(coordinates: Coordinate[]): number[] {
   // we dont want to take into account the last bearing, since that would be our own
@@ -143,9 +144,14 @@ export default class CreationSnapping extends AbstractInteraction {
         this._coordinatesDirty = true;
       });
     }
+
+    const ctrlKey = event.key === ModificationKeyType.CTRL;
+    const useSnapping =
+      event.map.className === PanoramaMap.className ? ctrlKey : !ctrlKey;
+
     if (
       !event[alreadySnapped] &&
-      event.key !== ModificationKeyType.CTRL &&
+      useSnapping &&
       this._coordinates.length >= 3
     ) {
       const results = new Array<SnapResult | undefined>(2);

package/src/util/editor/interactions/ensureHandlerSelectionInteraction.ts

@@ -4,7 +4,7 @@ import type { EventAfterEventHandler } from '../../../interaction/abstractIntera
 import AbstractInteraction from '../../../interaction/abstractInteraction.js';
 import { EventType } from '../../../interaction/interactionType.js';
 import { handlerSymbol } from '../editorSymbols.js';
-import CesiumMap from '../../../map/cesiumMap.js';
+import BaseCesiumMap from '../../../map/baseCesiumMap.js';
 
 /**
  * This interaction ensure a potential handler is dragged in 3D when it is obscured by a transparent feature.
@@ -28,7 +28,7 @@ class EnsureHandlerSelectionInteraction extends AbstractInteraction {
       event.feature &&
       this._featureSelection.length > 0 &&
       !(event.feature as Feature)[handlerSymbol] &&
-      event.map instanceof CesiumMap
+      event.map instanceof BaseCesiumMap
     ) {
       const scene = event.map.getScene() as Scene;
       const drillPicks = scene.drillPick(

package/src/util/editor/interactions/layerSnapping.ts

@@ -16,6 +16,7 @@ import {
   setSnappingFeatures,
   getGeometrySnapResult,
 } from '../snappingHelpers.js';
+import PanoramaMap from '../../../map/panoramaMap.js';
 
 export default class LayerSnapping extends AbstractInteraction {
   private _removeFeatures: (() => void) | undefined;
@@ -59,7 +60,12 @@ export default class LayerSnapping extends AbstractInteraction {
 
   pipe(event: SnappingInteractionEvent): Promise<SnappingInteractionEvent> {
     this._removeFeatures?.();
-    if (event.key !== ModificationKeyType.CTRL) {
+
+    const ctrlKey = event.key === ModificationKeyType.CTRL;
+    const useSnapping =
+      event.map.className === PanoramaMap.className ? ctrlKey : !ctrlKey;
+
+    if (useSnapping) {
       const coordinate = event.positionOrPixel!;
       const bufferDistance = event.map.getCurrentResolution(coordinate) * 12;
       const maxDistanceSquared = bufferDistance ** 2;

package/src/util/editor/interactions/mapInteractionController.ts

@@ -9,7 +9,8 @@ import { handlerSymbol, vertexSymbol } from '../editorSymbols.js';
 import type { EventAfterEventHandler } from '../../../interaction/abstractInteraction.js';
 import AbstractInteraction from '../../../interaction/abstractInteraction.js';
 import type BaseOLMap from '../../../map/baseOLMap.js';
-import type CesiumMap from '../../../map/cesiumMap.js';
+import CesiumMap from '../../../map/cesiumMap.js';
+import PanoramaMap from '../../../map/panoramaMap.js';
 
 function suspendOpenlayerMap(map: BaseOLMap): () => void {
   const dragPan = map
@@ -26,6 +27,13 @@ function suspendOpenlayerMap(map: BaseOLMap): () => void {
   return () => {};
 }
 
+function suspendPanoramaMap(map: PanoramaMap): () => void {
+  map.panoramaCameraController.enabled = false;
+  return () => {
+    map.panoramaCameraController.enabled = true;
+  };
+}
+
 type CachedScreenSpaceCameraControllerKeys =
   | 'lookEventTypes'
   | 'tiltEventTypes'
@@ -99,8 +107,10 @@ class MapInteractionController extends AbstractInteraction {
       ((event.feature as Feature)[vertexSymbol] ||
         (event.feature as Feature)[handlerSymbol])
     ) {
-      if (event.map.className === 'CesiumMap') {
+      if (event.map.className === CesiumMap.className) {
         this._clear = suspendCesiumMap(event.map as CesiumMap);
+      } else if (event.map.className === PanoramaMap.className) {
+        this._clear = suspendPanoramaMap(event.map as PanoramaMap);
       } else {
         this._clear = suspendOpenlayerMap(event.map as BaseOLMap);
       }

package/src/util/editor/interactions/translationSnapping.ts

@@ -19,6 +19,7 @@ import { vertexIndexSymbol } from '../editorSymbols.js';
 import { isVertex } from '../editorHelpers.js';
 import type { SnappingInteractionEvent } from '../editorSessionHelpers.js';
 import { alreadySnapped } from '../editorSessionHelpers.js';
+import PanoramaMap from '../../../map/panoramaMap.js';
 
 function getBearings(coordinates: Coordinate[], isPolygon: boolean): number[] {
   const length = isPolygon ? coordinates.length : coordinates.length - 1;
@@ -141,13 +142,14 @@ export default class TranslationSnapping extends AbstractInteraction {
       return Promise.resolve(event);
     }
 
+    const ctrlKey = event.key === ModificationKeyType.CTRL;
+    const useSnapping =
+      event.map.className === PanoramaMap.className ? ctrlKey : !ctrlKey;
+
     if (event.type === EventType.DRAGEND && this._lastCoordinate) {
       event.positionOrPixel = this._lastCoordinate;
       this._lastCoordinate = undefined;
-    } else if (
-      event.key !== ModificationKeyType.CTRL &&
-      isVertex(event.feature)
-    ) {
+    } else if (useSnapping && isVertex(event.feature)) {
       const index = event.feature[vertexIndexSymbol];
       if (event.type === EventType.DRAGSTART) {
         this._setCoordinates(index);

package/src/util/editor/selectFeaturesSession.ts

@@ -160,7 +160,7 @@ function startSelectFeaturesSession(
     interactionChain,
     removed: interactionRemoved,
     destroy: destroyInteractionChain,
-  } = setupInteractionChain(app.maps.eventHandler, interactionId);
+  } = setupInteractionChain(app.maps, interactionId);
 
   const highlightManager = createHighlightManager(layer, highlightStyle);
 

package/src/util/editor/transformation/create3DHandlers.ts

@@ -35,7 +35,7 @@ import {
 } from './transformationTypes.js';
 import Projection from '../../projection.js';
 import { mercatorToCartesian } from '../../math.js';
-import type CesiumMap from '../../../map/cesiumMap.js';
+import type BaseCesiumMap from '../../../map/baseCesiumMap.js';
 
 function setFeatureOnPrimitive(primitive: Primitive): void {
   if (primitive[handlerSymbol]) {
@@ -545,7 +545,7 @@ function createShowShadowPrimitive(
  * @param  mode
  */
 export default function create3DHandlers(
-  map: CesiumMap,
+  map: BaseCesiumMap,
   mode: TransformationMode,
 ): Handlers {
   const primitiveCollection = new PrimitiveCollection();

package/src/util/editor/transformation/transformationHandler.ts

@@ -8,7 +8,6 @@ import {
 } from 'ol/extent.js';
 import { HeightReference } from '@vcmap-cesium/engine';
 import Extent3D from '../../featureconverter/extent3D.js';
-import CesiumMap from '../../../map/cesiumMap.js';
 import BaseOLMap from '../../../map/baseOLMap.js';
 import create3DHandlers from './create3DHandlers.js';
 import create2DHandlers from './create2DHandlers.js';
@@ -28,6 +27,7 @@ import {
 } from '../../featureconverter/vectorHeightInfo.js';
 import { mercatorToCartographic } from '../../math.js';
 import { is2DLayout } from '../../geometryHelpers.js';
+import BaseCesiumMap from '../../../map/baseCesiumMap.js';
 
 type FeatureCenterInfo = {
   center: Coordinate;
@@ -126,7 +126,7 @@ export default function createTransformationHandler(
   let handlerFeatures: Handlers;
   let center: Coordinate = [0, 0, 0];
   let getCenterFromFeatures: (features: Feature[]) => FeatureCenterInfo;
-  let cesiumMap: CesiumMap | null = null;
+  let cesiumMap: BaseCesiumMap | null = null;
 
   const setFeatures = (features: Feature[]): void => {
     const show = features.length > 0;
@@ -168,13 +168,15 @@ export default function createTransformationHandler(
     }
   };
 
-  if (map instanceof CesiumMap) {
+  if (map instanceof BaseCesiumMap) {
     handlerFeatures = create3DHandlers(map, mode);
     getCenterFromFeatures = getCenterFromFeatures3D.bind(null, layer, mode);
     cesiumMap = map;
   } else if (map instanceof BaseOLMap) {
     handlerFeatures = create2DHandlers(map, scratchLayer, mode);
     getCenterFromFeatures = getCenterFromFeatures2D;
+  } else {
+    throw new Error('unsupported map type for transformation handler');
   }
 
   return {

package/src/util/editor/transformation/translateInteraction.ts

@@ -17,7 +17,7 @@ import Projection, { mercatorProjection } from '../../projection.js';
 import { cartographicToWgs84, mercatorToCartesian } from '../../math.js';
 import type { TransformationHandler } from './transformationTypes.js';
 import { AxisAndPlanes, is1DAxis, is2DAxis } from './transformationTypes.js';
-import CesiumMap from '../../../map/cesiumMap.js';
+import BaseCesiumMap from '../../../map/baseCesiumMap.js';
 
 /**
  * Of type [dx, dy, dz];
@@ -66,7 +66,7 @@ class TranslateInteraction extends AbstractInteraction {
       const axis = (event.feature as Feature)[handlerSymbol] as AxisAndPlanes;
       if (axis !== AxisAndPlanes.NONE) {
         this._transformationHandler!.showAxis = axis;
-        if (event.map instanceof CesiumMap) {
+        if (event.map instanceof BaseCesiumMap) {
           if (is1DAxis(axis)) {
             this._getTranslateEvent = this._dragAlongAxis3D(axis, event);
           } else if (is2DAxis(axis)) {
@@ -86,7 +86,7 @@ class TranslateInteraction extends AbstractInteraction {
     axis: AxisAndPlanes,
     event: EventAfterEventHandler,
   ): GetTranslateEvent {
-    const scene = (event.map as CesiumMap).getScene() as Scene;
+    const scene = (event.map as BaseCesiumMap).getScene() as Scene;
     if (axis !== AxisAndPlanes.Z) {
       const center = mercatorToCartesian(this._transformationHandler!.center);
       let plane = Plane.clone(Plane.ORIGIN_XY_PLANE);
@@ -147,7 +147,7 @@ class TranslateInteraction extends AbstractInteraction {
     axis: AxisAndPlanes,
     event: EventAfterEventHandler,
   ): GetTranslateEvent {
-    const scene = (event.map as CesiumMap).getScene() as Scene;
+    const scene = (event.map as BaseCesiumMap).getScene() as Scene;
     const center = mercatorToCartesian(this._transformationHandler!.center);
     let plane: Plane;
     if (axis === AxisAndPlanes.YZ) {