aur-openlayers 19.6.11 → 19.6.12

package/fesm2022/aur-openlayers.mjs

@@ -211,6 +211,114 @@ function collectLayersExtent(layers, layerIds) {
     return isEmpty(extent) ? null : extent;
 }
 
+/**
+ * Композитит canvas'ы ОДНОГО viewport карты в офскрин-canvas заданного размера.
+ *
+ * Берёт только `.ol-layer canvas` внутри переданного `viewport` (а не из всего
+ * документа), применяя per-canvas `opacity` родителя и матрицу `style.transform`
+ * по образцу официального примера экспорта OpenLayers. Размер результата всегда
+ * равен `[width, height]`; high-DPR backing слоёв ужимается в него через матрицу.
+ */
+function compositeViewport(viewport, [width, height], opts = {}) {
+    const out = document.createElement('canvas');
+    out.width = width;
+    out.height = height;
+    const ctx = out.getContext('2d');
+    if (opts.background) {
+        ctx.fillStyle = opts.background;
+        ctx.fillRect(0, 0, width, height);
+    }
+    const canvases = viewport.querySelectorAll('.ol-layer canvas, canvas.ol-layer');
+    canvases.forEach((canvas) => {
+        if (canvas.width === 0 || canvas.height === 0)
+            return;
+        const parent = canvas.parentNode;
+        const opacity = parent?.style.opacity || canvas.style.opacity;
+        ctx.globalAlpha = opacity === '' ? 1 : Number(opacity);
+        const transform = canvas.style.transform;
+        const match = transform ? transform.match(/^matrix\(([^)]+)\)$/) : null;
+        const matrix = match
+            ? match[1].split(',').map(Number)
+            : [
+                (parseFloat(canvas.style.width) || canvas.width) / canvas.width,
+                0,
+                0,
+                (parseFloat(canvas.style.height) || canvas.height) / canvas.height,
+                0,
+                0,
+            ];
+        ctx.setTransform(matrix[0], matrix[1], matrix[2], matrix[3], matrix[4], matrix[5]);
+        const bgColor = parent?.style.backgroundColor;
+        if (bgColor) {
+            ctx.fillStyle = bgColor;
+            ctx.fillRect(0, 0, canvas.width, canvas.height);
+        }
+        ctx.drawImage(canvas, 0, 0);
+    });
+    ctx.globalAlpha = 1;
+    ctx.setTransform(1, 0, 0, 1, 0, 0);
+    return out;
+}
+
+/**
+ * Создаёт функцию `exportImage` для конкретной карты.
+ *
+ * Параллельные вызовы сериализуются (общий мутируемый `map`): каждый следующий
+ * экспорт стартует только после завершения предыдущего. Цикл одного экспорта:
+ * snapshot → setSize → fit → ожидание `rendercomplete` → композит → restore.
+ *
+ * Инвариант: подписка `map.once('rendercomplete')` и последующие
+ * `setSize`/`fit`/`render` выполняются синхронно (никаких `await` до подписки),
+ * иначе следующий экспорт мог бы поймать `rendercomplete` от restore-рендера
+ * предыдущего.
+ */
+function createExportImage(map) {
+    let tail = Promise.resolve();
+    const doExport = async (options) => {
+        const view = map.getView();
+        const size0 = map.getSize();
+        if (!size0) {
+            throw new Error('exportImage: map has no size yet (is it added to the DOM?)');
+        }
+        const resolution0 = view.getResolution();
+        const center0 = view.getCenter();
+        const extent0 = view.calculateExtent(size0);
+        const { size, format = 'image/png', quality = 0.92, background, fit = 'currentExtent', } = options;
+        try {
+            const rendered = new Promise((resolve) => {
+                map.once('rendercomplete', () => resolve());
+            });
+            map.setSize(size);
+            if (fit === 'currentExtent') {
+                view.fit(extent0, { size });
+            }
+            else {
+                if (resolution0 != null)
+                    view.setResolution(resolution0);
+                if (center0)
+                    view.setCenter(center0);
+            }
+            map.render(); // гарантия кадра даже при size === size0
+            await rendered;
+            const canvas = compositeViewport(map.getViewport(), size, { background });
+            return canvas.toDataURL(format, quality);
+        }
+        finally {
+            map.setSize(size0);
+            if (resolution0 != null)
+                view.setResolution(resolution0);
+            if (center0)
+                view.setCenter(center0);
+            map.render();
+        }
+    };
+    return (options) => {
+        const run = tail.then(() => doExport(options));
+        tail = run.catch(() => { }); // очередь переживает ошибку одного экспорта
+        return run;
+    };
+}
+
 const createMapContext = (map, layers, popupHost, scheduler = new FlushScheduler()) => {
     return {
         map,
@@ -227,6 +335,7 @@ const createMapContext = (map, layers, popupHost, scheduler = new FlushScheduler
             if (extent)
                 map.getView().fit(extent, toOlFitOptions(opts, map));
         },
+        exportImage: createExportImage(map),
     };
 };