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

package/src/util/editor/editorHelpers.js

@@ -0,0 +1,300 @@
+import Point from 'ol/geom/Point.js';
+import Feature from 'ol/Feature.js';
+import {
+  Cartesian2,
+  Cartesian3,
+  Math as CesiumMath,
+  Plane,
+  Ray,
+  IntersectionTests,
+  Cartographic,
+  HeightReference,
+} from '@vcmap-cesium/engine';
+
+import { mercatorToCartesian } from '../math.js';
+import { getFlatCoordinatesFromGeometry } from '../geometryHelpers.js';
+import CesiumMap from '../../map/cesiumMap.js';
+import { vertexSymbol } from './editorSymbols.js';
+import Vector from '../../layer/vectorLayer.js';
+import { createSync } from '../../layer/vectorSymbols.js';
+
+/**
+ * @param {import("ol/coordinate").Coordinate} coordinate
+ * @returns {Vertex}
+ */
+export function createVertex(coordinate) {
+  const geometry = new Point(coordinate);
+  geometry[Vector.alreadyTransformedToImage] = true;
+  const vertex = new Feature({
+    geometry,
+  });
+  vertex[vertexSymbol] = true;
+  vertex[Vector.doNotTransform] = true;
+  vertex[createSync] = true;
+  return vertex;
+}
+
+let scratchCartesian21 = new Cartesian2();
+let scratchCartesian22 = new Cartesian2();
+let scratchCartesian23 = new Cartesian2();
+let scratchCartesian31 = new Cartesian3();
+let scratchCartesian32 = new Cartesian3();
+let scratchCartesian33 = new Cartesian3();
+
+/**
+ * Returns the closest point on a 2D line. the Z index is taken from the point.
+ * @param {import("ol/coordinate").Coordinate} start - line segment start
+ * @param {import("ol/coordinate").Coordinate} end - line segment end
+ * @param {import("ol/coordinate").Coordinate} point - point to project
+ * @returns {!import("ol/coordinate").Coordinate}
+ */
+export function getClosestPointOn2DLine(start, end, point) {
+  scratchCartesian21 = Cartesian2.fromElements(
+    end[0] - start[0],
+    end[1] - start[1],
+    scratchCartesian21,
+  );
+  if (scratchCartesian21.equals(Cartesian2.ZERO)) {
+    scratchCartesian21 = Cartesian2.fromElements(1, 1, scratchCartesian21);
+  }
+  scratchCartesian21 = Cartesian2.normalize(
+    scratchCartesian21,
+    scratchCartesian21,
+  );
+  scratchCartesian22 = Cartesian2.fromElements(
+    point[0] - start[0],
+    point[1] - start[1],
+    scratchCartesian22,
+  );
+  const lambda = Cartesian2.dot(scratchCartesian21, scratchCartesian22);
+  scratchCartesian21 = Cartesian2.multiplyByScalar(
+    scratchCartesian21,
+    lambda,
+    scratchCartesian21,
+  );
+  return [
+    scratchCartesian21.x + start[0],
+    scratchCartesian21.y + start[1],
+    point[2],
+  ];
+}
+
+/**
+ * @param {import("ol/coordinate").Coordinate} start - line segment start
+ * @param {import("ol/coordinate").Coordinate} end - line segment end
+ * @param {import("ol/coordinate").Coordinate} point - the point to project
+ * @param {number=} epsilon
+ * @returns {boolean}
+ */
+export function pointOnLine3D(start, end, point, epsilon) {
+  scratchCartesian31 = Cartesian3.fromElements(
+    end[0] - start[0],
+    end[1] - start[1],
+    end[2] - start[2],
+    scratchCartesian31,
+  );
+  scratchCartesian32 = Cartesian3.fromElements(
+    point[0] - start[0],
+    point[1] - start[1],
+    point[2] - start[2],
+    scratchCartesian32,
+  );
+  scratchCartesian33 = Cartesian3.fromElements(
+    point[0] - end[0],
+    point[1] - end[1],
+    point[2] - point[2],
+    scratchCartesian33,
+  );
+  const mag1 = Cartesian3.magnitude(scratchCartesian31);
+  if (
+    mag1 < Cartesian3.magnitude(scratchCartesian32) ||
+    mag1 < Cartesian3.magnitude(scratchCartesian33)
+  ) {
+    return false;
+  }
+
+  scratchCartesian31 = Cartesian3.normalize(
+    scratchCartesian31,
+    scratchCartesian31,
+  );
+  scratchCartesian32 = Cartesian3.normalize(
+    scratchCartesian32,
+    scratchCartesian32,
+  );
+  return scratchCartesian31.equalsEpsilon(
+    scratchCartesian32,
+    epsilon || CesiumMath.EPSILON5,
+  );
+}
+
+/**
+ * @param {import("ol/coordinate").Coordinate} start - line segment start
+ * @param {import("ol/coordinate").Coordinate} end - line segment end
+ * @param {import("ol/coordinate").Coordinate} point - the point to project
+ * @param {number=} epsilon
+ * @returns {boolean}
+ */
+export function pointOnLine2D(start, end, point, epsilon) {
+  scratchCartesian21 = Cartesian2.fromElements(
+    end[0] - start[0],
+    end[1] - start[1],
+    scratchCartesian21,
+  );
+  scratchCartesian22 = Cartesian2.fromElements(
+    point[0] - start[0],
+    point[1] - start[1],
+    scratchCartesian22,
+  );
+  scratchCartesian23 = Cartesian2.fromElements(
+    point[0] - end[0],
+    point[1] - end[1],
+    scratchCartesian23,
+  );
+  const mag1 = Cartesian2.magnitude(scratchCartesian21);
+  if (
+    mag1 < Cartesian2.magnitude(scratchCartesian22) ||
+    mag1 < Cartesian2.magnitude(scratchCartesian23)
+  ) {
+    return false;
+  }
+
+  scratchCartesian21 = Cartesian2.normalize(
+    scratchCartesian21,
+    scratchCartesian21,
+  );
+  scratchCartesian22 = Cartesian2.normalize(
+    scratchCartesian22,
+    scratchCartesian22,
+  );
+
+  return scratchCartesian21.equalsEpsilon(
+    scratchCartesian22,
+    epsilon || CesiumMath.EPSILON5,
+  );
+}
+
+/**
+ * @param {import("ol/coordinate").Coordinate} originCoordinates
+ * @param {import("@vcmap-cesium/engine").Scene} scene
+ * @returns {!import("@vcmap-cesium/engine").Plane}
+ */
+export function createCameraVerticalPlane(originCoordinates, scene) {
+  scratchCartesian31 = mercatorToCartesian(
+    originCoordinates,
+    scratchCartesian31,
+  );
+  scratchCartesian32 = scene.globe.ellipsoid.geodeticSurfaceNormal(
+    scratchCartesian31,
+    scratchCartesian32,
+  );
+  scratchCartesian32 = Cartesian3.cross(
+    scene.camera.rightWC,
+    scratchCartesian32,
+    scratchCartesian32,
+  );
+  scratchCartesian32 = Cartesian3.normalize(
+    scratchCartesian32,
+    scratchCartesian32,
+  );
+
+  return Plane.fromPointNormal(scratchCartesian31, scratchCartesian32);
+}
+
+/**
+ * @param {import("ol/coordinate").Coordinate} originCoordinates
+ * @param {import("@vcmap-cesium/engine").Scene} scene
+ * @returns {!import("@vcmap-cesium/engine").Plane}
+ */
+export function createHorizontalPlane(originCoordinates, scene) {
+  scratchCartesian31 = mercatorToCartesian(
+    originCoordinates,
+    scratchCartesian31,
+  );
+  scratchCartesian32 = scene.globe.ellipsoid.geodeticSurfaceNormal(
+    scratchCartesian31,
+    scratchCartesian32,
+  );
+
+  return Plane.fromPointNormal(scratchCartesian31, scratchCartesian32);
+}
+
+/**
+ * @param {import("@vcmap-cesium/engine").Plane} plane
+ * @param {import("@vcmap-cesium/engine").Camera} camera
+ * @param {import("@vcmap-cesium/engine").Cartesian2} windowPosition
+ * @returns {import("@vcmap-cesium/engine").Cartographic}
+ */
+export function getCartographicFromPlane(plane, camera, windowPosition) {
+  const ray = camera.getPickRay(windowPosition, new Ray());
+  const intersection = IntersectionTests.rayPlane(ray, plane);
+  if (intersection) {
+    return Cartographic.fromCartesian(intersection);
+  }
+  return Cartographic.ZERO;
+}
+
+/**
+ * Drapes a geometry onto the terrain by placing each coordinate at its height.
+ * @param {import("ol/geom").Geometry} geometry
+ * @param {import("@vcmap/core").VcsMap} map
+ * @returns {Promise<void>}
+ */
+export async function drapeGeometryOnTerrain(geometry, map) {
+  if (map instanceof CesiumMap) {
+    const coordinates = geometry.getCoordinates();
+    const flats = getFlatCoordinatesFromGeometry(geometry, coordinates);
+    await map.getHeightFromTerrain(flats);
+    geometry.setCoordinates(coordinates);
+  }
+}
+
+/**
+ * Places a geometry onto the terrain at its lowest point.
+ * @param {import("ol/geom").Geometry} geometry
+ * @param {import("@vcmap/core").VcsMap} map
+ * @returns {Promise<void>}
+ */
+export async function placeGeometryOnTerrain(geometry, map) {
+  if (map instanceof CesiumMap) {
+    const coordinates = geometry.getCoordinates();
+    const flats = getFlatCoordinatesFromGeometry(geometry, coordinates);
+    await map.getHeightFromTerrain(flats);
+    let minHeight = Infinity;
+    flats.forEach((coord) => {
+      if (minHeight > coord[2]) {
+        minHeight = coord[2];
+      }
+    });
+    flats.forEach((coord) => {
+      coord[2] = minHeight;
+    });
+    geometry.setCoordinates(coordinates);
+  }
+}
+
+/**
+ * @param {import("ol").Feature} feature
+ * @param {import("@vcmap/core").VectorLayer} layer
+ * @param {import("@vcmap/core").VcsMap} cesiumMap
+ * @returns {Promise<void>}
+ */
+export async function ensureFeatureAbsolute(feature, layer, cesiumMap) {
+  // XXX this does not ensure 3D coordinates
+  const layerIsClamped =
+    layer.vectorProperties.altitudeMode === HeightReference.CLAMP_TO_GROUND;
+  const altitudeMode = feature.get('olcs_altitudeMode');
+  if (altitudeMode === 'clampToGround' || (!altitudeMode && layerIsClamped)) {
+    feature.set('olcs_altitudeMode', 'absolute', true);
+    const geometry = feature.getGeometry();
+    if (geometry) {
+      await placeGeometryOnTerrain(geometry, cesiumMap);
+    }
+  }
+}
+
+/**
+ * @param {import("ol").Feature} feature
+ */
+export function clampFeature(feature) {
+  feature.set('olcs_altitudeMode', 'clampToGround');
+}

