@orbat-mapper/tactical-draw-adapter-maplibre 0.2.0 → 0.2.2

package/dist/index.d.mts

@@ -32,6 +32,19 @@ interface MapLibreGroupBundle {
    */
   revision?: number;
   requiredIconIds: ReadonlySet<string>;
+  overlays: Map<string, MapLibreImageOverlayHandle>;
+}
+/**
+ * Last-applied scalar state for a rendered image overlay, used to skip
+ * MapLibre's `ImageSource.updateImage` (which re-fetches and re-decodes the
+ * raster) whenever nothing but the position changed.
+ */
+interface MapLibreImageOverlayHandle {
+  sourceId: string;
+  layerId: string;
+  url: string;
+  opacity: number;
+  coordinates: readonly [Position, Position, Position, Position];
 }
 type MapLibreEventToken = (e: any) => void;
 interface MapLibreViewToken {
@@ -57,6 +70,7 @@ declare class MapLibreAdapter extends BaseMapAdapter<MapLibreLayerHandle, MapLib
   protected applyFeatureGroups(layerId: LayerId, groups: readonly FeatureGroup[]): void;
   private createGroupBundle;
   private destroyGroupBundle;
+  private reconcileGroupImageOverlays;
   private clearGroupBundles;
   private requiredIconIds;
   private reconcileGroupChannels;

package/dist/index.mjs

@@ -8,6 +8,14 @@ const DEFAULT_LINE_WIDTH = 2;
 function isHatchPattern(value) {
 	return HATCH_PATTERNS.includes(value);
 }
+function coordinatesEqual(a, b) {
+	for (let index = 0; index < 4; index++) {
+		const pa = a[index];
+		const pb = b[index];
+		if (pa[0] !== pb[0] || pa[1] !== pb[1]) return false;
+	}
+	return true;
+}
 const PAINT_CHANNELS = [
 	"fill",
 	"fill-pattern",
@@ -17,6 +25,7 @@ const PAINT_CHANNELS = [
 	"text"
 ];
 function firstBundleLayerId(bundle) {
+	for (const overlay of bundle.overlays.values()) return overlay.layerId;
 	for (const channel of PAINT_CHANNELS) {
 		const layerId = bundle.layerIds.get(channel);
 		if (layerId) return layerId;
@@ -907,6 +916,7 @@ var MapLibreAdapter = class extends BaseMapAdapter {
 			bundle.features = group.features;
 			bundle.revision = group.revision;
 			bundle.requiredIconIds = requiredIconIds;
+			if (this.reconcileGroupImageOverlays(handle, bundle, group.imageOverlays ?? [])) bundlesNeedingOrder.add(group.id);
 			if (this.reconcileGroupChannels(handle, bundle, groupPaintChannels(group.features, handle.style))) bundlesNeedingOrder.add(group.id);
 			if (contentChanged || resourcesChanged) this.updateGroupBundleSource(bundle);
 		}
@@ -927,13 +937,73 @@ var MapLibreAdapter = class extends BaseMapAdapter {
 			sourceFeatures: [],
 			sourceInitialized: false,
 			featureSignature: "[]",
-			requiredIconIds: /* @__PURE__ */ new Set()
+			requiredIconIds: /* @__PURE__ */ new Set(),
+			overlays: /* @__PURE__ */ new Map()
 		};
 	}
 	destroyGroupBundle(bundle) {
+		for (const overlay of bundle.overlays.values()) {
+			if (this.map.getLayer(overlay.layerId)) this.map.removeLayer(overlay.layerId);
+			if (this.map.getSource(overlay.sourceId)) this.map.removeSource(overlay.sourceId);
+		}
 		for (const layerId of bundle.layerIds.values()) if (this.map.getLayer(layerId)) this.map.removeLayer(layerId);
 		if (this.map.getSource(bundle.sourceId)) this.map.removeSource(bundle.sourceId);
 	}
+	reconcileGroupImageOverlays(handle, bundle, overlays) {
+		let structureChanged = false;
+		const desiredIds = new Set(overlays.map((overlay) => overlay.id));
+		for (const [id, native] of bundle.overlays) {
+			if (desiredIds.has(id)) continue;
+			if (this.map.getLayer(native.layerId)) this.map.removeLayer(native.layerId);
+			if (this.map.getSource(native.sourceId)) this.map.removeSource(native.sourceId);
+			bundle.overlays.delete(id);
+			structureChanged = true;
+		}
+		for (const overlay of overlays) {
+			const existing = bundle.overlays.get(overlay.id);
+			const url = overlay.url;
+			if (!existing) {
+				const suffix = `${bundle.sourceId}-${encodeURIComponent(overlay.id)}`;
+				const sourceId = `${suffix}-image-src`;
+				const layerId = `${suffix}-image`;
+				this.map.addSource(sourceId, {
+					type: "image",
+					url,
+					coordinates: overlay.coordinates
+				});
+				this.map.addLayer({
+					id: layerId,
+					type: "raster",
+					source: sourceId,
+					paint: { "raster-opacity": overlay.opacity }
+				}, handle.mlLayerIds[0]);
+				bundle.overlays.set(overlay.id, {
+					sourceId,
+					layerId,
+					url,
+					opacity: overlay.opacity,
+					coordinates: overlay.coordinates
+				});
+				structureChanged = true;
+				continue;
+			}
+			const urlChanged = existing.url !== url;
+			const coordinatesChanged = !coordinatesEqual(existing.coordinates, overlay.coordinates);
+			const opacityChanged = existing.opacity !== overlay.opacity;
+			if (!urlChanged && !coordinatesChanged && !opacityChanged) continue;
+			const source = this.map.getSource(existing.sourceId);
+			if (urlChanged) source?.updateImage?.({
+				url,
+				coordinates: overlay.coordinates.map((point) => [...point])
+			});
+			else if (coordinatesChanged) source?.setCoordinates?.(overlay.coordinates.map((point) => [...point]));
+			if (opacityChanged) this.map.setPaintProperty(existing.layerId, "raster-opacity", overlay.opacity);
+			existing.url = url;
+			existing.opacity = overlay.opacity;
+			existing.coordinates = overlay.coordinates;
+		}
+		return structureChanged;
+	}
 	clearGroupBundles(handle) {
 		for (const bundle of handle.groupBundles.values()) this.destroyGroupBundle(bundle);
 		handle.groupBundles.clear();
@@ -1035,15 +1105,22 @@ var MapLibreAdapter = class extends BaseMapAdapter {
 			const groupId = desiredGroupIds[index];
 			const bundle = handle.groupBundles.get(groupId);
 			if (!bundle) continue;
-			if (forcedGroupIds.has(groupId) || stableGroupIds !== null && !stableGroupIds.has(groupId)) for (const channel of PAINT_CHANNELS) {
-				const layerId = bundle.layerIds.get(channel);
-				if (layerId && this.map.getLayer(layerId)) this.map.moveLayer(layerId, beforeId);
+			if (forcedGroupIds.has(groupId) || stableGroupIds !== null && !stableGroupIds.has(groupId)) {
+				for (const overlay of bundle.overlays.values()) if (this.map.getLayer(overlay.layerId)) this.map.moveLayer(overlay.layerId, beforeId);
+				for (const channel of PAINT_CHANNELS) {
+					const layerId = bundle.layerIds.get(channel);
+					if (layerId && this.map.getLayer(layerId)) this.map.moveLayer(layerId, beforeId);
+				}
 			}
 			beforeId = firstBundleLayerId(bundle) ?? beforeId;
 		}
 	}
 	nativeLayerIds(handle) {
-		return [...handle.mlLayerIds, ...[...handle.groupBundles.values()].flatMap((bundle) => [...bundle.layerIds.values()])];
+		return [
+			...handle.mlLayerIds,
+			...[...handle.groupBundles.values()].flatMap((bundle) => [...bundle.layerIds.values()]),
+			...[...handle.groupBundles.values()].flatMap((bundle) => [...bundle.overlays.values()].map((overlay) => overlay.layerId))
+		];
 	}
 	/**
 	* Promote a source feature for MapLibre: stamp `_fid` (so data-driven paint

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orbat-mapper/tactical-draw-adapter-maplibre",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "description": "MapLibre GL JS engine adapter for @orbat-mapper/tactical-draw. Draw and edit tactical control measures (MIL-STD-2525 / APP-6) on a MapLibre map.",
   "license": "MIT",
   "author": "Orbat Mapper",
@@ -37,8 +37,8 @@
     "access": "public"
   },
   "dependencies": {
-    "@orbat-mapper/control-measures": "^0.2.0",
-    "@orbat-mapper/tactical-draw": "^0.2.0"
+    "@orbat-mapper/control-measures": "^0.3.1",
+    "@orbat-mapper/tactical-draw": "^0.3.0"
   },
   "peerDependencies": {
     "maplibre-gl": ">=5.8.0 <6.0.0"