@geospatial-sdk/maplibre 0.0.5-dev.49 → 0.0.5-dev.50

package/dist/helpers/map.helpers.d.ts

@@ -1,21 +1,55 @@
-import { Map } from "maplibre-gl";
-import { Dataset, LayerContextWithStyle, LayerSpecificationWithSource } from "../maplibre.models.js";
+import type { LayerSpecification, Map } from "maplibre-gl";
+import { Dataset, LayerContextWithStyle, LayerMetadataSpecification, LayerSpecificationWithSource } from "../maplibre.models.js";
 import { FeatureCollection, Geometry } from "geojson";
 import { MapContextLayer } from "@geospatial-sdk/core";
-/**
- * Remove all layers from a given source in the map.
- * @param map
- * @param sourceId
- */
-export declare function removeLayersFromSource(map: Map, sourceId: string): void;
 /**
  * Create a Maplibre source and layers from a GeoJSON MapContextLayer and its style.
  * @param layerModel
  * @param geojson
- * @param sourcePosition
+ * @param metadata
+ */
+export declare function createDatasetFromGeoJsonLayer(layerModel: LayerContextWithStyle, geojson: FeatureCollection<Geometry | null> | string, metadata: LayerMetadataSpecification): Dataset;
+export declare function getLayersFromContextLayer(map: Map, layerModel: MapContextLayer): LayerSpecificationWithSource[];
+/**
+ * This returns all MapLibre layers that correspond to a position in a MapContext
+ * @param map
+ * @param position
  */
-export declare function createDatasetFromGeoJsonLayer(layerModel: LayerContextWithStyle, geojson: FeatureCollection<Geometry | null> | string, sourcePosition: number): Dataset;
 export declare function getLayersAtPosition(map: Map, position: number): LayerSpecificationWithSource[];
-export declare function getBeforeId(map: Map, position: number): string | undefined;
-export declare function generateLayerId(layerModel: MapContextLayer): string;
+/**
+ * This returns the id of the first MapLibre layer that corresponds to the given MapContext position;
+ * used as a beforeId for adding/moving layers
+ * @param map
+ * @param position
+ */
+export declare function getFirstLayerIdAtPosition(map: Map, position: number): string | undefined;
+/**
+ * This generates a layer hash that stays consistent even if updatable properties change.
+ * @param layerModel
+ */
+export declare function generateLayerHashWithoutUpdatableProps(layerModel: MapContextLayer): string;
+/**
+ * Incremental update is possible only if certain properties are changed: opacity,
+ * visibility, zIndex, etc.
+ *
+ * Note: we assume that both layers are different versions of the same layer (this
+ * will not be checked again)
+ * @param oldLayer
+ * @param newLayer
+ * @return Returns `true` if the only properties changed are the updatable ones
+ */
+export declare function canDoIncrementalUpdate(oldLayer: MapContextLayer, newLayer: MapContextLayer): boolean;
+/**
+ * This simply generates a unique id
+ */
+export declare function generateLayerId(): string;
+/**
+ * Will apply generic properties to the layer; only changes the necessary
+ * properties to avoid updating the map too often
+ * @param map
+ * @param layer
+ * @param layerModel
+ * @param previousLayerModel
+ */
+export declare function updateLayerProperties(map: Map, layer: LayerSpecification, layerModel: MapContextLayer, previousLayerModel: MapContextLayer): void;
 //# sourceMappingURL=map.helpers.d.ts.map