package/src/util/editor/editorSessionHelpers.js

@@ -0,0 +1,132 @@
+import VectorLayer from '../../layer/vectorLayer.js';
+import { mercatorProjection } from '../projection.js';
+import InteractionChain from '../../interaction/interactionChain.js';
+import VcsEvent from '../../vcsEvent.js';
+import { EventType } from '../../interaction/interactionType.js';
+import { maxZIndex } from '../layerCollection.js';
+import { markVolatile } from '../../vcsModule.js';
+import { PrimitiveOptionsType } from '../../layer/vectorProperties.js';
+
+/**
+ * An editor session is a currently set of interactions to create or edit geometries & features.
+ * All editor sessions can be stopped and will be stopped, if their interactions get removed from the
+ * event handler.
+ * A stopped session will be destroyed and can no longer be used.
+ * @typedef {Object} EditorSession
+ * @property {SessionType} type
+ * @property {function():void} stop
+ * @property {VcsEvent<void>} stopped
+ */
+
+/**
+ * @enum {string}
+ * @property {string} CREATE
+ * @property {string} EDIT_GEOMETRY
+ * @property {string} EDIT_FEATURES
+ * @property {string} SELECT
+ */
+export const SessionType = {
+  CREATE: 'create',
+  EDIT_GEOMETRY: 'editGeometry',
+  EDIT_FEATURES: 'editFeatures',
+  SELECT: 'selectFeatures',
+};
+
+/**
+ * Sets up an editor session scratch layer & activates it. Does not wait for the activation promise to resolve.
+ * Note: scratch layers are volatile.
+ * @param {import("@vcmap/core").LayerCollection} layerCollection
+ * @returns {VectorLayer}
+ */
+export function setupScratchLayer(layerCollection) {
+  // IDEA pass in stopped and cleanup ourselves?
+  const layer = new VectorLayer({
+    projection: mercatorProjection.toJSON(),
+    vectorProperties: {
+      altitudeMode: 'clampToGround',
+      eyeOffset: [0, 0, -1],
+      primitiveOptions: {
+        type: PrimitiveOptionsType.SPHERE,
+        geometryOptions: {
+          radius: 4,
+        },
+        depthFailColor: 'rgba(255,255,255,0.47)',
+      },
+      modelAutoScale: true,
+    },
+    isDynamic: true,
+    zIndex: maxZIndex,
+    style: {
+      image: {
+        radius: 5,
+        fill: {
+          color: 'rgba(255,255,255,0.47)',
+        },
+        stroke: {
+          width: 1,
+          color: '#000000',
+        },
+      },
+    },
+  });
+  markVolatile(layer);
+  layerCollection.add(layer);
+  layer.activate();
+  return layer;
+}
+
+/**
+ * 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 {import("@vcmap/core").EventHandler} eventHandler
+ * @param {string} [interactionId]
+ * @returns {{ interactionChain: InteractionChain, removed: VcsEvent<void>, destroy: function():void }}
+ * @private
+ */
+export function setupInteractionChain(eventHandler, interactionId) {
+  const interactionChain = new InteractionChain();
+  /**
+   * @type {VcsEvent<void>}
+   */
+  const removed = new VcsEvent();
+  const listener = eventHandler.addExclusiveInteraction(
+    interactionChain,
+    () => {
+      removed.raiseEvent();
+    },
+    undefined,
+    interactionId,
+  );
+  const currentFeatureInteractionEvent = eventHandler.featureInteraction.active;
+  eventHandler.featureInteraction.setActive(
+    EventType.CLICKMOVE | EventType.DRAGSTART,
+  );
+
+  return {
+    interactionChain,
+    destroy() {
+      listener();
+      removed.destroy();
+      interactionChain.destroy();
+      eventHandler.featureInteraction.setActive(currentFeatureInteractionEvent);
+    },
+    removed,
+  };
+}
+
+/**
+ * @enum {string}
+ * @property {string} Point
+ * @property {string} Circle
+ * @property {string} LineString
+ * @property {string} Polygon
+ * @property {string} BBox
+ */
+export const GeometryType = {
+  Point: 'Point',
+  Circle: 'Circle',
+  LineString: 'LineString',
+  Polygon: 'Polygon',
+  BBox: 'BBox',
+};

