@geospatial-sdk/openlayers 0.0.5-dev.50 → 0.0.5-dev.52

package/dist/map/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const GEOSPATIAL_SDK_PREFIX = "--geospatial-sdk-";
+//# sourceMappingURL=constants.d.ts.map

package/dist/map/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../lib/map/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,qBAAqB,sBAAsB,CAAC"}

package/dist/map/constants.js

@@ -0,0 +1 @@
+export const GEOSPATIAL_SDK_PREFIX = "--geospatial-sdk-";

package/dist/map/create-map.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"create-map.d.ts","sourceRoot":"","sources":["../../lib/map/create-map.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACV,eAAe,EACf,cAAc,EAEf,MAAM,sBAAsB,CAAC;AAC9B,OAAO,GAAG,MAAM,WAAW,CAAC;AAC5B,OAAO,IAAI,MAAM,YAAY,CAAC;AAC9B,OAAO,KAAK,MAAM,mBAAmB,CAAC;AAsCtC,wBAAsB,WAAW,CAAC,UAAU,EAAE,eAAe,GAAG,OAAO,CAAC,KAAK,CAAC,CAyN7E;AAED,wBAAgB,gBAAgB,CAC9B,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,eAAe,EAC3B,aAAa,EAAE,MAAM,EACrB,kBAAkB,EAAE,eAAe,QAgBpC;AAED,wBAAgB,UAAU,CAAC,SAAS,EAAE,cAAc,GAAG,IAAI,EAAE,GAAG,EAAE,GAAG,GAAG,IAAI,CAkC3E;AAED;;;;GAIG;AACH,wBAAsB,oBAAoB,CACxC,OAAO,EAAE,UAAU,EACnB,MAAM,CAAC,EAAE,MAAM,GAAG,WAAW,GAC5B,OAAO,CAAC,GAAG,CAAC,CAKd;AAED;;;;GAIG;AACH,wBAAsB,mBAAmB,CACvC,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,UAAU,GAClB,OAAO,CAAC,GAAG,CAAC,CAQd"}
+{"version":3,"file":"create-map.d.ts","sourceRoot":"","sources":["../../lib/map/create-map.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,UAAU,EACV,eAAe,EACf,cAAc,EAEf,MAAM,sBAAsB,CAAC;AAC9B,OAAO,GAAG,MAAM,WAAW,CAAC;AAC5B,OAAO,IAAI,MAAM,YAAY,CAAC;AAC9B,OAAO,KAAK,MAAM,mBAAmB,CAAC;AAsCtC,wBAAsB,WAAW,CAAC,UAAU,EAAE,eAAe,GAAG,OAAO,CAAC,KAAK,CAAC,CAyN7E;AAED,wBAAgB,gBAAgB,CAC9B,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,eAAe,EAC3B,aAAa,EAAE,MAAM,EACrB,kBAAkB,EAAE,eAAe,QAgBpC;AAED,wBAAgB,UAAU,CAAC,SAAS,EAAE,cAAc,GAAG,IAAI,EAAE,GAAG,EAAE,GAAG,GAAG,IAAI,CAkC3E;AAED;;;;GAIG;AACH,wBAAsB,oBAAoB,CACxC,OAAO,EAAE,UAAU,EACnB,MAAM,CAAC,EAAE,MAAM,GAAG,WAAW,GAC5B,OAAO,CAAC,GAAG,CAAC,CAKd;AAED;;;;GAIG;AACH,wBAAsB,mBAAmB,CACvC,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,UAAU,GAClB,OAAO,CAAC,GAAG,CAAC,CASd"}

package/dist/map/create-map.js

@@ -1,4 +1,4 @@
-import { removeSearchParams, } from "@geospatial-sdk/core";
+import { defaultStyle, removeSearchParams, } from "@geospatial-sdk/core";
 import Map from "ol/Map.js";
 import View from "ol/View.js";
 import TileLayer from "ol/layer/Tile.js";
@@ -9,7 +9,6 @@ import VectorSource from "ol/source/Vector.js";
 import GeoJSON from "ol/format/GeoJSON.js";
 import { fromLonLat, transformExtent } from "ol/proj.js";
 import { bbox as bboxStrategy } from "ol/loadingstrategy.js";
-import { defaultStyle } from "./styles.js";
 import VectorTileLayer from "ol/layer/VectorTile.js";
 import OGCMapTile from "ol/source/OGCMapTile.js";
 import OGCVectorTile from "ol/source/OGCVectorTile.js";
@@ -20,6 +19,7 @@ import { MapboxVectorLayer } from "ol-mapbox-style";
 import { handleEndpointError, tileLoadErrorCatchFunction, } from "./handle-errors.js";
 import VectorTile from "ol/source/VectorTile.js";
 import { canDoIncrementalUpdate, updateLayerProperties, } from "./layer-update.js";
+import { initHoverLayer } from "./feature-hover.js";
 const GEOJSON = new GeoJSON();
 const WFS_MAX_FEATURES = 10000;
 export async function createLayer(layerModel) {
@@ -291,5 +291,6 @@ export async function resetMapFromContext(map, context) {
         const layer = await createLayer(layerModel);
         map.addLayer(layer);
     }
+    initHoverLayer(map);
     return map;
 }

package/dist/map/feature-hover.d.ts

@@ -0,0 +1,7 @@
+import type OlMap from "ol/Map.js";
+import VectorLayer from "ol/layer/Vector.js";
+import VectorSource from "ol/source/Vector.js";
+export declare function initHoverLayer(map: OlMap): void;
+export declare function getHoverLayer(map: OlMap): VectorLayer<VectorSource>;
+export declare function clearHoverLayer(map: OlMap): void;
+//# sourceMappingURL=feature-hover.d.ts.map

package/dist/map/feature-hover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"feature-hover.d.ts","sourceRoot":"","sources":["../../lib/map/feature-hover.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,WAAW,CAAC;AACnC,OAAO,WAAW,MAAM,oBAAoB,CAAC;AAC7C,OAAO,YAAY,MAAM,qBAAqB,CAAC;AAe/C,wBAAgB,cAAc,CAAC,GAAG,EAAE,KAAK,QAkFxC;AAED,wBAAgB,aAAa,CAAC,GAAG,EAAE,KAAK,GAAG,WAAW,CAAC,YAAY,CAAC,CAEnE;AAED,wBAAgB,eAAe,CAAC,GAAG,EAAE,KAAK,QAMzC"}

package/dist/map/feature-hover.js

@@ -0,0 +1,82 @@
+import { GEOSPATIAL_SDK_PREFIX } from "./constants.js";
+import VectorLayer from "ol/layer/Vector.js";
+import VectorSource from "ol/source/Vector.js";
+import { defaultHighlightStyle, FeaturesHoverEventType, } from "@geospatial-sdk/core";
+import OlFeature from "ol/Feature.js";
+import { unByKey } from "ol/Observable.js";
+import { readFeaturesAtPixel } from "./get-features.js";
+const hoverLayerKey = `${GEOSPATIAL_SDK_PREFIX}hover-layer`;
+const unsubscribeKey = `${GEOSPATIAL_SDK_PREFIX}hover-unsub`;
+export function initHoverLayer(map) {
+    if (map.get(hoverLayerKey)) {
+        clearHoverLayer(map);
+    }
+    // create layer & add on top of everything else
+    const hoverLayer = new VectorLayer({
+        source: new VectorSource({
+            features: [],
+            useSpatialIndex: false,
+        }),
+        style: defaultHighlightStyle,
+    });
+    map.set(hoverLayerKey, hoverLayer);
+    hoverLayer.setMap(map);
+    // store original cursor style in order to change it later
+    const originalCursorStyle = map.getTargetElement()?.style.cursor ?? "";
+    const layerFilter = (layer) => layer !== hoverLayer && layer.get(`${GEOSPATIAL_SDK_PREFIX}enable-hover`);
+    const unKey = map.on("pointermove", async (event) => {
+        // skip hit detection if the view is moving as it can have an impact on performance
+        if (map.getView().getInteracting() || map.getView().getAnimating()) {
+            return;
+        }
+        // change cursor if above a feature
+        const hasFeature = map.hasFeatureAtPixel(event.pixel, {
+            layerFilter,
+        });
+        if (map.getTargetElement()) {
+            map.getTargetElement().style.cursor = hasFeature
+                ? "pointer"
+                : originalCursorStyle;
+        }
+        const hoveredSource = hoverLayer.getSource();
+        hoveredSource.clear(true);
+        if (!hasFeature) {
+            return;
+        }
+        // add hovered feature to the layer
+        let firstFeature = null;
+        map.forEachFeatureAtPixel(event.pixel, (feature) => {
+            if (feature instanceof OlFeature) {
+                firstFeature = feature;
+                return true;
+            }
+        }, {
+            layerFilter,
+        });
+        if (!firstFeature) {
+            return;
+        }
+        hoveredSource.addFeature(firstFeature);
+        // dispatch event if subscribed to
+        if (map.get(FeaturesHoverEventType)) {
+            const featuresByLayer = await readFeaturesAtPixel(map, event, layerFilter);
+            const features = Array.from(featuresByLayer.values()).flat();
+            map.dispatchEvent({
+                type: FeaturesHoverEventType,
+                features,
+                featuresByLayer,
+            });
+        }
+    });
+    map.set(unsubscribeKey, unKey);
+}
+export function getHoverLayer(map) {
+    return map.get(hoverLayerKey);
+}
+export function clearHoverLayer(map) {
+    const hoverLayer = getHoverLayer(map);
+    hoverLayer.setMap(null);
+    hoverLayer.dispose();
+    map.set(hoverLayerKey, null);
+    unByKey(map.get(unsubscribeKey));
+}

package/dist/map/get-features.d.ts

@@ -0,0 +1,13 @@
+import OlMap from "ol/Map.js";
+import { Pixel } from "ol/pixel.js";
+import TileWMS from "ol/source/TileWMS.js";
+import ImageWMS from "ol/source/ImageWMS.js";
+import { Coordinate } from "ol/coordinate.js";
+import Layer from "ol/layer/Layer.js";
+import type MapBrowserEvent from "ol/MapBrowserEvent.js";
+import type { FeaturesByLayerIndex } from "@geospatial-sdk/core";
+export declare function getFeaturesFromVectorSources(olMap: OlMap, pixel: Pixel, layerFilter?: (layer: Layer) => boolean): FeaturesByLayerIndex;
+export declare function getGFIUrl(source: TileWMS | ImageWMS, map: OlMap, coordinate: Coordinate): string | null;
+export declare function getFeaturesFromWmsSources(olMap: OlMap, coordinate: Coordinate, layerFilter?: (layer: Layer) => boolean): Promise<FeaturesByLayerIndex>;
+export declare function readFeaturesAtPixel(map: OlMap, event: MapBrowserEvent<PointerEvent>, layerFilter?: (layer: Layer) => boolean): Promise<FeaturesByLayerIndex>;
+//# sourceMappingURL=get-features.d.ts.map

package/dist/map/get-features.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"get-features.d.ts","sourceRoot":"","sources":["../../lib/map/get-features.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,WAAW,CAAC;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAGpC,OAAO,OAAO,MAAM,sBAAsB,CAAC;AAC3C,OAAO,QAAQ,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,KAAK,MAAM,mBAAmB,CAAC;AAEtC,OAAO,KAAK,eAAe,MAAM,uBAAuB,CAAC;AACzD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAIjE,wBAAgB,4BAA4B,CAC1C,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,OAAO,GACtC,oBAAoB,CAqBtB;AAED,wBAAgB,SAAS,CACvB,MAAM,EAAE,OAAO,GAAG,QAAQ,EAC1B,GAAG,EAAE,KAAK,EACV,UAAU,EAAE,UAAU,GACrB,MAAM,GAAG,IAAI,CAWf;AAED,wBAAsB,yBAAyB,CAC7C,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU,EACtB,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,OAAO,GACtC,OAAO,CAAC,oBAAoB,CAAC,CAsC/B;AAOD,wBAAsB,mBAAmB,CACvC,GAAG,EAAE,KAAK,EACV,KAAK,EAAE,eAAe,CAAC,YAAY,CAAC,EACpC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,OAAO,GACtC,OAAO,CAAC,oBAAoB,CAAC,CAS/B"}

package/dist/map/get-features.js

@@ -0,0 +1,77 @@
+import GeoJSON from "ol/format/GeoJSON.js";
+import TileWMS from "ol/source/TileWMS.js";
+import ImageWMS from "ol/source/ImageWMS.js";
+import Layer from "ol/layer/Layer.js";
+import throttle from "lodash.throttle";
+const GEOJSON = new GeoJSON();
+export function getFeaturesFromVectorSources(olMap, pixel, layerFilter) {
+    const result = new Map();
+    const layerArray = olMap.getLayers().getArray();
+    olMap.forEachFeatureAtPixel(pixel, (feature, layer) => {
+        // can happen for unmanaged layer (i.e. hover layer)
+        if (layer === null) {
+            return null;
+        }
+        const layerIndex = layerArray.indexOf(layer);
+        if (!result.has(layerIndex)) {
+            result.set(layerIndex, []);
+        }
+        result
+            .get(layerIndex)
+            .push(GEOJSON.writeFeatureObject(feature));
+    }, { layerFilter });
+    return result;
+}
+export function getGFIUrl(source, map, coordinate) {
+    const view = map.getView();
+    const projection = view.getProjection();
+    const resolution = view.getResolution();
+    const params = {
+        ...source.getParams(),
+        INFO_FORMAT: "application/json",
+    };
+    return (source.getFeatureInfoUrl(coordinate, resolution, projection, params) ?? null);
+}
+export async function getFeaturesFromWmsSources(olMap, coordinate, layerFilter) {
+    const result = new Map();
+    const layerArray = olMap.getLayers().getArray();
+    const hasWms = layerArray.some((layer) => {
+        const source = layer instanceof Layer ? layer.getSource() : null;
+        return source instanceof TileWMS || source instanceof ImageWMS;
+    });
+    if (!hasWms) {
+        return result;
+    }
+    const gfiPromises = layerArray.map((layer) => {
+        if (!(layer instanceof Layer)) {
+            return null;
+        }
+        if (layerFilter && !layerFilter(layer)) {
+            return null;
+        }
+        const source = layer.getSource();
+        if (!(source instanceof TileWMS) && !(source instanceof ImageWMS)) {
+            return null;
+        }
+        const gfiUrl = getGFIUrl(source, olMap, coordinate);
+        return gfiUrl
+            ? fetch(gfiUrl)
+                .then((response) => response.json())
+                .then((collection) => collection.features)
+            : null;
+    });
+    const responses = await Promise.all(gfiPromises);
+    responses.forEach((features, index) => {
+        if (features !== null && features.length > 0) {
+            result.set(index, features);
+        }
+    });
+    return result;
+}
+const getFeaturesFromWmsSourcesThrottled = throttle(getFeaturesFromWmsSources, 250);
+export async function readFeaturesAtPixel(map, event, layerFilter) {
+    return new Map([
+        ...getFeaturesFromVectorSources(map, event.pixel, layerFilter),
+        ...(await getFeaturesFromWmsSourcesThrottled(map, event.coordinate, layerFilter)),
+    ]);
+}

package/dist/map/index.d.ts

@@ -2,7 +2,6 @@
  * @hideGroups
  * @packageDocumentation
  */
-export * from "./styles.js";
 export { createMapFromContext, resetMapFromContext } from "./create-map.js";
 export { applyContextDiffToMap } from "./apply-context-diff.js";
 export { listen } from "./register-events.js";

package/dist/map/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../lib/map/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,cAAc,aAAa,CAAC;AAC5B,OAAO,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAC5E,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../lib/map/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAC5E,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/map/index.js

@@ -2,7 +2,6 @@
  * @hideGroups
  * @packageDocumentation
  */
-export * from "./styles.js";
 export { createMapFromContext, resetMapFromContext } from "./create-map.js";
 export { applyContextDiffToMap } from "./apply-context-diff.js";
 export { listen } from "./register-events.js";

package/dist/map/layer-update.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"layer-update.d.ts","sourceRoot":"","sources":["../../lib/map/layer-update.ts"],"names":[],"mappings":"AAAA,OAAO,EAAW,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAEhE,OAAO,KAAK,MAAM,mBAAmB,CAAC;AAYtC;;;;;;;;;GASG;AACH,wBAAgB,sBAAsB,CACpC,QAAQ,EAAE,eAAe,EACzB,QAAQ,EAAE,eAAe,GACxB,OAAO,CAIT;AAED;;;;;;GAMG;AACH,wBAAgB,qBAAqB,CACnC,UAAU,EAAE,eAAe,EAC3B,OAAO,EAAE,KAAK,EACd,kBAAkB,CAAC,EAAE,eAAe,QA6BrC"}
+{"version":3,"file":"layer-update.d.ts","sourceRoot":"","sources":["../../lib/map/layer-update.ts"],"names":[],"mappings":"AAAA,OAAO,EAAW,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAKhE,OAAO,KAAK,MAAM,mBAAmB,CAAC;AAmBtC;;;;;;;;;GASG;AACH,wBAAgB,sBAAsB,CACpC,QAAQ,EAAE,eAAe,EACzB,QAAQ,EAAE,eAAe,GACxB,OAAO,CAIT;AAED;;;;;;GAMG;AACH,wBAAgB,qBAAqB,CACnC,UAAU,EAAE,eAAe,EAC3B,OAAO,EAAE,KAAK,EACd,kBAAkB,CAAC,EAAE,eAAe,QA2CrC"}

