@vcmap/core 5.0.0-rc.3 → 5.0.0-rc.31

package/src/{vcs/vcm/maps/openlayers.js → map/openlayersMap.js}

@@ -1,13 +1,13 @@
-import { Math as CesiumMath } from '@vcmap/cesium';
+import { Math as CesiumMath } from '@vcmap-cesium/engine';
 import View from 'ol/View.js';
 import { getTransform } from 'ol/proj.js';
 import { inAndOut } from 'ol/easing.js';
 import { boundingExtent, containsXY } from 'ol/extent.js';
 import { parseBoolean } from '@vcsuite/parsers';
-import ViewPoint from '../util/viewpoint.js';
+import Viewpoint from '../util/viewpoint.js';
 import BaseOLMap from './baseOLMap.js';
-import VcsMap from './map.js';
-import { VcsClassRegistry } from '../classRegistry.js';
+import VcsMap from './vcsMap.js';
+import { mapClassRegistry } from '../classRegistry.js';
 
 /**
  * @typedef {VcsMapOptions} OpenlayersOptions
@@ -16,17 +16,18 @@ import { VcsClassRegistry } from '../classRegistry.js';
  */
 
 /**
- * Openlayers Map Class (2D map)
+ * OpenlayersMap Map Class (2D map)
  * @class
- * @export
  * @extends {BaseOLMap}
  * @api stable
  */