package/dist/helpers/map.helpers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"map.helpers.d.ts","sourceRoot":"","sources":["../../lib/helpers/map.helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAsB,MAAM,aAAa,CAAC;AACtD,OAAO,EACL,OAAO,EACP,qBAAqB,EAErB,4BAA4B,EAC7B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAGtD,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAEvD;;;;GAIG;AACH,wBAAgB,sBAAsB,CAAC,GAAG,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,QAWhE;AAED;;;;;GAKG;AACH,wBAAgB,6BAA6B,CAC3C,UAAU,EAAE,qBAAqB,EACjC,OAAO,EAAE,iBAAiB,CAAC,QAAQ,GAAG,IAAI,CAAC,GAAG,MAAM,EACpD,cAAc,EAAE,MAAM,GACrB,OAAO,CAuBT;AAED,wBAAgB,mBAAmB,CACjC,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,MAAM,GACf,4BAA4B,EAAE,CAUhC;AAED,wBAAgB,WAAW,CAAC,GAAG,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAS1E;AAED,wBAAgB,eAAe,CAAC,UAAU,EAAE,eAAe,UAS1D"}
+{"version":3,"file":"map.helpers.d.ts","sourceRoot":"","sources":["../../lib/helpers/map.helpers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,GAAG,EAAsB,MAAM,aAAa,CAAC;AAC/E,OAAO,EACL,OAAO,EACP,qBAAqB,EACrB,0BAA0B,EAC1B,4BAA4B,EAC7B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAGtD,OAAO,EAAuB,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAW5E;;;;;GAKG;AACH,wBAAgB,6BAA6B,CAC3C,UAAU,EAAE,qBAAqB,EACjC,OAAO,EAAE,iBAAiB,CAAC,QAAQ,GAAG,IAAI,CAAC,GAAG,MAAM,EACpD,QAAQ,EAAE,0BAA0B,GACnC,OAAO,CA+BT;AAED,wBAAgB,yBAAyB,CACvC,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,eAAe,GAC1B,4BAA4B,EAAE,CAkBhC;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,CACjC,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,MAAM,GACf,4BAA4B,EAAE,CAoBhC;AAED;;;;;GAKG;AACH,wBAAgB,yBAAyB,CACvC,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,MAAM,GACf,MAAM,GAAG,SAAS,CAoBpB;AAYD;;;GAGG;AACH,wBAAgB,sCAAsC,CACpD,UAAU,EAAE,eAAe,UAG5B;AAED;;;;;;;;;GASG;AACH,wBAAgB,sBAAsB,CACpC,QAAQ,EAAE,eAAe,EACzB,QAAQ,EAAE,eAAe,GACxB,OAAO,CAKT;AAED;;GAEG;AACH,wBAAgB,eAAe,WAE9B;AAED;;;;;;;GAOG;AACH,wBAAgB,qBAAqB,CACnC,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,kBAAkB,EACzB,UAAU,EAAE,eAAe,EAC3B,kBAAkB,EAAE,eAAe,QA+BpC"}

package/dist/helpers/map.helpers.js

@@ -1,37 +1,37 @@
 import { contextStyleToMaplibreLayers } from "./style.helpers.js";
 import { getHash } from "@geospatial-sdk/core/dist/utils/hash.js";
-/**
- * Remove all layers from a given source in the map.
- * @param map
- * @param sourceId
- */
-export function removeLayersFromSource(map, sourceId) {
-    const layers = map.getStyle().layers;
-    const layersWithSource = layers.filter((layer) => layer.type !== "background");
-    const layerIds = layersWithSource
-        .filter((layer) => layer.hasOwnProperty("source") && layer.source === sourceId)
-        .map((layer) => layer.id);
-    layerIds.forEach((layer) => map.removeLayer(layer));
+function getOpacityPaintPropNames(layerType) {
+    switch (layerType) {
+        case "circle":
+            return ["circle-opacity", "circle-stroke-opacity"];
+        default:
+            return [`${layerType}-opacity`];
+    }
 }
 /**
  * Create a Maplibre source and layers from a GeoJSON MapContextLayer and its style.
  * @param layerModel
  * @param geojson
- * @param sourcePosition
+ * @param metadata
  */
-export function createDatasetFromGeoJsonLayer(layerModel, geojson, sourcePosition) {
-    const sourceId = generateLayerId(layerModel);
+export function createDatasetFromGeoJsonLayer(layerModel, geojson, metadata) {
+    const sourceId = generateLayerId();
     const partialLayers = contextStyleToMaplibreLayers(layerModel.style);
     const layers = partialLayers.map((layer) => ({
         ...layer,
         id: `${sourceId}-${layer.type}`,
         source: sourceId,
+        paint: {
+            ...layer.paint,
+            ...getOpacityPaintPropNames(layer.type).reduce((acc, prop) => ({
+                ...acc,
+                [prop]: layerModel.opacity ?? 1,
+            }), {}),
+        },
         layout: {
             visibility: layerModel.visibility === false ? "none" : "visible",
         },
-        metadata: {
-            sourcePosition,
-        },
+        metadata,
     }));
     return {
         sources: {
@@ -43,26 +43,143 @@ export function createDatasetFromGeoJsonLayer(layerModel, geojson, sourcePositio
         layers,
     };
 }
+export function getLayersFromContextLayer(map, layerModel) {
+    const layerId = layerModel.id;
+    const layerHash = generateLayerHashWithoutUpdatableProps(layerModel);
+    const layers = map.getStyle().layers;
+    const result = [];
+    for (let i = 0; i < layers.length; i++) {
+        const layer = layers[i];
+        const metadata = layer.metadata;
+        if (layerId !== undefined) {
+            if (metadata?.layerId === layerId) {
+                result.push(layer);
+            }
+        }
+        else if (metadata?.layerHash === layerHash) {
+            result.push(layer);
+        }
+    }
+    return result;
+}
+/**
+ * This returns all MapLibre layers that correspond to a position in a MapContext
+ * @param map
+ * @param position
+ */
 export function getLayersAtPosition(map, position) {
+    let layerId = undefined;
+    let layerHash = undefined;
+    const result = [];
     const layers = map.getStyle().layers;
-    const layersWithSource = layers.filter((layer) => layer.type !== "background");
-    return layersWithSource.filter((layer) => layer.metadata?.sourcePosition ===
-        position);
+    let currentPosition = -1;
+    for (let i = 0; i < layers.length; i++) {
+        const layer = layers[i];
+        const metadata = layer.metadata;
+        if (metadata?.layerId !== layerId || metadata?.layerHash !== layerHash) {
+            currentPosition++;
+            layerId = metadata?.layerId;
+            layerHash = metadata?.layerHash;
+        }
+        if (currentPosition === position) {
+            result.push(layer);
+        }
+    }
+    return result;
 }
-export function getBeforeId(map, position) {
-    const beforeLayer = map
-        .getStyle()
-        .layers.find((layer) => layer.metadata.sourcePosition ===
-        position + 1);
-    return beforeLayer ? beforeLayer.id : undefined;
+/**
+ * This returns the id of the first MapLibre layer that corresponds to the given MapContext position;
+ * used as a beforeId for adding/moving layers
+ * @param map
+ * @param position
+ */
+export function getFirstLayerIdAtPosition(map, position) {
+    let layerId = undefined;
+    let layerHash = undefined;
+    const layers = map.getStyle().layers;
+    let currentPosition = -1;
+    for (let i = 0; i < layers.length; i++) {
+        const layer = layers[i];
+        const metadata = layer.metadata;
+        if (metadata?.layerId !== layerId || metadata?.layerHash !== layerHash) {
+            currentPosition++;
+            if (currentPosition === position) {
+                return layer.id;
+            }
+            layerId = metadata?.layerId;
+            layerHash = metadata?.layerHash;
+        }
+    }
+    return undefined;
 }
-export function generateLayerId(layerModel) {
-    return getHash(layerModel, [
-        "name",
-        "style",
-        "visibility",
-        "opacity",
-        "version",
-        "extras",
-    ]);
+const UPDATABLE_PROPERTIES = [
+    "opacity",
+    "visibility",
+    "label",
+    "extras",
+    "version",
+    // "attributions", // currently, updating the attribution means recreating the source & layer
+    // TODO (when available) "zIndex"
+];
+/**
+ * This generates a layer hash that stays consistent even if updatable properties change.
+ * @param layerModel
+ */
+export function generateLayerHashWithoutUpdatableProps(layerModel) {
+    return getHash(layerModel, UPDATABLE_PROPERTIES);
+}
+/**
+ * Incremental update is possible only if certain properties are changed: opacity,
+ * visibility, zIndex, etc.
+ *
+ * Note: we assume that both layers are different versions of the same layer (this
+ * will not be checked again)
+ * @param oldLayer
+ * @param newLayer
+ * @return Returns `true` if the only properties changed are the updatable ones
+ */
+export function canDoIncrementalUpdate(oldLayer, newLayer) {
+    const oldHash = generateLayerHashWithoutUpdatableProps(oldLayer);
+    const newHash = generateLayerHashWithoutUpdatableProps(newLayer);
+    // true if only updatable props have changed between the two versions of the layer
+    return oldHash === newHash;
+}
+/**
+ * This simply generates a unique id
+ */
+export function generateLayerId() {
+    return Math.floor(Math.random() * 1000000).toString(10);
+}
+/**
+ * Will apply generic properties to the layer; only changes the necessary
+ * properties to avoid updating the map too often
+ * @param map
+ * @param layer
+ * @param layerModel
+ * @param previousLayerModel
+ */
+export function updateLayerProperties(map, layer, layerModel, previousLayerModel) {
+    function shouldApplyProperty(prop) {
+        // if the new layer model does not define that property, skip it
+        // (setting or resetting it to a default value would be counter-intuitive)
+        if (!(prop in layerModel) || typeof layerModel[prop] === "undefined")
+            return false;
+        // if the value did not change in the new layer model, skip it
+        if (layerModel[prop] === previousLayerModel[prop]) {
+            return false;
+        }
+        // any other case: apply the property
+        return true;
+    }
+    const layerId = layer.id;
+    const layerType = layer.type;
+    if (shouldApplyProperty("visibility")) {
+        map.setLayoutProperty(layerId, "visibility", layerModel.visibility === false ? "none" : "visible");
+    }
+    if (shouldApplyProperty("opacity")) {
+        getOpacityPaintPropNames(layerType).forEach((paintProp) => {
+            map.setPaintProperty(layerId, paintProp, layerModel.opacity ?? 1);
+        });
+    }
+    // TODO: z-index
 }

package/dist/map/apply-context-diff.d.ts

@@ -1,9 +1,18 @@
-import { MapContextDiff } from "@geospatial-sdk/core";
-import { Map } from "maplibre-gl";
+import { MapContextDiff, MapContextLayer } from "@geospatial-sdk/core";
+import type { Map } from "maplibre-gl";
+/**
+ * This will either update the layers in the map or recreate them;
+ * the returned promise resolves when the update is done
+ * @param map
+ * @param layerModel
+ * @param previousLayerModel
+ * @param layerPosition
+ */
+export declare function updateLayerInMap(map: Map, layerModel: MapContextLayer, previousLayerModel: MapContextLayer, layerPosition: number): Promise<void>;
 /**
  * Apply a context diff to an MapLibre map
  * @param map
  * @param contextDiff
  */
-export declare function applyContextDiffToMap(map: Map, contextDiff: MapContextDiff): Promise<void>;
+export declare function applyContextDiffToMap(map: Map, contextDiff: MapContextDiff): Promise<Map>;
 //# sourceMappingURL=apply-context-diff.d.ts.map

package/dist/map/apply-context-diff.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"apply-context-diff.d.ts","sourceRoot":"","sources":["../../lib/map/apply-context-diff.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AASlC;;;;GAIG;AACH,wBAAsB,qBAAqB,CACzC,GAAG,EAAE,GAAG,EACR,WAAW,EAAE,cAAc,GAC1B,OAAO,CAAC,IAAI,CAAC,CAsEf"}
+{"version":3,"file":"apply-context-diff.d.ts","sourceRoot":"","sources":["../../lib/map/apply-context-diff.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvE,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAUvC;;;;;;;GAOG;AACH,wBAAsB,gBAAgB,CACpC,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,eAAe,EAC3B,kBAAkB,EAAE,eAAe,EACnC,aAAa,EAAE,MAAM,GACpB,OAAO,CAAC,IAAI,CAAC,CA+Bf;AAED;;;;GAIG;AACH,wBAAsB,qBAAqB,CACzC,GAAG,EAAE,GAAG,EACR,WAAW,EAAE,cAAc,GAC1B,OAAO,CAAC,GAAG,CAAC,CAgGd"}

package/dist/map/apply-context-diff.js

@@ -1,5 +1,43 @@
 import { createLayer } from "./create-map.js";
-import { generateLayerId, getBeforeId, getLayersAtPosition, removeLayersFromSource, } from "../helpers/map.helpers.js";
+import { canDoIncrementalUpdate, getFirstLayerIdAtPosition, getLayersAtPosition, getLayersFromContextLayer, updateLayerProperties, } from "../helpers/map.helpers.js";
+/**
+ * This will either update the layers in the map or recreate them;
+ * the returned promise resolves when the update is done
+ * @param map
+ * @param layerModel
+ * @param previousLayerModel
+ * @param layerPosition
+ */
+export async function updateLayerInMap(map, layerModel, previousLayerModel, layerPosition) {
+    // if an incremental update is possible, do it to avoid costly layer recreation
+    if (canDoIncrementalUpdate(previousLayerModel, layerModel)) {
+        // we can find the existing layers by using the hash or id of the layerModel
+        const mlUpdatedLayers = getLayersFromContextLayer(map, layerModel);
+        for (const layer of mlUpdatedLayers) {
+            updateLayerProperties(map, layer, layerModel, previousLayerModel);
+        }
+        return;
+    }
+    const mlLayersToRemove = getLayersAtPosition(map, layerPosition);
+    const sourcesToRemove = [];
+    for (const layer of mlLayersToRemove) {
+        if (layer.source && !sourcesToRemove.includes(layer.source)) {
+            sourcesToRemove.push(layer.source);
+        }
+        map.removeLayer(layer.id);
+    }
+    for (const sourceId of sourcesToRemove) {
+        map.removeSource(sourceId);
+    }
+    const styleDiff = await createLayer(layerModel);
+    if (!styleDiff)
+        return;
+    const beforeId = getFirstLayerIdAtPosition(map, layerPosition);
+    Object.keys(styleDiff.sources).forEach((sourceId) => map.addSource(sourceId, styleDiff.sources[sourceId]));
+    styleDiff.layers.map((layer) => {
+        map.addLayer(layer, beforeId);
+    });
+}
 /**
  * Apply a context diff to an MapLibre map
  * @param map
@@ -10,7 +48,7 @@ export async function applyContextDiffToMap(map, contextDiff) {
     if (contextDiff.layersRemoved.length > 0) {
         const removed = contextDiff.layersRemoved.sort((a, b) => b.position - a.position);
         for (const layerRemoved of removed) {
-            const mlLayers = getLayersAtPosition(map, layerRemoved.position);
+            const mlLayers = getLayersFromContextLayer(map, layerRemoved.layer);
             if (mlLayers.length === 0) {
                 console.warn(`[Warning] applyContextDiffToMap: no layer found at position ${layerRemoved.position} to remove.`);
                 continue;
@@ -23,26 +61,41 @@ export async function applyContextDiffToMap(map, contextDiff) {
         }
     }
     // insert added layers
-    const newLayers = await Promise.all(contextDiff.layersAdded.map((layerAdded) => createLayer(layerAdded.layer, layerAdded.position)));
+    const newLayers = await Promise.all(contextDiff.layersAdded.map((layerAdded) => createLayer(layerAdded.layer)));
     newLayers.forEach((style, index) => {
+        if (!style)
+            return;
         const position = contextDiff.layersAdded[index].position;
-        const beforeId = getBeforeId(map, position);
+        const beforeId = getFirstLayerIdAtPosition(map, position);
         Object.keys(style.sources).forEach((sourceId) => map.addSource(sourceId, style.sources[sourceId]));
         style.layers.map((layer) => {
             map.addLayer(layer, beforeId);
         });
     });
+    // handle reordered layers (sorted by ascending new position)
+    if (contextDiff.layersReordered.length > 0) {
+        const reordered = contextDiff.layersReordered.sort((a, b) => a.newPosition - b.newPosition);
+        // collect all layers to be moved
+        const mlLayersToMove = reordered.map((layerReordered) => getLayersFromContextLayer(map, layerReordered.layer));
+        // move layers
+        for (let i = 0; i < reordered.length; i++) {
+            const layerReordered = reordered[i];
+            const mlLayers = mlLayersToMove[i];
+            const beforeId = getFirstLayerIdAtPosition(map, layerReordered.newPosition + 1);
+            if (mlLayers[0].id === beforeId) {
+                // layer is already at the right position
+                continue;
+            }
+            // then we add the moved the layer to its new position
+            for (const layer of mlLayers) {
+                map.moveLayer(layer.id, beforeId);
+            }
+        }
+    }
     // recreate changed layers
     for (const layerChanged of contextDiff.layersChanged) {
-        const { layer, position } = layerChanged;
-        const sourceId = generateLayerId(layer);
-        removeLayersFromSource(map, sourceId);
-        const beforeId = getBeforeId(map, position);
-        createLayer(layer, position).then((styleDiff) => {
-            styleDiff.layers.map((layer) => {
-                map.addLayer(layer, beforeId);
-            });
-        });
+        const { layer, previousLayer, position } = layerChanged;
+        await updateLayerInMap(map, layer, previousLayer, position);
     }
     if (typeof contextDiff.viewChanges !== "undefined") {
         const { viewChanges } = contextDiff;
@@ -57,4 +110,5 @@ export async function applyContextDiffToMap(map, contextDiff) {
             });
         }
     }
+    return map;
 }

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

@@ -1,11 +1,15 @@
 import { MapContext, MapContextLayer } from "@geospatial-sdk/core";
 import { Map, MapOptions } from "maplibre-gl";
 import { PartialStyleSpecification } from "../maplibre.models.js";
-export declare function createLayer(layerModel: MapContextLayer, sourcePosition: number): Promise<PartialStyleSpecification>;
 /**
- * Create an Maplibre map from a context; optionally specify a target (root element) for the map
+ * Create a Maplibre layer from a MapContextLayer. Returns null if the layer could not be created.
+ * @param layerModel
+ */
+export declare function createLayer(layerModel: MapContextLayer): Promise<PartialStyleSpecification | null>;
+/**
+ * Create a Maplibre map from a context; map options need to be provided
  * @param context
- * @param target
+ * @param mapOptions
  */
 export declare function createMapFromContext(context: MapContext, mapOptions: MapOptions): Promise<Map>;
 /**

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,EAGhB,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EAEL,GAAG,EACH,UAAU,EAEX,MAAM,aAAa,CAAC;AAWrB,OAAO,EAAW,yBAAyB,EAAE,MAAM,uBAAuB,CAAC;AAO3E,wBAAsB,WAAW,CAC/B,UAAU,EAAE,eAAe,EAC3B,cAAc,EAAE,MAAM,GACrB,OAAO,CAAC,yBAAyB,CAAC,CAgGpC;AAED;;;;GAIG;AACH,wBAAsB,oBAAoB,CACxC,OAAO,EAAE,UAAU,EACnB,UAAU,EAAE,UAAU,GACrB,OAAO,CAAC,GAAG,CAAC,CAGd;AAED;;;;GAIG;AACH,wBAAsB,mBAAmB,CACvC,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,UAAU,GAClB,OAAO,CAAC,GAAG,CAAC,CAoBd"}
+{"version":3,"file":"create-map.d.ts","sourceRoot":"","sources":["../../lib/map/create-map.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACV,eAAe,EAGhB,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EAAsB,GAAG,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAYlE,OAAO,EAEL,yBAAyB,EAC1B,MAAM,uBAAuB,CAAC;AAO/B;;;GAGG;AACH,wBAAsB,WAAW,CAC/B,UAAU,EAAE,eAAe,GAC1B,OAAO,CAAC,yBAAyB,GAAG,IAAI,CAAC,CAiI3C;AAED;;;;GAIG;AACH,wBAAsB,oBAAoB,CACxC,OAAO,EAAE,UAAU,EACnB,UAAU,EAAE,UAAU,GACrB,OAAO,CAAC,GAAG,CAAC,CAGd;AAED;;;;GAIG;AACH,wBAAsB,mBAAmB,CACvC,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,UAAU,GAClB,OAAO,CAAC,GAAG,CAAC,CAqBd"}

package/dist/map/create-map.js

@@ -1,16 +1,23 @@
 import { removeSearchParams, } from "@geospatial-sdk/core";
-import { Map, } from "maplibre-gl";
+import { Map } from "maplibre-gl";
 import { OgcApiEndpoint, WfsEndpoint, WmsEndpoint, } from "@camptocamp/ogc-client";
-import { createDatasetFromGeoJsonLayer, generateLayerId, } from "../helpers/map.helpers.js";
+import { createDatasetFromGeoJsonLayer, generateLayerHashWithoutUpdatableProps, generateLayerId, } from "../helpers/map.helpers.js";
 const featureCollection = {
     type: "FeatureCollection",
     features: [],
 };
-export async function createLayer(layerModel, sourcePosition) {
+/**
+ * Create a Maplibre layer from a MapContextLayer. Returns null if the layer could not be created.
+ * @param layerModel
+ */
+export async function createLayer(layerModel) {
     const { type } = layerModel;
+    const metadata = "id" in layerModel
+        ? { layerId: layerModel.id }
+        : { layerHash: generateLayerHashWithoutUpdatableProps(layerModel) };
+    const layerId = generateLayerId();
     switch (type) {
         case "wms": {
-            const layerId = generateLayerId(layerModel);
             const sourceId = layerId;
             const endpoint = await new WmsEndpoint(layerModel.url).isReady();
             let url = endpoint.getMapUrl([layerModel.name], {
@@ -22,7 +29,7 @@ export async function createLayer(layerModel, sourcePosition) {
             });
             url = removeSearchParams(url, ["bbox"]);
             url = `${url.toString()}&BBOX={bbox-epsg-3857}`;
-            const dataset = {
+            return {
                 sources: {
                     [sourceId]: {
                         type: "raster",
@@ -35,14 +42,16 @@ export async function createLayer(layerModel, sourcePosition) {
                         id: layerId,
                         type: "raster",
                         source: sourceId,
-                        paint: {},
-                        metadata: {
-                            sourcePosition,
+                        paint: {
+                            "raster-opacity": layerModel.opacity ?? 1,
                         },
+                        layout: {
+                            visibility: layerModel.visibility === false ? "none" : "visible",
+                        },
+                        metadata,
                     },
                 ],
             };
-            return dataset;
         }
         case "wfs": {
             const entryPoint = await new WfsEndpoint(layerModel.url).isReady();
@@ -50,7 +59,7 @@ export async function createLayer(layerModel, sourcePosition) {
                 asJson: true,
                 outputCrs: "EPSG:4326",
             });
-            return createDatasetFromGeoJsonLayer(layerModel, url, sourcePosition);
+            return createDatasetFromGeoJsonLayer(layerModel, url, metadata);
         }
         case "geojson": {
             let geojson;
@@ -72,33 +81,63 @@ export async function createLayer(layerModel, sourcePosition) {
                     geojson = data;
                 }
             }
-            return createDatasetFromGeoJsonLayer(layerModel, geojson, sourcePosition);
+            return createDatasetFromGeoJsonLayer(layerModel, geojson, metadata);
         }
         case "ogcapi": {
             const ogcEndpoint = new OgcApiEndpoint(layerModel.url);
-            let layerUrl;
             if (layerModel.useTiles) {
                 console.warn("[Warning] OGC API - Tiles not yet implemented.");
+                return null;
             }
-            else {
-                layerUrl = await ogcEndpoint.getCollectionItemsUrl(layerModel.collection, { ...layerModel.options, asJson: true });
-                return createDatasetFromGeoJsonLayer(layerModel, layerUrl, sourcePosition);
-            }
-            break;
+            const layerUrl = await ogcEndpoint.getCollectionItemsUrl(layerModel.collection, { ...layerModel.options, asJson: true });
+            return createDatasetFromGeoJsonLayer(layerModel, layerUrl, metadata);
         }
         case "maplibre-style": {
             console.warn("[Warning] Maplibre style - Not yet fully implemented.");
             const style = await fetch(layerModel.styleUrl).then((res) => res.json());
-            style.layers?.forEach((layer) => (layer.metadata = { sourcePosition }));
+            style.layers?.forEach((layer) => (layer.metadata = metadata));
             return style;
         }
+        case "xyz": {
+            const sourceId = layerId;
+            return {
+                sources: {
+                    [sourceId]: {
+                        type: "raster",
+                        tiles: [layerModel.url],
+                        tileSize: 256,
+                    },
+                },
+                layers: [
+                    {
+                        id: layerId,
+                        type: "raster",
+                        source: sourceId,
+                        paint: {
+                            "raster-opacity": layerModel.opacity ?? 1,
+                        },
+                        layout: {
+                            visibility: layerModel.visibility === false ? "none" : "visible",
+                        },
+                        metadata,
+                    },
+                ],
+            };
+        }
+        case "wmts": {
+            console.warn(`WMTS layers are not yet supported in Maplibre`, layerModel);
+            return null;
+        }
+        default: {
+            console.error(`Layer could not be created`, layerModel);
+            return null;
+        }
     }
-    return {};
 }
 /**
- * Create an Maplibre map from a context; optionally specify a target (root element) for the map
+ * Create a Maplibre map from a context; map options need to be provided
  * @param context
- * @param target
+ * @param mapOptions
  */
 export async function createMapFromContext(context, mapOptions) {
     const map = new Map(mapOptions);
@@ -114,7 +153,9 @@ export async function resetMapFromContext(map, context) {
     map.setCenter(context.view.center);
     for (let i = 0; i < context.layers.length; i++) {
         const layerModel = context.layers[i];
-        const partialMLStyle = await createLayer(layerModel, i);
+        const partialMLStyle = await createLayer(layerModel);
+        if (!partialMLStyle)
+            continue;
         if (partialMLStyle.glyphs) {
             map.setGlyphs(partialMLStyle.glyphs);
         }

package/dist/maplibre.models.d.ts

@@ -2,7 +2,8 @@ import { BackgroundLayerSpecification, LayerSpecification, StyleSpecification }
 import { MapContextLayerGeojson, MapContextLayerOgcApi, MapContextLayerWfs } from "@geospatial-sdk/core";
 export type LayerSpecificationWithSource = Exclude<LayerSpecification, BackgroundLayerSpecification>;
 export interface LayerMetadataSpecification {
-    sourcePosition: number;
+    layerId?: number | string;
+    layerHash?: string;
 }
 export type LayerContextWithStyle = MapContextLayerWfs | MapContextLayerOgcApi | MapContextLayerGeojson;
 export type Dataset = Pick<StyleSpecification, "sources" | "layers">;

package/dist/maplibre.models.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"maplibre.models.d.ts","sourceRoot":"","sources":["../lib/maplibre.models.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,4BAA4B,EAC5B,kBAAkB,EAClB,kBAAkB,EACnB,MAAM,aAAa,CAAC;AACrB,OAAO,EACL,sBAAsB,EACtB,qBAAqB,EACrB,kBAAkB,EACnB,MAAM,sBAAsB,CAAC;AAE9B,MAAM,MAAM,4BAA4B,GAAG,OAAO,CAChD,kBAAkB,EAClB,4BAA4B,CAC7B,CAAC;AAEF,MAAM,WAAW,0BAA0B;IACzC,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,MAAM,qBAAqB,GAC7B,kBAAkB,GAClB,qBAAqB,GACrB,sBAAsB,CAAC;AAE3B,MAAM,MAAM,OAAO,GAAG,IAAI,CAAC,kBAAkB,EAAE,SAAS,GAAG,QAAQ,CAAC,CAAC;AAErE,MAAM,MAAM,yBAAyB,GAAG,OAAO,GAAG;IAChD,MAAM,CAAC,EAAE,kBAAkB,CAAC,QAAQ,CAAC,CAAC;IACtC,MAAM,CAAC,EAAE,kBAAkB,CAAC,QAAQ,CAAC,CAAC;CACvC,CAAC"}
+{"version":3,"file":"maplibre.models.d.ts","sourceRoot":"","sources":["../lib/maplibre.models.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,4BAA4B,EAC5B,kBAAkB,EAClB,kBAAkB,EACnB,MAAM,aAAa,CAAC;AACrB,OAAO,EACL,sBAAsB,EACtB,qBAAqB,EACrB,kBAAkB,EACnB,MAAM,sBAAsB,CAAC;AAE9B,MAAM,MAAM,4BAA4B,GAAG,OAAO,CAChD,kBAAkB,EAClB,4BAA4B,CAC7B,CAAC;AAEF,MAAM,WAAW,0BAA0B;IACzC,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,MAAM,qBAAqB,GAC7B,kBAAkB,GAClB,qBAAqB,GACrB,sBAAsB,CAAC;AAE3B,MAAM,MAAM,OAAO,GAAG,IAAI,CAAC,kBAAkB,EAAE,SAAS,GAAG,QAAQ,CAAC,CAAC;AAErE,MAAM,MAAM,yBAAyB,GAAG,OAAO,GAAG;IAChD,MAAM,CAAC,EAAE,kBAAkB,CAAC,QAAQ,CAAC,CAAC;IACtC,MAAM,CAAC,EAAE,kBAAkB,CAAC,QAAQ,CAAC,CAAC;CACvC,CAAC"}