package/dist/map/layer-update.js

@@ -1,4 +1,5 @@
 import { getHash } from "@geospatial-sdk/core";
+import { GEOSPATIAL_SDK_PREFIX } from "./constants.js";
 const UPDATABLE_PROPERTIES = [
     "opacity",
     "visibility",
@@ -6,6 +7,8 @@ const UPDATABLE_PROPERTIES = [
     "attributions",
     "extras",
     "version",
+    "enableHover",
+    "style",
     // TODO (when available) "zIndex"
 ];
 /**
@@ -55,5 +58,12 @@ export function updateLayerProperties(layerModel, olLayer, previousLayerModel) {
     if (shouldApplyProperty("label")) {
         olLayer.set("label", layerModel.label);
     }
+    if (shouldApplyProperty("enableHover")) {
+        olLayer.set(`${GEOSPATIAL_SDK_PREFIX}enable-hover`, layerModel.enableHover);
+    }
+    if (shouldApplyProperty("style") &&
+        "setStyle" in olLayer) {
+        olLayer.setStyle(layerModel.style);
+    }
     // TODO: z-index
 }

package/dist/map/register-events.d.ts

@@ -1,12 +1,4 @@
 import Map from "ol/Map.js";
 import { MapEventsByType } from "@geospatial-sdk/core";
-import { Coordinate } from "ol/coordinate.js";
-import TileWMS from "ol/source/TileWMS.js";
-import ImageWMS from "ol/source/ImageWMS.js";
-import { Pixel } from "ol/pixel.js";
-import type { Feature } from "geojson";
-export declare function getFeaturesFromVectorSources(olMap: Map, pixel: Pixel): Feature[];
-export declare function getGFIUrl(source: TileWMS | ImageWMS, map: Map, coordinate: Coordinate): string | null;
-export declare function getFeaturesFromWmsSources(olMap: Map, coordinate: Coordinate): Promise<Feature[]>;
 export declare function listen<T extends keyof MapEventsByType>(map: Map, eventType: T, callback: (event: MapEventsByType[T]) => void): void;
 //# sourceMappingURL=register-events.d.ts.map

package/dist/map/register-events.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"register-events.d.ts","sourceRoot":"","sources":["../../lib/map/register-events.ts"],"names":[],"mappings":"AAAA,OAAO,GAA4B,MAAM,WAAW,CAAC;AACrD,OAAO,EAKL,eAAe,EAEhB,MAAM,sBAAsB,CAAC;AAM9B,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,OAAO,MAAM,sBAAsB,CAAC;AAC3C,OAAO,QAAQ,MAAM,uBAAuB,CAAC;AAE7C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,KAAK,EAAE,OAAO,EAAqB,MAAM,SAAS,CAAC;AAO1D,wBAAgB,4BAA4B,CAC1C,KAAK,EAAE,GAAG,EACV,KAAK,EAAE,KAAK,GACX,OAAO,EAAE,CAOX;AAED,wBAAgB,SAAS,CACvB,MAAM,EAAE,OAAO,GAAG,QAAQ,EAC1B,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,UAAU,GACrB,MAAM,GAAG,IAAI,CAWf;AAED,wBAAgB,yBAAyB,CACvC,KAAK,EAAE,GAAG,EACV,UAAU,EAAE,UAAU,GACrB,OAAO,CAAC,OAAO,EAAE,CAAC,CA2BpB;AA8ED,wBAAgB,MAAM,CAAC,CAAC,SAAS,MAAM,eAAe,EACpD,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,CAAC,EACZ,QAAQ,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,KAAK,IAAI,QA0E9C"}
+{"version":3,"file":"register-events.d.ts","sourceRoot":"","sources":["../../lib/map/register-events.ts"],"names":[],"mappings":"AAAA,OAAO,GAA4B,MAAM,WAAW,CAAC;AACrD,OAAO,EAIL,eAAe,EAGhB,MAAM,sBAAsB,CAAC;AA8D9B,wBAAgB,MAAM,CAAC,CAAC,SAAS,MAAM,eAAe,EACpD,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,CAAC,EACZ,QAAQ,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,KAAK,IAAI,QA0E9C"}

package/dist/map/register-events.js

@@ -1,64 +1,17 @@
 import { FeaturesClickEventType, FeaturesHoverEventType, MapClickEventType, MapExtentChangeEventType, SourceLoadErrorType, } from "@geospatial-sdk/core";
 import { toLonLat, transformExtent } from "ol/proj.js";
-import GeoJSON from "ol/format/GeoJSON.js";
-import TileWMS from "ol/source/TileWMS.js";
-import ImageWMS from "ol/source/ImageWMS.js";
-import Layer from "ol/layer/Layer.js";
-import throttle from "lodash.throttle";
 import { equals } from "ol/extent.js";
-const GEOJSON = new GeoJSON();
-export function getFeaturesFromVectorSources(olMap, pixel) {
-    const olFeatures = olMap.getFeaturesAtPixel(pixel);
-    const { features } = GEOJSON.writeFeaturesObject(olFeatures);
-    if (!features) {
-        return [];
-    }
-    return features;
-}
-export function getGFIUrl(source, map, coordinate) {
-    const view = map.getView();
-    const projection = view.getProjection();
-    const resolution = view.getResolution();
-    const params = {
-        ...source.getParams(),
-        INFO_FORMAT: "application/json",
-    };
-    return (source.getFeatureInfoUrl(coordinate, resolution, projection, params) ?? null);
-}
-export function getFeaturesFromWmsSources(olMap, coordinate) {
-    const wmsSources = olMap
-        .getLayers()
-        .getArray()
-        .filter((layer) => layer instanceof Layer &&
-        (layer.getSource() instanceof TileWMS ||
-            layer.getSource() instanceof ImageWMS))
-        .map((layer) => layer.getSource());
-    if (!wmsSources.length) {
-        return Promise.resolve([]);
-    }
-    const gfiUrls = wmsSources.reduce((urls, source) => {
-        const gfiUrl = getGFIUrl(source, olMap, coordinate);
-        return gfiUrl ? [...urls, gfiUrl] : urls;
-    }, []);
-    return Promise.all(gfiUrls.map((url) => fetch(url)
-        .then((response) => response.json())
-        .then((collection) => collection.features))).then((features) => features.flat());
-}
-const getFeaturesFromWmsSourcesThrottled = throttle(getFeaturesFromWmsSources, 250);
-async function readFeaturesAtPixel(map, event) {
-    return [
-        ...getFeaturesFromVectorSources(map, event.pixel),
-        ...(await getFeaturesFromWmsSourcesThrottled(map, event.coordinate)),
-    ];
-}
+import { readFeaturesAtPixel } from "./get-features.js";
 function registerFeatureClickEvent(map) {
     if (map.get(FeaturesClickEventType))
         return;
     map.on("click", async (event) => {
-        const features = await readFeaturesAtPixel(map, event);
+        const featuresByLayer = await readFeaturesAtPixel(map, event);
+        const features = Array.from(featuresByLayer.values()).flat();
         map.dispatchEvent({
             type: FeaturesClickEventType,
             features,
+            featuresByLayer,
         });
     });
     map.set(FeaturesClickEventType, true);
@@ -66,13 +19,6 @@ function registerFeatureClickEvent(map) {
 function registerFeatureHoverEvent(map) {
     if (map.get(FeaturesHoverEventType))
         return;
-    map.on("pointermove", async (event) => {
-        const features = await readFeaturesAtPixel(map, event);
-        map.dispatchEvent({
-            type: FeaturesHoverEventType,
-            features,
-        });
-    });
     map.set(FeaturesHoverEventType, true);
 }
 function registerMapExtentChangeEvent(map) {

package/lib/map/constants.ts

@@ -0,0 +1 @@
+export const GEOSPATIAL_SDK_PREFIX = "--geospatial-sdk-";

package/lib/map/create-map.test.ts

@@ -44,6 +44,7 @@ import ImageTile from "ol/ImageTile.js";
 import TileState from "ol/TileState.js";
 import VectorTileLayer from "ol/layer/VectorTile.js";
 import { FeatureUrlFunction } from "ol/featureloader.js";
+import { beforeEach } from "vitest";
 
 vi.mock("./handle-errors", async (importOriginal) => {
   const actual =
@@ -480,9 +481,10 @@ describe("MapContextService", () => {
     });
   });
   describe("#resetMapFromContext", () => {
-    const map = new Map({});
-    const mapContext = MAP_CTX_FIXTURE;
+    let map: Map;
     beforeEach(() => {
+      map = new Map({});
+      const mapContext = MAP_CTX_FIXTURE;
       resetMapFromContext(map, mapContext);
     });
     it("create a map", () => {
@@ -500,17 +502,18 @@ describe("MapContextService", () => {
     });
     describe("uses default fallback view", () => {
       let view: View;
-      const map = new Map({});
-      const mapContext: MapContext = {
-        view: null,
-        layers: [
-          MAP_CTX_LAYER_XYZ_FIXTURE,
-          MAP_CTX_LAYER_WMS_FIXTURE,
-          MAP_CTX_LAYER_GEOJSON_FIXTURE,
-        ],
-      };
-      beforeEach(() => {
-        resetMapFromContext(map, mapContext);
+      let map: Map;
+      beforeEach(async () => {
+        map = new Map({});
+        const mapContext: MapContext = {
+          view: null,
+          layers: [
+            MAP_CTX_LAYER_XYZ_FIXTURE,
+            MAP_CTX_LAYER_WMS_FIXTURE,
+            MAP_CTX_LAYER_GEOJSON_FIXTURE,
+          ],
+        };
+        await resetMapFromContext(map, mapContext);
       });
       it("create a map", () => {
         expect(map).toBeTruthy();

package/lib/map/create-map.ts

@@ -1,4 +1,5 @@
 import {
+  defaultStyle,
   MapContext,
   MapContextLayer,
   MapContextView,
@@ -18,7 +19,6 @@ import Geometry from "ol/geom/Geometry.js";
 import SimpleGeometry from "ol/geom/SimpleGeometry.js";
 import { fromLonLat, transformExtent } from "ol/proj.js";
 import { bbox as bboxStrategy } from "ol/loadingstrategy.js";
-import { defaultStyle } from "./styles.js";
 import VectorTileLayer from "ol/layer/VectorTile.js";
 import OGCMapTile from "ol/source/OGCMapTile.js";
 import OGCVectorTile from "ol/source/OGCVectorTile.js";
@@ -40,6 +40,7 @@ import {
   canDoIncrementalUpdate,
   updateLayerProperties,
 } from "./layer-update.js";
+import { initHoverLayer } from "./feature-hover.js";
 
 const GEOJSON = new GeoJSON();
 const WFS_MAX_FEATURES = 10000;
@@ -351,5 +352,6 @@ export async function resetMapFromContext(
     const layer = await createLayer(layerModel);
     map.addLayer(layer);
   }
+  initHoverLayer(map);
   return map;
 }

package/lib/map/feature-hover.ts

@@ -0,0 +1,113 @@
+import { GEOSPATIAL_SDK_PREFIX } from "./constants.js";
+import type OlMap from "ol/Map.js";
+import VectorLayer from "ol/layer/Vector.js";
+import VectorSource from "ol/source/Vector.js";
+import {
+  defaultHighlightStyle,
+  FeaturesHoverEventType,
+} from "@geospatial-sdk/core";
+import type BaseEvent from "ol/events/Event.js";
+import { MapBrowserEvent } from "ol";
+import OlFeature from "ol/Feature.js";
+import type BaseLayer from "ol/layer/Base.js";
+import { unByKey } from "ol/Observable.js";
+import { readFeaturesAtPixel } from "./get-features.js";
+
+const hoverLayerKey = `${GEOSPATIAL_SDK_PREFIX}hover-layer`;
+const unsubscribeKey = `${GEOSPATIAL_SDK_PREFIX}hover-unsub`;
+
+export function initHoverLayer(map: OlMap) {
+  if (map.get(hoverLayerKey)) {
+    clearHoverLayer(map);
+  }
+
+  // create layer & add on top of everything else
+  const hoverLayer = new VectorLayer({
+    source: new VectorSource({
+      features: [],
+      useSpatialIndex: false,
+    }),
+    style: defaultHighlightStyle,
+  });
+  map.set(hoverLayerKey, hoverLayer);
+  hoverLayer.setMap(map);
+
+  // store original cursor style in order to change it later
+  const originalCursorStyle = map.getTargetElement()?.style.cursor ?? "";
+
+  const layerFilter = (layer: BaseLayer) =>
+    layer !== hoverLayer && layer.get(`${GEOSPATIAL_SDK_PREFIX}enable-hover`);
+
+  const unKey = map.on(
+    "pointermove",
+    async (event: MapBrowserEvent<PointerEvent>) => {
+      // skip hit detection if the view is moving as it can have an impact on performance
+      if (map.getView().getInteracting() || map.getView().getAnimating()) {
+        return;
+      }
+
+      // change cursor if above a feature
+      const hasFeature = map.hasFeatureAtPixel(event.pixel, {
+        layerFilter,
+      });
+      if (map.getTargetElement()) {
+        map.getTargetElement().style.cursor = hasFeature
+          ? "pointer"
+          : originalCursorStyle;
+      }
+
+      const hoveredSource = hoverLayer.getSource() as VectorSource;
+      hoveredSource.clear(true);
+      if (!hasFeature) {
+        return;
+      }
+
+      // add hovered feature to the layer
+      let firstFeature: OlFeature | null = null;
+      map.forEachFeatureAtPixel(
+        event.pixel,
+        (feature) => {
+          if (feature instanceof OlFeature) {
+            firstFeature = feature;
+            return true;
+          }
+        },
+        {
+          layerFilter,
+        },
+      );
+      if (!firstFeature) {
+        return;
+      }
+      hoveredSource.addFeature(firstFeature);
+
+      // dispatch event if subscribed to
+      if (map.get(FeaturesHoverEventType)) {
+        const featuresByLayer = await readFeaturesAtPixel(
+          map,
+          event,
+          layerFilter,
+        );
+        const features = Array.from(featuresByLayer.values()).flat();
+        map.dispatchEvent({
+          type: FeaturesHoverEventType,
+          features,
+          featuresByLayer,
+        } as unknown as BaseEvent);
+      }
+    },
+  );
+  map.set(unsubscribeKey, unKey);
+}
+
+export function getHoverLayer(map: OlMap): VectorLayer<VectorSource> {
+  return map.get(hoverLayerKey) as VectorLayer<VectorSource>;
+}
+
+export function clearHoverLayer(map: OlMap) {
+  const hoverLayer = getHoverLayer(map);
+  hoverLayer.setMap(null);
+  hoverLayer.dispose();
+  map.set(hoverLayerKey, null);
+  unByKey(map.get(unsubscribeKey));
+}