diff --git a/assets/src/modules/WMS.js b/assets/src/modules/WMS.js index 6177869a03..f81228b2f4 100644 --- a/assets/src/modules/WMS.js +++ b/assets/src/modules/WMS.js @@ -86,4 +86,29 @@ export default class WMS { body: params, }); } + + /** + * Get legend graphic as PNG image URL from WMS + * @param {object} options - optional parameters which can override this._defaultGetLegendGraphicsParameters + * @returns {string} PNG image URL + * @memberof WMS + */ + getLegendGraphicPNG(options) { + const layers = options['LAYERS'] ?? options['LAYER']; + // Check if layer is specified + if (!layers) { + throw new RequestError( + 'LAYERS or LAYER parameter is required for getLegendGraphic request', + options, + ); + } + + const params = new URLSearchParams({ + ...this._defaultGetLegendGraphicParameters, + ...options, + FORMAT: 'image/png' // Force PNG format for external WMS layers + }); + + return `${globalThis['lizUrls'].wms}?${params}`; + } } diff --git a/assets/src/modules/action/Symbology.js b/assets/src/modules/action/Symbology.js index bb4596440f..fdfa3c724a 100644 --- a/assets/src/modules/action/Symbology.js +++ b/assets/src/modules/action/Symbology.js @@ -32,21 +32,60 @@ export async function updateLayerTreeLayersSymbology(treeLayers, method=HttpRequ if (method.toUpperCase() == HttpRequestMethods.GET) { for (const treeLayer of treeLayers) { - const wmsParams = { - LAYER: treeLayer.wmsName, - STYLES: treeLayer.wmsSelectedStyleName, - }; + // Check if this is an external WMS layer using the backend flag + const layerCfg = treeLayer._mapItemState?._layerItemState?._layerTreeItemCfg?._layerCfg; + const isExternalWMS = layerCfg?._externalWmsToggle === true + || layerCfg?._externalWmsToggle === 'True'; - await wms.getLegendGraphic(wmsParams).then((response) => { - for (const node of response.nodes) { - // If the layer has no symbology, there is no type property - if (node.hasOwnProperty('type')) { - treeLayer.symbology = node; - } + if (isExternalWMS) { + // For external WMS layers, get PNG legend directly + const wmsParams = { + LAYER: treeLayer.wmsName, + STYLES: treeLayer.wmsSelectedStyleName, + LAYERTITLE: 'FALSE', + }; + try { + const pngUrl = wms.getLegendGraphicPNG(wmsParams); + // Fetch the PNG and convert to base64 + const response = await fetch(pngUrl); + const blob = await response.blob(); + const reader = new FileReader(); + + await new Promise((resolve, reject) => { + reader.onloadend = () => { + const base64data = reader.result.split(',')[1]; // Remove data:image/png;base64, prefix + treeLayer.symbology = { + type: 'layer', + name: treeLayer.wmsName, + title: treeLayer.name, + icon: base64data + }; + resolve(); + }; + reader.onerror = reject; + reader.readAsDataURL(blob); + }); + } catch (error) { + console.error('Error loading external WMS legend:', error); + // Fallback to default icon will be handled by symbology state } - }).catch((error) => { - console.error(error); - }); + } else { + // For normal layers, use JSON format + const wmsParams = { + LAYER: treeLayer.wmsName, + STYLES: treeLayer.wmsSelectedStyleName, + }; + await wms.getLegendGraphic(wmsParams).then((response) => { + for (const node of response.nodes) { + // If the layer has no symbology, there is no type property + if (node.hasOwnProperty('type')) { + treeLayer.symbology = node; + } + } + }).catch((error) => { + console.error(error); + }); + } } return treeLayers; } diff --git a/lizmap/modules/lizmap/lib/Project/Project.php b/lizmap/modules/lizmap/lib/Project/Project.php index d12b3132a2..963da7d76a 100644 --- a/lizmap/modules/lizmap/lib/Project/Project.php +++ b/lizmap/modules/lizmap/lib/Project/Project.php @@ -2045,12 +2045,15 @@ public function getUpdatedConfig() && !array_key_exists('crs', $layerDatasource)) { $layerDatasource['crs'] = 'EPSG:3857'; } + // Set externalWmsToggle for ALL external WMS layers (not just EPSG:3857) + $obj->externalWmsToggle = 'True'; + $obj->externalAccess = $layerDatasource; + // if the layer datasource contains type and crs EPSG:3857 - // external access can be provided + // additional external access configuration can be provided if (array_key_exists('type', $layerDatasource) && $layerDatasource['crs'] == 'EPSG:3857') { - $obj->externalWmsToggle = 'True'; - $obj->externalAccess = $layerDatasource; + // Additional external access for EPSG:3857 layers } } }