-class Openlayers extends BaseOLMap {
+class OpenlayersMap extends BaseOLMap {
   /**
    * @type {string}
    */
-  static get className() { return 'vcs.vcm.maps.Openlayers'; }
+  static get className() {
+    return 'OpenlayersMap';
+  }
 
   /**
    * @returns {OpenlayersOptions}
@@ -44,10 +45,13 @@ class Openlayers extends BaseOLMap {
   constructor(options) {
     super(options);
 
-    const defaultOptions = Openlayers.getDefaultOptions();
+    const defaultOptions = OpenlayersMap.getDefaultOptions();
 
     /** @type {boolean} */
-    this.fixedNorthOrientation = parseBoolean(options.fixedNorthOrientation, defaultOptions.fixedNorthOrientation);
+    this.fixedNorthOrientation = parseBoolean(
+      options.fixedNorthOrientation,
+      defaultOptions.fixedNorthOrientation,
+    );
   }
 
   /**
@@ -56,27 +60,29 @@ class Openlayers extends BaseOLMap {
   async initialize() {
     if (!this.initialized) {
       await super.initialize();
-      this.olMap.setView(new View({
-        center: [1230922.6203948376, 6350766.117974091],
-        zoom: 13,
-      }));
+      this.olMap.setView(
+        new View({
+          center: [1230922.6203948376, 6350766.117974091],
+          zoom: 13,
+        }),
+      );
       this.initialized = true;
     }
   }
 
   /**
    * @inheritDoc
-   * @returns {Promise<ViewPoint>}
+   * @returns {Promise<Viewpoint>}
    */
-  async getViewPoint() {
-    return this.getViewPointSync();
+  async getViewpoint() {
+    return this.getViewpointSync();
   }
 
   /**
    * @inheritDoc
-   * @returns {ViewPoint}
+   * @returns {Viewpoint}
    */
-  getViewPointSync() {
+  getViewpointSync() {
     const view = this.olMap.getView();
     const coord = view.getCenter();
     const toLatLon = getTransform(view.getProjection(), 'EPSG:4326');
@@ -87,20 +93,24 @@ class Openlayers extends BaseOLMap {
     size.width = viewport.offsetWidth || 1;
     const aspectRatio = size.width / size.height;
     const fovy = Math.atan(Math.tan(fov * 0.5) / aspectRatio) * 2.0;
-    const latlon = toLatLon(coord.slice(0, 2));
+    // error in TransformFunction type definition, remove undefined after openlayer fixed the type
+    const latlon = toLatLon(coord.slice(0, 2), undefined, undefined);
     const metersPerUnit = view.getProjection().getMetersPerUnit();
 
     const resolution = view.getResolution();
     const visibleMapUnits = resolution * size.height;
-    const relativeCircumference = Math.cos(Math.abs(CesiumMath.toRadians(latlon[1])));
-    const visibleMeters = visibleMapUnits * metersPerUnit * relativeCircumference;
-    const height = Math.abs((visibleMeters / 2) / Math.tan(fovy / 2));
+    const relativeCircumference = Math.cos(
+      Math.abs(CesiumMath.toRadians(latlon[1])),
+    );
+    const visibleMeters =
+      visibleMapUnits * metersPerUnit * relativeCircumference;
+    const height = Math.abs(visibleMeters / 2 / Math.tan(fovy / 2));
 
     const heading = -CesiumMath.toDegrees(view.getRotation());
     // don't add 0;
     const groundPosition = latlon; // .concat([0]);
     const pitch = -90;
-    return new ViewPoint({
+    return new Viewpoint({
       groundPosition,
       pitch,
       heading,
@@ -109,16 +119,17 @@ class Openlayers extends BaseOLMap {
   }
 
   /**
-   * @param {ViewPoint} viewpoint
+   * @param {Viewpoint} viewpoint
    * @returns {Promise<void>}
    * @inheritDoc
    */
-  gotoViewPoint(viewpoint) {
+  gotoViewpoint(viewpoint) {
     if (this.movementDisabled || !viewpoint.isValid()) {
       return Promise.resolve();
     }
+    let { heading } = viewpoint;
     if (this.fixedNorthOrientation) {
-      viewpoint.heading = 0;
+      heading = 0;
     }
     const view = this.olMap.getView();
     const fromLatLon = getTransform('EPSG:4326', view.getProjection());
@@ -129,7 +140,8 @@ class Openlayers extends BaseOLMap {
       coords = viewpoint.cameraPosition.slice(0, 2);
     }
     const { distance } = viewpoint;
-    const center = fromLatLon(coords);
+    // error in TransformFunction type definition, remove undefined after openlayer fixed the type
+    const center = fromLatLon(coords, undefined, undefined);
 
     const fov = Math.PI / 3.0;
     const viewport = this.olMap.getViewport();
@@ -140,30 +152,38 @@ class Openlayers extends BaseOLMap {
     const fovy = Math.atan(Math.tan(fov * 0.5) / aspectRatio) * 2.0;
     const visibleMeters = 2 * distance * Math.tan(fovy / 2);
     const metersPerUnit = view.getProjection().getMetersPerUnit();
-    const relativeCircumference = Math.cos(Math.abs(CesiumMath.toRadians(coords[1])));
-    const visibleMapUnits = visibleMeters / metersPerUnit / relativeCircumference;
+    const relativeCircumference = Math.cos(
+      Math.abs(CesiumMath.toRadians(coords[1])),
+    );
+    const visibleMapUnits =
+      visibleMeters / metersPerUnit / relativeCircumference;
 
     const resolution = visibleMapUnits / size.height;
 
     if (viewpoint.animate) {
       let rotation = 0;
-      if (!this.fixedNorthOrientation && viewpoint.heading != null) {
-        rotation = -CesiumMath.toRadians(viewpoint.heading);
+      if (!this.fixedNorthOrientation && heading != null) {
+        rotation = -CesiumMath.toRadians(heading);
       }
       return new Promise((resolve) => {
-        view.animate({
-          duration: viewpoint.duration ? viewpoint.duration * 1000 : 100,
-          center,
-          easing: inAndOut, // XXX map to viewpoint easingFunctionName?
-          resolution,
-          rotation,
-        }, () => { resolve(); });
+        view.animate(
+          {
+            duration: viewpoint.duration ? viewpoint.duration * 1000 : 100,
+            center,
+            easing: inAndOut, // XXX map to viewpoint easingFunctionName?
+            resolution,
+            rotation,
+          },
+          () => {
+            resolve();
+          },
+        );
       });
     } else {
       view.setCenter(center);
       view.setResolution(resolution);
-      if (!this.fixedNorthOrientation && viewpoint.heading != null) {
-        view.setRotation(-CesiumMath.toRadians(viewpoint.heading));
+      if (!this.fixedNorthOrientation && heading != null) {
+        view.setRotation(-CesiumMath.toRadians(heading));
       }
     }
     return Promise.resolve();
@@ -180,7 +200,11 @@ class Openlayers extends BaseOLMap {
     const toLatLon = getTransform(view.getProjection(), 'EPSG:4326');
     const topLeft = [extent[0], extent[3]];
     const bottomRight = [extent[2], extent[1]];
-    const bbox = [toLatLon(topLeft), toLatLon(bottomRight)];
+    // error in TransformFunction type definition, remove undefined after openlayer fixed the type
+    const bbox = [
+      toLatLon(topLeft, undefined, undefined),
+      toLatLon(bottomRight, undefined, undefined),
+    ];
 
     return containsXY(boundingExtent(bbox), coords[0], coords[1]);
   }
@@ -192,7 +216,7 @@ class Openlayers extends BaseOLMap {
   toJSON() {
     const config = /** @type {OpenlayersOptions} */ (super.toJSON());
 
-    const defaultOptions = Openlayers.getDefaultOptions();
+    const defaultOptions = OpenlayersMap.getDefaultOptions();
     if (this.fixedNorthOrientation !== defaultOptions.fixedNorthOrientation) {
       config.fixedNorthOrientation = this.fixedNorthOrientation;
     }
@@ -201,5 +225,5 @@ class Openlayers extends BaseOLMap {
   }
 }
 
-VcsClassRegistry.registerClass(Openlayers.className, Openlayers);
-export default Openlayers;
+mapClassRegistry.registerClass(OpenlayersMap.className, OpenlayersMap);
+export default OpenlayersMap;

package/src/{vcs/vcm/maps/map.js → map/vcsMap.js}

@@ -1,11 +1,11 @@
 import { v4 as uuidv4 } from 'uuid';
 import { check, checkMaybe } from '@vcsuite/check';
-import VcsObject from '../object.js';
+import VcsObject from '../vcsObject.js';
 import LayerCollection from '../util/layerCollection.js';
 import MapState from './mapState.js';
 import { vcsLayerName } from '../layer/layerSymbols.js';
-import VcsEvent from '../event/vcsEvent.js';
-import { VcsClassRegistry } from '../classRegistry.js';
+import VcsEvent from '../vcsEvent.js';
+import { mapClassRegistry } from '../classRegistry.js';
 
 /**
  * @namespace maps
@@ -31,6 +31,12 @@ import { VcsClassRegistry } from '../classRegistry.js';
  * @api stable
  */
 
+/**
+ * @typedef {Object} VcsMapRenderEvent
+ * @property {VcsMap} map
+ * @property {import("ol").MapEvent|CesiumMapEvent} originalEvent
+ */
+
 /**
  * @type {Object}
  */
@@ -44,9 +50,13 @@ const specificLayerImpl = {};
  * @api stable
  */
 class VcsMap extends VcsObject {
-  static get className() { return 'vcs.vcm.maps.VcsMap'; }
+  static get className() {
+    return 'VcsMap';
+  }
 
-  static get specificLayerImpl() { return specificLayerImpl; }
+  static get specificLayerImpl() {
+    return specificLayerImpl;
+  }
 
   /**
    * @returns {VcsMapOptions}
@@ -101,17 +111,9 @@ class VcsMap extends VcsObject {
      * @type {Array<Function>}
      * @private
      */
-    this._collectionListeners = [
-      this.layerCollection.moved.addEventListener((layer) => {
-        this.indexChanged(layer);
-      }),
-      this.layerCollection.added.addEventListener((layer) => {
-        this._layerAdded(layer);
-      }),
-      this.layerCollection.removed.addEventListener((layer) => {
-        this._layerRemoved(layer);
-      }),
-    ];
+    this._collectionListeners = [];
+
+    this._setLayerCollectionListeners();
 
     /** @type {boolean} */
     this.initialized = false;
@@ -131,7 +133,7 @@ class VcsMap extends VcsObject {
     this.fallbackMap = options.fallbackMap || null;
 
     /**
-     * @type {Map<string, Set<import("@vcmap/cesium").CustomDataSource|import("@vcmap/cesium").CzmlDataSource|import("@vcmap/cesium").PrimitiveCollection|import("@vcmap/cesium").Cesium3DTileset|import("@vcmap/cesium").ImageryLayer|import("ol/layer/Layer").default<import("ol/source").Source>>>}
+     * @type {Map<string, Set<import("@vcmap-cesium/engine").CustomDataSource|import("@vcmap-cesium/engine").CzmlDataSource|import("@vcmap-cesium/engine").PrimitiveCollection|import("@vcmap-cesium/engine").Cesium3DTileset|import("@vcmap-cesium/engine").ImageryLayer|import("ol/layer/Layer").default<import("ol/source").Source>>>}
      * @private
      */
     this._visualizations = new Map();
@@ -155,11 +157,15 @@ class VcsMap extends VcsObject {
      */
     this.pointerInteractionEvent = new VcsEvent();
     /**
-     * If present, the split screen to use on this map. Is set by the mapCollection
-     * @type {import("@vcmap/core").SplitScreen|null}
-     * @api
+     * The split position to use on this map. Is set by the mapCollection
+     * @type {number}
      */
-    this.splitScreen = null;
+    this._splitPosition = 0.5;
+    /**
+     * @type {VcsEvent<VcsMapRenderEvent>}
+     * @private
+     */
+    this._postRender = new VcsEvent();
   }
 
   /**
@@ -221,11 +227,63 @@ class VcsMap extends VcsObject {
         l.mapActivated(this);
       });
     }
+
+    this._setLayerCollectionListeners();
+  }
+
+  /**
+   * @type {number}
+   */
+  get splitPosition() {
+    return this._splitPosition;
+  }
+
+  /**
+   * The splitPosition should always be aligned with the mapCollection's splitPosition.
+   * Use mapCollection to change splitPosition.
+   * @param {number} position
+   */
+  set splitPosition(position) {
+    check(position, Number);
+    if (position < 0 || position > 1) {
+      throw new Error('Position must be between 0 and 1');
+    }
+    this._splitPosition = position;
+  }
+
+  /**
+   * An event raised on the maps post render
+   * @type {VcsEvent<VcsMapRenderEvent>}
+   * @readonly
+   */
+  get postRender() {
+    return this._postRender;
+  }
+
+  /**
+   * @private
+   */
+  _setLayerCollectionListeners() {
+    this._collectionListeners.forEach((cb) => {
+      cb();
+    });
+
+    this._collectionListeners = [
+      this.layerCollection.moved.addEventListener((layer) => {
+        this.indexChanged(layer);
+      }),
+      this.layerCollection.added.addEventListener((layer) => {
+        this._layerAdded(layer);
+      }),
+      this.layerCollection.removed.addEventListener((layer) => {
+        this._layerRemoved(layer);
+      }),
+    ];
   }
 
   /**
    * Determines whether this map can show this viewpoint. Returns true in any other map then {@link Oblique}
-   * @param {import("@vcmap/core").ViewPoint} viewpoint
+   * @param {import("@vcmap/core").Viewpoint} viewpoint
    * @returns {Promise<boolean>}
    * @api
    */
@@ -246,7 +304,8 @@ class VcsMap extends VcsObject {
       this._target.removeChild(this.mapElement);
     }
 
-    this._target = typeof target === 'string' ? document.getElementById(target) : target;
+    this._target =
+      typeof target === 'string' ? document.getElementById(target) : target;
     if (this._target) {
       this._target.appendChild(this.mapElement);
     }
@@ -288,7 +347,7 @@ class VcsMap extends VcsObject {
   /**
    * Validates a visualization. A visualization must have the vcsLayeName symbol set and a layer with said name must be
    * part of the maps layerCollection.
-   * @param {import("@vcmap/cesium").CustomDataSource|import("@vcmap/cesium").PrimitiveCollection|import("@vcmap/cesium").Cesium3DTileset|import("@vcmap/cesium").ImageryLayer|import("ol/layer/Layer").default<import("ol/source").Source>} item
+   * @param {import("@vcmap-cesium/engine").CustomDataSource|import("@vcmap-cesium/engine").PrimitiveCollection|import("@vcmap-cesium/engine").Cesium3DTileset|import("@vcmap-cesium/engine").ImageryLayer|import("ol/layer/Layer").default<import("ol/source").Source>} item
    * @returns {boolean}
    */
   validateVisualization(item) {
@@ -303,11 +362,13 @@ class VcsMap extends VcsObject {
 
   /**
    * Adds a visualization to the visualizations map for its layer. The visualization must be valid, use validateVisualization first
-   * @param {import("@vcmap/cesium").CustomDataSource|import("@vcmap/cesium").PrimitiveCollection|import("@vcmap/cesium").Cesium3DTileset|import("@vcmap/cesium").ImageryLayer|import("ol/layer/Layer").default<import("ol/source").Source>} item
+   * @param {import("@vcmap-cesium/engine").CustomDataSource|import("@vcmap-cesium/engine").PrimitiveCollection|import("@vcmap-cesium/engine").Cesium3DTileset|import("@vcmap-cesium/engine").ImageryLayer|import("ol/layer/Layer").default<import("ol/source").Source>} item
    */
   addVisualization(item) {
     if (!this.validateVisualization(item)) {
-      throw new Error('Visualization item is not valid, validate before adding');
+      throw new Error(
+        'Visualization item is not valid, validate before adding',
+      );
     }
     const layerName = item[vcsLayerName];
     if (!this._visualizations.has(layerName)) {
@@ -318,7 +379,7 @@ class VcsMap extends VcsObject {
 
   /**
    * Removes a visualization
-   * @param {import("@vcmap/cesium").PrimitiveCollection|import("@vcmap/cesium").Cesium3DTileset|import("@vcmap/cesium").ImageryLayer|import("ol/layer/Layer").default<import("ol/source").Source>|import("@vcmap/cesium").CustomDataSource} item
+   * @param {import("@vcmap-cesium/engine").PrimitiveCollection|import("@vcmap-cesium/engine").Cesium3DTileset|import("@vcmap-cesium/engine").ImageryLayer|import("ol/layer/Layer").default<import("ol/source").Source>|import("@vcmap-cesium/engine").CustomDataSource} item
    */
   removeVisualization(item) {
     const layerName = item[vcsLayerName];
@@ -334,7 +395,7 @@ class VcsMap extends VcsObject {
   /**
    * Gets the visualizations for a specific layer.
    * @param {import("@vcmap/core").Layer} layer
-   * @returns {Set<import("@vcmap/cesium").PrimitiveCollection|import("@vcmap/cesium").Cesium3DTileset|import("@vcmap/cesium").ImageryLayer|import("ol/layer/Layer").default<import("ol/source").Source>|import("@vcmap/cesium").CustomDataSource>}
+   * @returns {Set<import("@vcmap-cesium/engine").PrimitiveCollection|import("@vcmap-cesium/engine").Cesium3DTileset|import("@vcmap-cesium/engine").ImageryLayer|import("ol/layer/Layer").default<import("ol/source").Source>|import("@vcmap-cesium/engine").CustomDataSource>}
    * @api
    */
   getVisualizationsForLayer(layer) {
@@ -343,12 +404,12 @@ class VcsMap extends VcsObject {
 
   /**
    * Get all visualizations added to this map.
-   * @returns {Array<import("@vcmap/cesium").PrimitiveCollection|import("@vcmap/cesium").Cesium3DTileset|import("@vcmap/cesium").ImageryLayer|import("ol/layer/Layer").default<import("ol/source").Source>|import("@vcmap/cesium").CustomDataSource>}
+   * @returns {Array<import("@vcmap-cesium/engine").PrimitiveCollection|import("@vcmap-cesium/engine").Cesium3DTileset|import("@vcmap-cesium/engine").ImageryLayer|import("ol/layer/Layer").default<import("ol/source").Source>|import("@vcmap-cesium/engine").CustomDataSource>}
    * @api
    */
   getVisualizations() {
     return [...this._visualizations.values()]
-      .map(layerVisualizations => [...layerVisualizations])
+      .map((layerVisualizations) => [...layerVisualizations])
       .flat();
   }
 
@@ -368,7 +429,9 @@ class VcsMap extends VcsObject {
         return;
       }
       this._state = MapState.ACTIVE;
-      await Promise.all([...this.layerCollection].map(layer => layer.mapActivated(this)));
+      await Promise.all(
+        [...this.layerCollection].map((layer) => layer.mapActivated(this)),
+      );
       if (this._state !== MapState.ACTIVE) {
         return;
       }
@@ -392,7 +455,7 @@ class VcsMap extends VcsObject {
   }
 
   /**
-   * prevent all movement, including navigation controls, gotoViewPoint & setting of oblique images
+   * prevent all movement, including navigation controls, gotoViewpoint & setting of oblique images
    * @param {boolean} prevent
    * @api
    */
@@ -402,35 +465,35 @@ class VcsMap extends VcsObject {
 
   /**
    * sets the view to the given viewpoint
-   * @param {import("@vcmap/core").ViewPoint} viewpoint
+   * @param {import("@vcmap/core").Viewpoint} viewpoint
    * @param {number=} optMaximumHeight during animation (can be used to get rid of the bunny hop)
-   * gotoViewPoint
+   * gotoViewpoint
    * @returns {Promise<void>}
    * @api stable
    */
   // eslint-disable-next-line no-unused-vars,class-methods-use-this
-  gotoViewPoint(viewpoint, optMaximumHeight) {
+  gotoViewpoint(viewpoint, optMaximumHeight) {
     return Promise.resolve();
   }
 
   // eslint-disable-next-line jsdoc/require-returns-check
   /**
-   * Returns the most precise viewpoint possible in Oblique.
+   * Returns the most precise viewpoint possible in ObliqueMap.
    * @api
-   * @returns {Promise<import("@vcmap/core").ViewPoint|null>}
+   * @returns {Promise<import("@vcmap/core").Viewpoint|null>}
    */
   // eslint-disable-next-line class-methods-use-this
-  async getViewPoint() {
+  async getViewpoint() {
     return null;
   }
 
   /**
-   * Returns an approximate viewpoint in Oblique, not requesting terrain.
+   * Returns an approximate viewpoint in ObliqueMap, not requesting terrain.
    * @api
-   * @returns {import("@vcmap/core").ViewPoint|null}
+   * @returns {import("@vcmap/core").Viewpoint|null}
    */
   // eslint-disable-next-line class-methods-use-this
-  getViewPointSync() {
+  getViewpointSync() {
     return null;
   }
 
@@ -451,7 +514,9 @@ class VcsMap extends VcsObject {
    * @api
    */
   // eslint-disable-next-line no-unused-vars,class-methods-use-this
-  pointIsVisible(coords) { return false; }
+  pointIsVisible(coords) {
+    return false;
+  }
 
   /**
    * Requests this map to render when possible
@@ -486,16 +551,22 @@ class VcsMap extends VcsObject {
     }
     this._target = null;
 
-    this._collectionListeners.forEach((cb) => { cb(); });
+    this._collectionListeners.forEach((cb) => {
+      cb();
+    });
     this._collectionListeners = [];
 
-    [...this.layerCollection].forEach((l) => { l.removedFromMap(this); });
+    if (this.layerCollection) {
+      [...this.layerCollection].forEach((l) => {
+        l.removedFromMap(this);
+      });
+    }
     if (this.stateChanged) {
       this.stateChanged.destroy();
       this.stateChanged = null;
     }
 
-    if (this.destroyLayerCollection) {
+    if (this.destroyLayerCollection && this.layerCollection) {
       this.layerCollection.destroy();
     }
 
@@ -504,8 +575,9 @@ class VcsMap extends VcsObject {
       this.pointerInteractionEvent = null;
     }
     this._layerCollection = null;
+    this._postRender.destroy();
   }
 }
 
-VcsClassRegistry.registerClass(VcsMap.className, VcsMap);
+mapClassRegistry.registerClass(VcsMap.className, VcsMap);
 export default VcsMap;

package/src/oblique/defaultObliqueCollection.js

@@ -0,0 +1,62 @@
+import ObliqueCollection from './obliqueCollection.js';
+import ObliqueImage from './obliqueImage.js';
+import ObliqueImageMeta from './obliqueImageMeta.js';
+import { ObliqueViewDirection } from './obliqueViewDirection.js';
+import { mercatorProjection } from '../util/projection.js';
+
+const defaultMeta = new ObliqueImageMeta({
+  name: 'defaultObliqueMeta',
+  size: [512, 512],
+  tileSize: [512, 512],
+  tileResolution: [1],
+  projection: mercatorProjection,
+  format: 'png',
+  url: '',
+});
+
+/**
+ * @type {symbol}
+ * @private
+ */
+export const isDefaultImageSymbol = Symbol('isDefaultImage');
+
+/**
+ * This is a special oblique collection wich is shown, if no other oblique collection is set on an ObliqueMap map.
+ * It will render a single image which indicates that no images can be loaded.
+ * @class
+ * @extends {ObliqueCollection}
+ */
+class DefaultObliqueCollection extends ObliqueCollection {
+  constructor() {
+    super({});
+  }
+
+  /**
+   * @param {import("ol/coordinate").Coordinate} mercatorCoordinate
+   * @param {ObliqueViewDirection} viewDirection
+   * @returns {ObliqueImage}
+   */
+  // eslint-disable-next-line no-unused-vars
+  getImageForCoordinate(mercatorCoordinate, viewDirection) {
+    const groundCoordinates = [
+      [mercatorCoordinate[0] - 100, mercatorCoordinate[1] - 100, 0],
+      [mercatorCoordinate[0] + 100, mercatorCoordinate[1] - 100, 0],
+      [mercatorCoordinate[0] + 100, mercatorCoordinate[1] + 100, 0],
+      [mercatorCoordinate[0] - 100, mercatorCoordinate[1] + 100, 0],
+    ];
+
+    const image = new ObliqueImage({
+      meta: defaultMeta,
+      viewDirection: ObliqueViewDirection.NORTH,
+      viewDirectionAngle: 0,
+      name: this.name,
+      groundCoordinates,
+      centerPointOnGround: mercatorCoordinate,
+    });
+
+    image[isDefaultImageSymbol] = true;
+    return image;
+  }
+}
+
+export default DefaultObliqueCollection;