vue-openlayers-plugin 1.0.71 → 1.0.73

package/lib/index.umd.js

@@ -81994,6 +81994,24 @@ ${this.attributes_.map(
         this.config.opacity = this.config.opacity / 100;
       }
     }
+    /**
+     * 注册自定义投影
+     * @returns 注册的投影代码，如果没有注册则返回 undefined
+     */
+    registerCustomProjection() {
+      const projectionCode = this.config.projection;
+      const projectionDefinition = this.config.projectionDefinition;
+      if (projectionCode && projectionDefinition) {
+        try {
+          proj4$1.defs(projectionCode, projectionDefinition);
+          register$3(proj4$1);
+          return projectionCode;
+        } catch (error2) {
+          console.error(`Failed to register projection ${projectionCode}:`, error2);
+        }
+      }
+      return void 0;
+    }
     /**
      * 获取图层实例（同步方法，用于向后兼容）
      */
@@ -82451,6 +82469,7 @@ ${this.attributes_.map(
      * 创建瓦片数据源
      */
     createTileSource() {
+      this.registerCustomProjection();
       let sourceType = this.getSourceTypeFromLayerType();
       sourceType = sourceType || "xyz";
       switch (sourceType.toLowerCase()) {
@@ -82569,7 +82588,8 @@ ${this.attributes_.map(
      * 创建WMS数据源
      */
     createWMSSource() {
-      return new ImageWMS$1({
+      this.registerCustomProjection();
+      const options = {
         url: this.config.url,
         params: {
           "LAYERS": this.config.wmsLayers || "",
@@ -82579,7 +82599,11 @@ ${this.attributes_.map(
         },
         ratio: 1,
         crossOrigin: "anonymous"
-      });
+      };
+      if (this.config.projection) {
+        options.projection = this.config.projection;
+      }
+      return new ImageWMS$1(options);
     }
     /**
      * 更新WMS参数
@@ -82864,13 +82888,17 @@ ${this.attributes_.map(
      * 创建WMTS数据源
      */
     createWMTSSource() {
-      if (this.config.url && !this.capabilities) {
-        throw new Error("WMTS capabilities must be loaded first. Use loadCapabilities() method.");
+      const wmtsConfig = this.config.wmtsConfig || {};
+      const url = wmtsConfig.url || this.config.url;
+      if (!url) {
+        throw new Error("WMTS URL is required");
       }
+      if (this.config.url && !this.capabilities && !wmtsConfig.resolutions)
+        ;
       if (this.capabilities) {
         const options = optionsFromCapabilities(this.capabilities, {
-          layer: this.config.wmtsLayer || "",
-          matrixSet: this.config.wmtsMatrixSet || "EPSG:4326"
+          layer: wmtsConfig.layer || this.config.layerName || "",
+          matrixSet: wmtsConfig.matrixSet || this.config.matrixSet || "EPSG:4326"
         });
         if (!options) {
           throw new Error("Failed to create WMTS options from capabilities");
@@ -82886,26 +82914,46 @@ ${this.attributes_.map(
           crossOrigin: "anonymous"
         });
       } else {
-        const projection2 = get$c("EPSG:4326");
-        const projectionExtent = projection2.getExtent();
-        const size2 = Math.sqrt(projectionExtent[2] - projectionExtent[0]) / 256;
-        const resolutions = new Array(19);
-        const matrixIds = new Array(19);
-        for (let z2 = 0; z2 < 19; ++z2) {
-          resolutions[z2] = size2 / Math.pow(2, z2);
-          matrixIds[z2] = z2;
+        const projectionCode = wmtsConfig.projection || this.config.projection || "EPSG:4326";
+        const projectionDefinition = wmtsConfig.projectionDefinition || this.config.projectionDefinition;
+        if (projectionDefinition) {
+          proj4$1.defs(projectionCode, projectionDefinition);
+          register$3(proj4$1);
         }
+        const projection2 = get$c(projectionCode);
+        const projectionExtent = projection2.getExtent();
+        let resolutions = wmtsConfig.resolutions || this.config.resolutions;
+        let matrixIds = wmtsConfig.matrixIds || this.config.matrixIds;
+        const tileSize = wmtsConfig.tileSize || 256;
+        const tileSizeNumber = typeof tileSize === "number" ? tileSize : tileSize[0];
+        if (!resolutions) {
+          const width = projectionExtent[2] - projectionExtent[0];
+          const size2 = width / tileSizeNumber;
+          const zoomLevels = 19;
+          resolutions = new Array(zoomLevels);
+          for (let z2 = 0; z2 < zoomLevels; ++z2) {
+            resolutions[z2] = size2 / Math.pow(2, z2);
+          }
+        }
+        if (!matrixIds) {
+          matrixIds = new Array(resolutions.length);
+          for (let z2 = 0; z2 < resolutions.length; ++z2) {
+            matrixIds[z2] = z2.toString();
+          }
+        }
+        const origin = wmtsConfig.origin || this.config.origin || [projectionExtent[0], projectionExtent[3]];
         return new WMTS$3({
-          url: this.config.url,
-          layer: this.config.wmtsLayer || "",
-          matrixSet: this.config.wmtsMatrixSet || "EPSG:4326",
-          format: "image/png",
-          projection: "EPSG:4326",
-          style: this.config.wmtsStyle || "default",
+          url,
+          layer: wmtsConfig.layer || this.config.layerName || "",
+          matrixSet: wmtsConfig.matrixSet || this.config.matrixSet || projectionCode,
+          format: wmtsConfig.format || this.config.format || "image/png",
+          projection: projectionCode,
+          style: wmtsConfig.style || this.config.style || "default",
           tileGrid: new WMTSTileGrid$3({
-            origin: [projectionExtent[0], projectionExtent[3]],
+            origin,
             resolutions,
-            matrixIds
+            matrixIds,
+            tileSize
           }),
           crossOrigin: "anonymous"
         });
@@ -82949,21 +82997,21 @@ ${this.attributes_.map(
      * 设置图层
      */
     setLayer(layer2) {
-      this.config.wmtsLayer = layer2;
+      this.config.layerName = layer2;
       this.layer = null;
     }
     /**
      * 设置矩阵集
      */
     setMatrixSet(matrixSet) {
-      this.config.wmtsMatrixSet = matrixSet;
+      this.config.matrixSet = matrixSet;
       this.layer = null;
     }
     /**
      * 设置样式
      */
     setWMTSStyle(style) {
-      this.config.wmtsStyle = style;
+      this.config.style = style;
       this.layer = null;
     }
     /**
@@ -83768,10 +83816,13 @@ ${this.attributes_.map(
      */
     createVectorSource() {
       var _a3;
+      this.registerCustomProjection();
       const format2 = new GeoJSON$4();
       const mapProjection = ((_a3 = this.map) == null ? void 0 : _a3.getView().getProjection().getCode()) || "EPSG:4326";
+      const dataProjection = this.config.projection || "EPSG:4326";
       if (this.config.data) {
         const features2 = format2.readFeatures(this.config.data, {
+          dataProjection,
           featureProjection: mapProjection
         });
         this.originalFeatures = features2;
@@ -83779,7 +83830,10 @@ ${this.attributes_.map(
       } else if (this.config.url) {
         const source = new VectorSource$2({
           url: this.config.url,
-          format: new GeoJSON$4({ featureProjection: mapProjection })
+          format: new GeoJSON$4({
+            dataProjection,
+            featureProjection: mapProjection
+          })
         });
         source.on("featuresloadend", () => {
           this.originalFeatures = source.getFeatures();
@@ -84172,6 +84226,7 @@ ${this.attributes_.map(
      * 应用过滤器（实现基类的抽象方法）
      */
     applyFilters() {
+      debugger;
       const layer2 = this.getLayer();
       const source = layer2.getSource();
       if (!source)
@@ -84418,6 +84473,7 @@ ${this.attributes_.map(
      * 创建图层
      */
     createLayer() {
+      this.registerCustomProjection();
       this.vectorSource = new VectorSource$2({
         url: this.config.url,
         format: this.kmlFormat
@@ -84693,9 +84749,10 @@ ${this.attributes_.map(
      * 初始化GML格式处理器
      */
     initializeGMLFormat() {
+      this.registerCustomProjection();
       const gmlConfig = this.config.gmlConfig || {};
       this.gmlFormat = new GML$1({
-        srsName: gmlConfig.srsName || "EPSG:4326"
+        srsName: gmlConfig.srsName || this.config.projection || "EPSG:4326"
       });
     }
     /**
@@ -85071,13 +85128,20 @@ ${this.attributes_.map(
      * 从WKT字符串加载数据
      */
     loadWKTFromString(wktString) {
+      var _a3;
       if (!this.wktFormat || !this.vectorSource)
         return;
+      this.registerCustomProjection();
+      const dataProjection = this.config.projection || "EPSG:4326";
+      const featureProjection = ((_a3 = this.map) == null ? void 0 : _a3.getView().getProjection().getCode()) || "EPSG:4326";
       try {
         const wktLines = wktString.split("\n").filter((line2) => line2.trim());
         wktLines.forEach((line2, index2) => {
           try {
-            const geometry2 = this.wktFormat.readGeometry(line2.trim());
+            const geometry2 = this.wktFormat.readGeometry(line2.trim(), {
+              dataProjection,
+              featureProjection
+            });
             const feature2 = new ol$1.Feature({
               geometry: geometry2,
               id: `wkt_feature_${index2}`,
@@ -85163,10 +85227,16 @@ ${this.attributes_.map(
      * 添加WKT几何
      */
     addWKTGeometry(wktString, properties) {
+      var _a3;
       if (!this.wktFormat || !this.vectorSource)
         return null;
+      const dataProjection = this.config.projection || "EPSG:4326";
+      const featureProjection = ((_a3 = this.map) == null ? void 0 : _a3.getView().getProjection().getCode()) || "EPSG:4326";
       try {
-        const geometry2 = this.wktFormat.readGeometry(wktString);
+        const geometry2 = this.wktFormat.readGeometry(wktString, {
+          dataProjection,
+          featureProjection
+        });
         const feature2 = new ol$1.Feature({
           geometry: geometry2,
           wkt: wktString,
@@ -466232,6 +466302,7 @@ ${this.attributes_.map(
      * 创建天地图XYZ数据源
      */
     createTiandituSource() {
+      this.registerCustomProjection();
       const url = this.processUrl(this.config.url || "");
       const xyzOptions = {
         url,
@@ -466628,6 +466699,7 @@ ${this.attributes_.map(
      * 创建矢量瓦片数据源
      */
     createVectorTileSource() {
+      this.registerCustomProjection();
       const config = this.config;
       const format2 = this.createFormat();
       const sourceOptions = {
@@ -466676,7 +466748,7 @@ ${this.attributes_.map(
           });
         case "geojson":
           return new GeoJSON$4({
-            dataProjection: config.dataProjection || "EPSG:4326",
+            dataProjection: config.dataProjection || config.projection || "EPSG:4326",
             featureProjection: config.featureProjection || "EPSG:4326"
           });
         default:
@@ -467148,6 +467220,8 @@ ${this.attributes_.map(
       __publicField(this, "storage");
       // 存储baseLayers配置，用于判断图层是否为底图
       __publicField(this, "baseLayerIds", /* @__PURE__ */ new Set());
+      // 存储共享图层组信息
+      __publicField(this, "sharedLayerGroups", /* @__PURE__ */ new Map());
       this.map = map2;
       this.eventBus = eventBus;
       this.storage = storage2;
@@ -467157,6 +467231,7 @@ ${this.attributes_.map(
      * 添加图层（支持按需加载）
      */
     async addLayer(config) {
+      var _a3, _b3;
       try {
         const layerId = config.id || `layer_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
         if (this.layerHandlers.has(layerId) || this.pendingLayerConfigs.has(layerId)) {
@@ -467171,7 +467246,11 @@ ${this.attributes_.map(
           opacity: config.opacity ?? 1,
           zIndex: config.zIndex ?? 0
         };
-        if (fullConfig.type === "group" && (fullConfig.children || fullConfig.layers)) {
+        const isGroup = fullConfig.type === "group" || (((_a3 = fullConfig.children) == null ? void 0 : _a3.length) ?? 0) > 0 || (((_b3 = fullConfig.layers) == null ? void 0 : _b3.length) ?? 0) > 0;
+        if (isGroup) {
+          if (fullConfig.type !== "group") {
+            fullConfig.type = "group";
+          }
           return this.addLayerGroup(fullConfig);
         }
         if (fullConfig.visible && this.isBasemapLayer(layerId)) {
@@ -467283,6 +467362,174 @@ ${this.attributes_.map(
         console.error("执行定位动画失败:", error2);
       }
     }
+    /**
+     * 设置共享图层样式函数
+     */
+    setupSharedLayerStyle(layer2, reuseId) {
+      if (!(layer2 instanceof VectorLayer$3)) {
+        return;
+      }
+      const originalStyleFunction = layer2.getStyleFunction();
+      layer2.setStyle((function(feature2, resolution) {
+        const group2 = this.sharedLayerGroups.get(reuseId);
+        if (!group2)
+          return null;
+        let matched = false;
+        let styleToUse = null;
+        for (const layerId of group2.logicalLayers) {
+          const config = this.layerConfigs.get(layerId);
+          if (config && config.visible) {
+            try {
+              if (this.checkFeatureFilter(feature2, config.filters)) {
+                matched = true;
+                const handler = this.layerHandlers.get(layerId);
+                if (handler) {
+                  const isFirst = group2.logicalLayers.values().next().value === layerId;
+                  if (isFirst) {
+                    if (originalStyleFunction) {
+                      styleToUse = originalStyleFunction(feature2, resolution);
+                    }
+                  } else {
+                    const logicalLayer = handler.getLayer();
+                    if (logicalLayer && logicalLayer instanceof VectorLayer$3 && logicalLayer !== layer2) {
+                      const styleFunc = logicalLayer.getStyleFunction();
+                      if (styleFunc) {
+                        styleToUse = styleFunc(feature2, resolution);
+                      }
+                    } else {
+                      if (originalStyleFunction) {
+                        styleToUse = originalStyleFunction(feature2, resolution);
+                      }
+                    }
+                  }
+                  if (styleToUse || matched) {
+                    break;
+                  }
+                }
+              }
+            } catch (e3) {
+              console.error("Error checking feature filter:", e3);
+            }
+          }
+        }
+        if (matched) {
+          if (styleToUse)
+            return styleToUse;
+          if (originalStyleFunction)
+            return originalStyleFunction(feature2, resolution);
+          return void 0;
+        }
+        return null;
+      }).bind(this));
+    }
+    /**
+     * 更新共享图层状态（处理WMS参数更新或Vector重绘）
+     */
+    updateSharedLayerState(reuseId) {
+      const group2 = this.sharedLayerGroups.get(reuseId);
+      if (!group2)
+        return;
+      const layer2 = group2.physicalLayer;
+      const source = layer2.getSource();
+      if (source && typeof source.updateParams === "function") {
+        const visibleLayers = Array.from(group2.logicalLayers).filter((id2) => {
+          const config = this.layerConfigs.get(id2);
+          return config && config.visible;
+        });
+        const wmsLayersList = [];
+        const cqlFilterList = [];
+        visibleLayers.forEach((id2) => {
+          var _a3, _b3;
+          const config = this.layerConfigs.get(id2);
+          if (config) {
+            const layers = config.wmsLayers || ((_b3 = (_a3 = config.config) == null ? void 0 : _a3.wms) == null ? void 0 : _b3.layers);
+            if (layers) {
+              wmsLayersList.push(layers);
+              let cql = "";
+              if (config.filters && config.filters.length > 0) {
+                const conditions = config.filters.filter((f2) => f2.enabled && f2.type === FilterType.ATTRIBUTE).map((f2) => {
+                  const attrFilter = f2;
+                  let val = attrFilter.value;
+                  if (typeof val === "string") {
+                    val = `'${val}'`;
+                  }
+                  switch (attrFilter.operator) {
+                    case FilterOperator.EQUAL:
+                      return `${attrFilter.property}=${val}`;
+                    case FilterOperator.NOT_EQUAL:
+                      return `${attrFilter.property}<>${val}`;
+                    case FilterOperator.GREATER_THAN:
+                      return `${attrFilter.property}>${val}`;
+                    case FilterOperator.LESS_THAN:
+                      return `${attrFilter.property}<${val}`;
+                    case FilterOperator.GREATER_EQUAL:
+                      return `${attrFilter.property}>=${val}`;
+                    case FilterOperator.LESS_EQUAL:
+                      return `${attrFilter.property}<=${val}`;
+                    case FilterOperator.LIKE:
+                      return `${attrFilter.property} LIKE ${val}`;
+                    case FilterOperator.IN:
+                      if (Array.isArray(attrFilter.value)) {
+                        const inVals = attrFilter.value.map((v5) => typeof v5 === "string" ? `'${v5}'` : v5).join(",");
+                        return `${attrFilter.property} IN (${inVals})`;
+                      }
+                      return `${attrFilter.property} IN (${attrFilter.value})`;
+                    default:
+                      return "";
+                  }
+                }).filter((c2) => c2 !== "");
+                if (conditions.length > 0) {
+                  cql = conditions.join(" AND ");
+                }
+              }
+              cqlFilterList.push(cql === "" ? "INCLUDE" : cql);
+            }
+          }
+        });
+        if (wmsLayersList.length > 0) {
+          const newLayersParam = wmsLayersList.join(",");
+          const newCqlFilterParam = cqlFilterList.join(";");
+          const params2 = { "LAYERS": newLayersParam };
+          if (cqlFilterList.some((c2) => c2 !== "INCLUDE")) {
+            params2["CQL_FILTER"] = newCqlFilterParam;
+          } else {
+            params2["CQL_FILTER"] = null;
+          }
+          source.updateParams(params2);
+          console.log(`共享WMS图层 ${reuseId} 更新参数: LAYERS=${newLayersParam}, CQL_FILTER=${newCqlFilterParam}`);
+          return;
+        }
+      }
+      layer2.changed();
+    }
+    /**
+     * 检查要素是否匹配过滤条件
+     */
+    checkFeatureFilter(feature2, filters) {
+      if (!filters || filters.length === 0) {
+        return true;
+      }
+      for (const filter2 of filters) {
+        if (!filter2.enabled)
+          continue;
+        if (filter2.type === FilterType.ATTRIBUTE) {
+          const props = feature2.getProperties();
+          const value = props[filter2.property];
+          const targetValue = filter2.value;
+          switch (filter2.operator) {
+            case FilterOperator.EQUAL:
+              if (value != targetValue)
+                return false;
+              break;
+            case FilterOperator.NOT_EQUAL:
+              if (value == targetValue)
+                return false;
+              break;
+          }
+        }
+      }
+      return true;
+    }
     /**
      * 获取缓动函数
      */
@@ -467313,19 +467560,44 @@ ${this.attributes_.map(
      * 异步添加图层
      */
     async addLayerAsync(fullConfig, handler) {
-      var _a3;
+      var _a3, _b3;
       try {
         const layer2 = await handler.getLayerAsync();
         layer2.set("layerId", fullConfig.id);
         this.layerHandlers.set(fullConfig.id, handler);
         this.layerConfigs.set(fullConfig.id, fullConfig);
         console.log("kjthis.layerConfigs:", this.layerConfigs);
-        this.map.addLayer(layer2);
+        let isReuse = false;
+        if (fullConfig.reuseId) {
+          const reuseId = fullConfig.reuseId;
+          let group2 = this.sharedLayerGroups.get(reuseId);
+          if (group2) {
+            console.log(`图层 ${fullConfig.id} 复用物理图层 ${reuseId}`);
+            group2.logicalLayers.add(fullConfig.id);
+            isReuse = true;
+            this.updateSharedLayerState(reuseId);
+          } else {
+            console.log(`图层 ${fullConfig.id} 创建共享物理图层 ${reuseId}`);
+            this.sharedLayerGroups.set(reuseId, {
+              physicalLayer: layer2,
+              logicalLayers: /* @__PURE__ */ new Set([fullConfig.id])
+            });
+            this.setupSharedLayerStyle(layer2, reuseId);
+            this.map.addLayer(layer2);
+          }
+        } else {
+          this.map.addLayer(layer2);
+        }
         if (fullConfig.zIndex !== void 0) {
-          handler.setZIndex(fullConfig.zIndex);
+          if (fullConfig.reuseId && this.sharedLayerGroups.has(fullConfig.reuseId)) {
+            const group2 = this.sharedLayerGroups.get(fullConfig.reuseId);
+            group2.physicalLayer.setZIndex(fullConfig.zIndex);
+          } else {
+            handler.setZIndex(fullConfig.zIndex);
+          }
           console.log(`图层 ${fullConfig.id} 设置 zIndex: ${fullConfig.zIndex}`);
         }
-        if ("applyLayerStyles" in handler) {
+        if ("applyLayerStyles" in handler && !isReuse) {
           setTimeout(() => {
             handler.applyLayerStyles();
           }, 50);
@@ -467339,7 +467611,9 @@ ${this.attributes_.map(
           layerConfig: fullConfig
         });
         if (((_a3 = fullConfig.locationAnimation) == null ? void 0 : _a3.enabled) && fullConfig.visible) {
-          this.handleLocationAnimation(layer2, fullConfig);
+          if (!isReuse || !((_b3 = this.sharedLayerGroups.get(fullConfig.reuseId)) == null ? void 0 : _b3.physicalLayer.getVisible())) {
+            this.handleLocationAnimation(fullConfig.reuseId ? this.sharedLayerGroups.get(fullConfig.reuseId).physicalLayer : layer2, fullConfig);
+          }
         }
         return true;
       } catch (error2) {
@@ -467364,7 +467638,7 @@ ${this.attributes_.map(
         const childLayers = [];
         if (groupConfig.children) {
           for (const childConfig of groupConfig.children) {
-            const childLayerId = `${groupConfig.id}_child_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+            const childLayerId = childConfig.id || `${groupConfig.id}_child_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
             const childFullConfig = {
               ...childConfig,
               id: childLayerId,
@@ -467377,9 +467651,10 @@ ${this.attributes_.map(
             }
           }
         }
+        const layersList = [];
         if (groupConfig.layers) {
           for (const layerConfig of groupConfig.layers) {
-            const layerLayerId = `${groupConfig.id}_layer_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+            const layerLayerId = layerConfig.id || `${groupConfig.id}_layer_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
             const layerFullConfig = {
               ...layerConfig,
               id: layerLayerId,
@@ -467388,10 +467663,14 @@ ${this.attributes_.map(
               opacity: layerConfig.opacity ?? groupConfig.opacity
             };
             if (this.addLayer(layerFullConfig)) {
+              layersList.push(layerFullConfig);
             }
           }
         }
         groupConfig.children = childLayers;
+        if (layersList.length > 0) {
+          groupConfig.layers = layersList;
+        }
         this.layerConfigs.set(groupConfig.id, groupConfig);
         this.saveLayerConfigs();
         this.eventBus.emit("layer-added", {
@@ -467418,15 +467697,26 @@ ${this.attributes_.map(
           console.warn(`未找到图层配置: ${layerId}`);
           return false;
         }
-        if (handler && this.layerConfigs.has(layerId)) {
-          if (config.type === "group" && config.children) {
-            for (const child of config.children) {
-              this.removeLayer(child.id);
+        if ((handler || config.type === "group") && this.layerConfigs.has(layerId)) {
+          if (config.type === "group") {
+            if (config.children) {
+              for (const child of config.children) {
+                this.removeLayer(child.id);
+              }
             }
-          } else {
+            if (config.layers) {
+              for (const layer2 of config.layers) {
+                this.removeLayer(layer2.id);
+              }
+            }
+            if (handler)
+              handler.destroy();
+          } else if (handler) {
             handler.destroy();
           }
-          this.layerHandlers.delete(layerId);
+          if (handler) {
+            this.layerHandlers.delete(layerId);
+          }
           this.layerConfigs.delete(layerId);
         }
         this.pendingLayerConfigs.delete(layerId);
@@ -467498,7 +467788,7 @@ ${this.attributes_.map(
           console.warn(`图层配置不存在: ${layerId}`);
           return false;
         }
-        if (config.type === "group" && config.children) {
+        if (config.type === "group" && (config.children || config.layers)) {
           return await this.setGroupLayerVisible(layerId, visible);
         }
         if (visible && !this.layerHandlers.has(layerId)) {
@@ -467513,28 +467803,58 @@ ${this.attributes_.map(
           if (visible && this.isBasemapLayer(layerId)) {
             await this.hideOtherBasemaps(layerId);
           }
-          handler.setVisible(visible);
           config.visible = visible;
-          this.saveLayerConfigs();
           if (this.pendingLayerConfigs.has(layerId)) {
             this.pendingLayerConfigs.set(layerId, config);
           }
-          if (visible) {
-            const layer2 = handler.getLayer();
-            const animCfg = config.locationAnimation;
-            if (animCfg && animCfg.enabled) {
-              this.handleLocationAnimation(layer2, config);
-            } else if (config.fitToExtent) {
-              const defaultAnim = {
-                enabled: true,
-                duration: 1e3,
-                easing: "ease-out",
-                maxZoom: 16,
-                padding: [50, 50, 50, 50]
-              };
-              this.performLocationAnimation(layer2, config, defaultAnim);
+          this.layerConfigs.set(layerId, config);
+          if (config.reuseId && this.sharedLayerGroups.has(config.reuseId)) {
+            const group2 = this.sharedLayerGroups.get(config.reuseId);
+            const anyVisible = Array.from(group2.logicalLayers).some((id2) => {
+              const c2 = this.layerConfigs.get(id2);
+              return c2 && c2.visible;
+            });
+            group2.physicalLayer.setVisible(anyVisible);
+            this.updateSharedLayerState(config.reuseId);
+            console.log(`共享图层 ${config.reuseId} 逻辑图层 ${layerId} 可见性设为 ${visible}, 物理图层可见性: ${anyVisible}`);
+            if (visible) {
+              if (anyVisible) {
+                const layer2 = group2.physicalLayer;
+                const animCfg = config.locationAnimation;
+                if (animCfg && animCfg.enabled) {
+                  this.handleLocationAnimation(layer2, config);
+                } else if (config.fitToExtent) {
+                  const defaultAnim = {
+                    enabled: true,
+                    duration: 1e3,
+                    easing: "ease-out",
+                    maxZoom: 16,
+                    padding: [50, 50, 50, 50]
+                  };
+                  this.performLocationAnimation(layer2, config, defaultAnim);
+                }
+              }
+            }
+          } else {
+            handler.setVisible(visible);
+            if (visible) {
+              const layer2 = handler.getLayer();
+              const animCfg = config.locationAnimation;
+              if (animCfg && animCfg.enabled) {
+                this.handleLocationAnimation(layer2, config);
+              } else if (config.fitToExtent) {
+                const defaultAnim = {
+                  enabled: true,
+                  duration: 1e3,
+                  easing: "ease-out",
+                  maxZoom: 16,
+                  padding: [50, 50, 50, 50]
+                };
+                this.performLocationAnimation(layer2, config, defaultAnim);
+              }
             }
           }
+          this.saveLayerConfigs();
           this.eventBus.emit("layer-visibility-changed", {
             layerId,
             visible,
@@ -467586,10 +467906,9 @@ ${this.attributes_.map(
           }
         }
         if (groupConfig.layers) {
-          const allConfigs = new Map([...this.layerConfigs, ...this.pendingLayerConfigs]);
-          for (const [layerId, config] of allConfigs) {
-            if (layerId.startsWith(`${groupLayerId}_layer_`)) {
-              const result = await this.setLayerVisible(layerId, visible);
+          for (const layerConfig of groupConfig.layers) {
+            if (layerConfig.id) {
+              const result = await this.setLayerVisible(layerConfig.id, visible);
               results.push(result);
             }
           }
@@ -467841,7 +468160,6 @@ ${this.attributes_.map(
      * 按需加载图层（原loadLayerConfigs的单个图层版本）
      */
     async loadLayerOnDemand(layerId) {
-      var _a3;
       try {
         if (this.layerHandlers.has(layerId)) {
           return true;
@@ -467853,23 +468171,15 @@ ${this.attributes_.map(
         }
         const handler = layerFactory.createLayerHandler(config);
         handler.setMap(this.map);
-        const layer2 = await ((_a3 = handler.getLayerAsync) == null ? void 0 : _a3.call(handler)) || handler.getLayer();
-        layer2.set("layerId", config.id);
-        this.layerHandlers.set(config.id, handler);
-        this.layerConfigs.set(config.id, config);
-        this.map.addLayer(layer2);
-        if (config.zIndex !== void 0) {
-          handler.setZIndex(config.zIndex);
-          console.log(`按需加载图层 ${layerId} 设置 zIndex: ${config.zIndex}`);
-        }
-        this.pendingLayerConfigs.delete(layerId);
-        if ("applyLayerStyles" in handler) {
-          setTimeout(() => {
-            handler.applyLayerStyles();
-          }, 50);
+        const success = await this.addLayerAsync(config, handler);
+        if (success) {
+          this.pendingLayerConfigs.delete(layerId);
+          console.log(`图层 ${layerId} 按需加载完成`);
+          return true;
+        } else {
+          console.error(`按需加载图层 ${layerId} 失败`);
+          return false;
         }
-        console.log(`图层 ${layerId} 按需加载完成`);
-        return true;
       } catch (error2) {
         console.error(`按需加载图层 ${layerId} 失败:`, error2);
         return false;
@@ -468330,13 +468640,15 @@ ${this.attributes_.map(
       this.map.removeLayer(this.highlightLayer);
     }
   }
+  const _hoisted_1$p = ["id"];
   const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
     __name: "BasePopup",
     props: {
       config: {},
       coordinate: {},
       feature: {},
-      visible: { type: Boolean, default: false }
+      visible: { type: Boolean, default: false },
+      id: {}
     },
     emits: ["close", "show", "hide", "content-change"],
     setup(__props, { expose: __expose, emit: __emit }) {
@@ -468445,6 +468757,9 @@ ${this.attributes_.map(
             ref_key: "contentElement",
             ref: contentElement
           }, [
+            vue.createElementVNode("div", {
+              id: `popup-slot-${_ctx.id}`
+            }, null, 8, _hoisted_1$p),
             vue.renderSlot(_ctx.$slots, "default", {
               feature: _ctx.feature,
               coordinate: _ctx.coordinate,
@@ -468472,7 +468787,8 @@ ${this.attributes_.map(
       config: {},
       coordinate: {},
       feature: {},
-      visible: { type: Boolean, default: false }
+      visible: { type: Boolean, default: false },
+      id: {}
     },
     emits: ["close", "show", "hide"],
     setup(__props, { emit: __emit }) {
@@ -468518,6 +468834,7 @@ ${this.attributes_.map(
           coordinate: _ctx.coordinate,
           feature: _ctx.feature,
           visible: _ctx.visible,
+          id: _ctx.id,
           onClose: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("close")),
           onShow: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("show")),
           onHide: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("hide"))
@@ -468535,7 +468852,7 @@ ${this.attributes_.map(
             ];
           }),
           _: 1
-        }, 8, ["config", "coordinate", "feature", "visible"]);
+        }, 8, ["config", "coordinate", "feature", "visible", "id"]);
       };
     }
   });
@@ -468586,7 +468903,8 @@ ${this.attributes_.map(
       config: {},
       coordinate: {},
       feature: {},
-      visible: { type: Boolean, default: false }
+      visible: { type: Boolean, default: false },
+      id: {}
     },
     emits: ["close", "show", "hide"],
     setup(__props, { emit: __emit }) {
@@ -468717,6 +469035,7 @@ ${this.attributes_.map(
           coordinate: _ctx.coordinate,
           feature: _ctx.feature,
           visible: _ctx.visible,
+          id: _ctx.id,
           onClose: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("close")),
           onShow: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("show")),
           onHide: _cache[3] || (_cache[3] = ($event) => _ctx.$emit("hide"))
@@ -468828,7 +469147,7 @@ ${this.attributes_.map(
             ])) : vue.createCommentVNode("", true)
           ]),
           _: 1
-        }, 8, ["config", "coordinate", "feature", "visible"]);
+        }, 8, ["config", "coordinate", "feature", "visible", "id"]);
       };
     }
   });
@@ -468916,7 +469235,8 @@ ${this.attributes_.map(
       config: {},
       coordinate: {},
       feature: {},
-      visible: { type: Boolean, default: false }
+      visible: { type: Boolean, default: false },
+      id: {}
     },
     emits: ["close", "show", "hide", "rowClick"],
     setup(__props, { emit: __emit }) {
@@ -469060,6 +469380,7 @@ ${this.attributes_.map(
           coordinate: _ctx.coordinate,
           feature: _ctx.feature,
           visible: _ctx.visible,
+          id: _ctx.id,
           onClose: _cache[6] || (_cache[6] = ($event) => _ctx.$emit("close")),
           onShow: _cache[7] || (_cache[7] = ($event) => _ctx.$emit("show")),
           onHide: _cache[8] || (_cache[8] = ($event) => _ctx.$emit("hide"))
@@ -469264,7 +469585,7 @@ ${this.attributes_.map(
             ])
           ]),
           _: 1
-        }, 8, ["config", "coordinate", "feature", "visible"]);
+        }, 8, ["config", "coordinate", "feature", "visible", "id"]);
       };
     }
   });
@@ -469481,7 +469802,8 @@ ${this.attributes_.map(
             }
           },
           positioning: "bottom-center",
-          stopEvent: false,
+          // 关键：阻止来自popup的事件传递到地图，避免点击关闭按钮触发地图单击
+          stopEvent: true,
           offset: [0, -10]
         });
         let component = null;
@@ -469489,6 +469811,7 @@ ${this.attributes_.map(
         switch (type) {
           case "html":
             app = vue.createApp(_sfc_main$p, {
+              id: popupId,
               config: { ...this.config.defaultConfig, ...config },
               coordinate,
               feature: feature2,
@@ -469498,6 +469821,7 @@ ${this.attributes_.map(
             break;
           case "image":
             app = vue.createApp(_sfc_main$o, {
+              id: popupId,
               config: { ...this.config.defaultConfig, ...config },
               coordinate,
               feature: feature2,
@@ -469507,6 +469831,7 @@ ${this.attributes_.map(
             break;
           case "array":
             app = vue.createApp(_sfc_main$n, {
+              id: popupId,
               config: { ...this.config.defaultConfig, ...config },
               coordinate,
               feature: feature2,
@@ -469522,6 +469847,7 @@ ${this.attributes_.map(
             const allConfig = config;
             if (allConfig.htmlContent) {
               app = vue.createApp(_sfc_main$p, {
+                id: popupId,
                 config: {
                   ...allConfig,
                   content: allConfig.htmlContent
@@ -469533,6 +469859,7 @@ ${this.attributes_.map(
               });
             } else if (allConfig.images) {
               app = vue.createApp(_sfc_main$o, {
+                id: popupId,
                 config: {
                   ...allConfig,
                   images: allConfig.images
@@ -469544,6 +469871,7 @@ ${this.attributes_.map(
               });
             } else if (allConfig.data) {
               app = vue.createApp(_sfc_main$n, {
+                id: popupId,
                 config: {
                   ...allConfig,
                   data: allConfig.data
@@ -469559,6 +469887,7 @@ ${this.attributes_.map(
               });
             } else {
               app = vue.createApp(_sfc_main$q, {
+                id: popupId,
                 config: allConfig,
                 coordinate,
                 feature: feature2,
@@ -469567,6 +469896,28 @@ ${this.attributes_.map(
               });
             }
             break;
+          case "custom": {
+            const customConfig = config;
+            const CustomComp = customConfig.component;
+            const computedProps = typeof customConfig.props === "function" ? customConfig.props(feature2, coordinate) : customConfig.props || {};
+            const cfg = { ...this.config.defaultConfig, ...customConfig };
+            const onClose = () => this.closePopup(popupId);
+            const Root = vue.defineComponent({
+              name: "CustomPopupRoot",
+              setup() {
+                return { cfg, coordinate, feature: feature2, CustomComp, computedProps, onClose };
+              },
+              render() {
+                return vue.h(
+                  _sfc_main$q,
+                  { config: this.cfg, coordinate: this.coordinate, feature: this.feature, visible: true, id: popupId, onClose: this.onClose },
+                  { default: () => vue.h(this.CustomComp, { ...this.computedProps, feature: this.feature, coordinate: this.coordinate, config: this.cfg }) }
+                );
+              }
+            });
+            app = vue.createApp(Root);
+            break;
+          }
           default:
             console.error(`不支持的 popup 类型: ${type}`);
             return null;
@@ -469595,24 +469946,26 @@ ${this.attributes_.map(
      * 显示 popup
      */
     showPopup(popup) {
-      var _a3, _b3;
+      var _a3, _b3, _c2, _d;
       this.map.addOverlay(popup.overlay);
       popup.overlay.setPosition(popup.coordinate);
       (_b3 = (_a3 = popup.config.events) == null ? void 0 : _a3.onShow) == null ? void 0 : _b3.call(_a3);
+      (_d = (_c2 = this.config).onShow) == null ? void 0 : _d.call(_c2, popup.id, popup.config, popup.feature, popup.coordinate);
     }
     /**
      * 隐藏 popup
      */
     hidePopup(popup) {
-      var _a3, _b3;
+      var _a3, _b3, _c2, _d;
       this.map.removeOverlay(popup.overlay);
       (_b3 = (_a3 = popup.config.events) == null ? void 0 : _a3.onHide) == null ? void 0 : _b3.call(_a3);
+      (_d = (_c2 = this.config).onHide) == null ? void 0 : _d.call(_c2, popup.id);
     }
     /**
      * 销毁 popup
      */
     destroyPopup(popup) {
-      var _a3, _b3;
+      var _a3, _b3, _c2, _d;
       try {
         if (popup.app) {
           popup.app.unmount();
@@ -469621,6 +469974,7 @@ ${this.attributes_.map(
           popup.container.parentNode.removeChild(popup.container);
         }
         (_b3 = (_a3 = popup.config.events) == null ? void 0 : _a3.onClose) == null ? void 0 : _b3.call(_a3);
+        (_d = (_c2 = this.config).onClose) == null ? void 0 : _d.call(_c2, popup.id);
       } catch (error2) {
         console.error("销毁 popup 失败:", error2);
       }
@@ -469839,7 +470193,11 @@ ${this.attributes_.map(
     initMap(targetId) {
       var _a3;
       const projection2 = this.config.projection || "EPSG:4326";
-      if (projection2 === "EPSG:4490") {
+      if (this.config.projectionDefinition) {
+        proj4$1.defs(projection2, this.config.projectionDefinition);
+        register$3(proj4$1);
+      }
+      if (projection2 === "EPSG:4490" && !this.config.projectionDefinition) {
         setupEPSG4490();
       }
       const center2 = this.config.center || [116.404, 39.915];
@@ -480235,8 +480593,12 @@ ${this.attributes_.map(
       __publicField(this, "defaultCheckedKeys", vue.computed(() => {
         const checkedKeys = [];
         const collectVisibleIds = (layer2) => {
-          if (layer2.visible && layer2.type !== "group") {
-            checkedKeys.push(layer2.id);
+          if (layer2.visible) {
+            const isGroup = layer2.type === "group";
+            const hasChildren = layer2.children && Array.isArray(layer2.children) && layer2.children.length > 0;
+            if (!isGroup || isGroup && !hasChildren) {
+              checkedKeys.push(layer2.id);
+            }
           }
           if (layer2.children && Array.isArray(layer2.children)) {
             layer2.children.forEach((child) => collectVisibleIds(child));
@@ -480277,10 +480639,11 @@ ${this.attributes_.map(
      * @returns 树节点数据
      */
     buildLayerNode(layer2) {
+      const isGroup = layer2.type === "group" || layer2.children && Array.isArray(layer2.children) && layer2.children.length > 0;
       const node2 = {
         id: layer2.id,
         label: layer2.name,
-        type: "layer",
+        type: isGroup ? "group" : "layer",
         layerType: layer2.type,
         layerData: layer2
       };
@@ -481547,7 +481910,7 @@ ${this.attributes_.map(
         }
         const willCheck = checkedKeys ? checkedKeys.includes(data2.id) : !defaultCheckedKeys.value.includes(data2.id);
         const toggleNodeAndChildren = (node2, checked) => {
-          if (node2.type === "layer" && node2.layerData) {
+          if ((node2.type === "layer" || node2.type === "group") && node2.layerData) {
             node2.layerData.visible = checked;
             handleLayerVisibilityChange(node2.layerData);
             if (node2.layerData.type === "group") {