package/src/util/editor/editorSymbols.js

@@ -0,0 +1,21 @@
+/**
+ * Symbol to identify a {@see Vertex}
+ * @type {symbol}
+ */
+export const vertexSymbol = Symbol('Vertex');
+/**
+ * Symbol to denote the vertexes index in the vertices array. This is important for snapping & bbox operations
+ * @type {symbol}
+ */
+export const vertexIndex = Symbol('VertexIndex');
+/**
+ * Symbol added to primitives and features to denote that these are handlers. It is expected, that the value of the symobl is
+ * equal to an {@see AXIS_AND_PLANES}
+ * @type {symbol}
+ */
+export const handlerSymbol = Symbol('Handler');
+/**
+ * Symbol to identify which was the last editor mouse over handler that edited the cursor style.
+ * @type {symbol}
+ */
+export const mouseOverSymbol = Symbol('MouseOver');

package/src/util/editor/interactions/createBBoxInteraction.js

@@ -0,0 +1,154 @@
+import Polygon from 'ol/geom/Polygon.js';
+import AbstractInteraction from '../../../interaction/abstractInteraction.js';
+import { EventType } from '../../../interaction/interactionType.js';
+import VcsEvent from '../../../vcsEvent.js';
+import { GeometryType } from '../editorSessionHelpers.js';
+import {
+  alreadyTransformedToImage,
+  alreadyTransformedToMercator,
+} from '../../../layer/vectorSymbols.js';
+import ObliqueMap from '../../../map/obliqueMap.js';
+
+/**
+ * Offset to prevent bbox from collapsing
+ * @type {number}
+ */
+const precisionOffset = 0.000001;
+
+/**
+ * This interaction allows you to create a bounding box geometry.
+ * @class
+ * @extends {AbstractInteraction}
+ * @implements {CreateInteraction<import("ol/geom").Polygon>}
+ */
+class CreateBBoxInteraction extends AbstractInteraction {
+  constructor() {
+    super(EventType.CLICKMOVE | EventType.DBLCLICK);
+
+    /**
+     * @type {import("ol/geom").Polygon|null}
+     * @private
+     */
+    this._geometry = null;
+    /**
+     * @type {import("ol/coordinate").Coordinate|null}
+     * @private
+     */
+    this._origin = null;
+    /**
+     * @type {import("ol/coordinate").Coordinate|null}
+     * @private
+     */
+    this._lastCoordinate = null;
+    /**
+     * @type {VcsEvent<import("ol/geom").Polygon|null>}
+     */
+    this.finished = new VcsEvent();
+    /**
+     * @type {VcsEvent<import("ol/geom").Polygon>}
+     */
+    this.created = new VcsEvent();
+    this.setActive();
+  }
+
+  /**
+   * Sets the coordinates given the last coordinate and the current origin
+   * @private
+   */
+  _setCoordinates() {
+    if (this._geometry) {
+      const originXHigher = this._origin[0] >= this._lastCoordinate[0];
+      const originYHigher = this._origin[1] >= this._lastCoordinate[1];
+      if (this._origin[0] === this._lastCoordinate[0]) {
+        this._lastCoordinate[0] += precisionOffset;
+      }
+      if (this._origin[1] === this._lastCoordinate[1]) {
+        this._lastCoordinate[1] += precisionOffset;
+      }
+
+      this._lastCoordinate[2] = this._origin[2];
+      let ringCoordinates;
+      if (
+        (originXHigher && originYHigher) ||
+        (!originXHigher && !originYHigher)
+      ) {
+        ringCoordinates = [
+          this._origin,
+          [this._lastCoordinate[0], this._origin[1], this._origin[2]],
+          this._lastCoordinate,
+          [this._origin[0], this._lastCoordinate[1], this._origin[2]],
+        ];
+      } else {
+        ringCoordinates = [
+          this._origin,
+          [this._origin[0], this._lastCoordinate[1], this._origin[2]],
+          this._lastCoordinate,
+          [this._lastCoordinate[0], this._origin[1], this._origin[2]],
+        ];
+      }
+      this._geometry.setCoordinates([ringCoordinates]);
+    }
+  }
+
+  /**
+   * @param {InteractionEvent} event
+   * @returns {Promise<InteractionEvent>}
+   * @inheritDoc
+   */
+  async pipe(event) {
+    if (event.type & EventType.CLICKMOVE && this._geometry) {
+      this._lastCoordinate.splice(
+        0,
+        event.positionOrPixel.length,
+        ...event.positionOrPixel,
+      );
+      this._setCoordinates();
+    }
+
+    if (event.type & EventType.CLICK) {
+      if (this._geometry) {
+        this.finish();
+      } else {
+        this._geometry = new Polygon([[event.positionOrPixel.slice()]], 'XYZ');
+        this._geometry.set('_vcsGeomType', GeometryType.BBox);
+        if (event.map instanceof ObliqueMap) {
+          this._geometry[alreadyTransformedToImage] = true;
+        } else {
+          this._geometry[alreadyTransformedToMercator] = true;
+        }
+        this.created.raiseEvent(this._geometry);
+        this._origin = event.positionOrPixel.slice();
+        this._lastCoordinate = this._origin.slice();
+      }
+    }
+
+    if (event.type & EventType.DBLCLICK) {
+      this.finish();
+    }
+    return event;
+  }
+
+  /**
+   * Finish the current creation. Calls finish and sets the interaction to be inactive
+   */
+  finish() {
+    if (this.active !== EventType.NONE) {
+      this._setCoordinates();
+      this.setActive(false);
+      this.finished.raiseEvent(this._geometry);
+    }
+  }
+
+  /**
+   * @inheritDoc
+   */
+  destroy() {
+    this._geometry = null;
+    this._coordinates = [];
+    this.finished.destroy();
+    this.created.destroy();
+    super.destroy();
+  }
+}
+
+export default CreateBBoxInteraction;