my-openlayer 0.1.18 → 1.0.1

package/dist/core/Line.js

@@ -2,93 +2,187 @@ import VectorSource from "ol/source/Vector";
 import GeoJSON from "ol/format/GeoJSON";
 import VectorLayer from "ol/layer/Vector";
 import { Stroke, Style } from "ol/style";
+import { Feature } from "ol";
 import MapTools from "./MapTools";
+import { ValidationUtils } from "../utils/ValidationUtils";
+/**
+ * 线要素管理类
+ * 用于在地图上添加和管理线要素，包括普通线要素、河流图层等
+ *
+ * @example
+ * ```typescript
+ * const lineManager = new Line(map);
+ * const layer = lineManager.addLine(geoJsonData, {
+ *   type: 'road',
+ *   strokeColor: '#ff0000',
+ *   strokeWidth: 3
+ * });
+ * ```
+ */
 export default class Line {
+    /**
+     * 构造函数
+     * @param map OpenLayers地图实例
+     */
     constructor(map) {
+        /** 河流图层列表 */
         this.riverLayerList = [];
+        /** 河流图层显示状态 */
         this.riverLayerShow = false;
+        /** 默认河流级别宽度映射 */
+        this.defaultLevelWidthMap = {
+            1: 2,
+            2: 1,
+            3: 0.5,
+            4: 0.5,
+            5: 0.5
+        };
+        ValidationUtils.validateMapInstance(map);
         this.map = map;
     }
-    addLine(data, options) {
+    /**
+     * 添加线要素
+     * @param data GeoJSON格式的线数据
+     * @param options 配置项
+     * @returns 创建的矢量图层
+     */
+    addLine(data, options = {}) {
+        ValidationUtils.validateGeoJSONData(data);
+        const defaultOptions = {
+            type: 'line',
+            strokeColor: 'rgba(3, 122, 255, 1)',
+            strokeWidth: 2,
+            visible: true,
+            zIndex: 15,
+            layerName: options.layerName || 'lineLayer'
+        };
+        const mergedOptions = { ...defaultOptions, ...options };
+        const features = new GeoJSON().readFeatures(data, options.projectionOptOptions);
         const layer = new VectorLayer({
-            name: options.layerName,
-            layerName: options.layerName,
-            source: new VectorSource({
-                features: (new GeoJSON()).readFeatures(data)
-            }),
-            style: function (feature) {
-                feature.set('type', options.type);
-                feature.set('layerName', options.type);
+            properties: {
+                name: mergedOptions.layerName,
+                layerName: mergedOptions.layerName
+            },
+            source: new VectorSource({ features }),
+            style: (feature) => {
+                if (feature instanceof Feature) {
+                    feature.set('type', mergedOptions.type);
+                    feature.set('layerName', mergedOptions.type);
+                }
                 return new Style({
                     stroke: new Stroke({
-                        color: options.strokeColor || 'rgba(3, 122, 255, 1)',
-                        width: options.strokeWidth || 2,
-                        lineDash: options?.lineDash,
-                        lineDashOffset: options?.lineDashOffset
-                    }),
+                        color: mergedOptions.strokeColor,
+                        width: mergedOptions.strokeWidth,
+                        lineDash: mergedOptions.lineDash,
+                        lineDashOffset: mergedOptions.lineDashOffset
+                    })
                 });
             },
-            zIndex: options.zIndex ?? 15,
+            zIndex: mergedOptions.zIndex
         });
-        layer.setVisible(options.visible === undefined ? true : options.visible);
-        this[options.type + 'Layer'] = layer;
+        layer.setVisible(mergedOptions.visible);
         this.map.addLayer(layer);
         return layer;
     }
-    // 添加水系并按照zoom显示不同级别
-    addRiverLayersByZoom(fyRiverJson, options = { type: 'river' }) {
-        this.riverLayerShow = !!options.visible;
+    /**
+     * 添加分级河流图层，根据缩放级别显示不同级别的河流
+     * @param fyRiverJson 河流 GeoJSON 数据
+     * @param options 河流图层配置选项
+     * @throws {Error} 当数据格式无效时抛出错误
+     */
+    addRiverLayersByZoom(fyRiverJson, options = {}) {
+        ValidationUtils.validateGeoJSONData(fyRiverJson);
+        const defaultOptions = {
+            type: 'river',
+            levelCount: 5,
+            zoomOffset: 8,
+            strokeColor: 'rgb(0,113,255)',
+            strokeWidth: 3,
+            visible: true,
+            zIndex: 15,
+            layerName: 'riverLayer',
+            removeExisting: options.removeExisting ?? false,
+            levelWidthMap: this.defaultLevelWidthMap
+        };
+        const mergedOptions = { ...defaultOptions, ...options };
+        // 清除现有河流图层
+        if (mergedOptions.removeExisting) {
+            this.clearRiverLayers();
+        }
+        this.riverLayerShow = mergedOptions.visible;
         this.riverLayerList = [];
-        for (let i = 1; i <= 5; i++) {
+        // 创建分级河流图层
+        for (let level = 1; level <= mergedOptions.levelCount; level++) {
             const vectorSource = new VectorSource({
                 format: new GeoJSON(),
-                loader: function () {
+                loader: () => {
                     const geojson = new GeoJSON();
                     fyRiverJson.features.forEach((feature) => {
-                        if (feature.properties.level === i) {
-                            const olFeature = geojson.readFeature(feature);
-                            vectorSource.addFeature(olFeature);
+                        if (feature.properties && feature.properties.level === level) {
+                            try {
+                                const olFeature = geojson.readFeature(feature);
+                                vectorSource.addFeature(olFeature);
+                            }
+                            catch (error) {
+                                console.warn(`Failed to load river feature at level ${level}:`, error);
+                            }
                         }
                     });
-                },
-                // 其他配置
+                }
             });
             const riverLayer = new VectorLayer({
-                name: 'river',
-                layerName: 'river',
+                properties: {
+                    name: mergedOptions.layerName,
+                    layerName: mergedOptions.layerName,
+                    riverLevel: level
+                },
                 source: vectorSource,
-                style: function (feature) {
-                    feature.set('type', options.layerName);
-                    feature.set('layerName', options.layerName);
+                style: (feature) => {
+                    if (feature instanceof Feature) {
+                        feature.set('type', mergedOptions.layerName);
+                        feature.set('layerName', mergedOptions.layerName);
+                    }
                     return new Style({
                         stroke: new Stroke({
-                            color: options.strokeColor || 'rgb(0,113,255)',
-                            width: options.strokeWidth || 3
+                            color: mergedOptions.strokeColor,
+                            width: mergedOptions.strokeWidth
                         })
                     });
                 },
-                zIndex: options.zIndex ?? 15
+                zIndex: mergedOptions.zIndex
             });
             riverLayer.setVisible(false);
             this.riverLayerList.push(riverLayer);
             this.map.addLayer(riverLayer);
         }
-        this.showRiverLayerByZoom();
+        // 设置缩放事件监听
         MapTools.mapOnEvent(this.map, 'moveend', () => {
             this.showRiverLayerByZoom();
         });
+        // 初始显示
+        this.showRiverLayerByZoom();
     }
+    /**
+     * 显示或隐藏河流图层
+     * @param show 是否显示河流图层
+     */
     showRiverLayer(show) {
         this.riverLayerShow = show;
-        this.riverNamePointLayer.setVisible(show);
         this.showRiverLayerByZoom();
     }
-    //分级根据zoom显示河流
+    /**
+     * 根据缩放级别显示对应的河流图层
+     * 缩放级别越高，显示的河流级别越详细
+     */
     showRiverLayerByZoom() {
         const zoom = this.map.getView().getZoom();
+        if (!zoom) {
+            return;
+        }
         this.riverLayerList.forEach((layer, index) => {
-            // 一共分5级，加1因为level从1开始
-            if (zoom && zoom > index + 1 + 8) {
+            // 计算显示阈值：级别索引 + 1（因为level从1开始）+ 缩放偏移量（默认8）
+            const displayThreshold = index + 1 + 8;
+            if (zoom > displayThreshold) {
                 layer.setVisible(this.riverLayerShow);
             }
             else {
@@ -96,27 +190,92 @@ export default class Line {
             }
         });
     }
-    // 添加全部级别河流根据级别显示不同宽度
-    addRiverWidthByLev(arr = {}) {
-        const riverLayer = new VectorLayer({
-            name: 'river',
+    /**
+     * 添加按级别显示不同宽度的河流图层
+     * @param data 河流 GeoJSON 数据
+     * @param options 河流图层配置选项
+     * @returns 创建的河流图层
+     */
+    addRiverWidthByLevel(data, options = {}) {
+        ValidationUtils.validateGeoJSONData(data);
+        // 合并默认配置
+        const mergedOptions = {
+            type: 'river',
             layerName: 'river',
-            source: new VectorSource({
-                features: (new GeoJSON()).readFeatures(arr)
-            }),
-            style: (feature) => this.setFeatureAttr(feature),
-            zIndex: 15
+            strokeColor: 'rgba(3, 122, 255, 1)',
+            strokeWidth: 2,
+            visible: true,
+            zIndex: 15,
+            levelWidthMap: this.defaultLevelWidthMap,
+            removeExisting: options.removeExisting ?? false,
+            ...options
+        };
+        // 移除同名图层（如果存在）
+        if (mergedOptions.removeExisting && mergedOptions.layerName) {
+            MapTools.removeLayer(this.map, mergedOptions.layerName);
+        }
+        // 解析 GeoJSON 数据
+        const features = new GeoJSON().readFeatures(data, options.projectionOptOptions);
+        // 创建河流图层
+        const riverLayer = new VectorLayer({
+            properties: {
+                name: mergedOptions.layerName,
+                layerName: mergedOptions.layerName
+            },
+            source: new VectorSource({ features }),
+            style: (feature) => {
+                const level = feature.get('level');
+                const levelWidth = mergedOptions.levelWidthMap[Number(level)] || 1;
+                return new Style({
+                    stroke: new Stroke({
+                        color: mergedOptions.strokeColor,
+                        width: levelWidth
+                    })
+                });
+            },
+            zIndex: mergedOptions.zIndex
         });
+        riverLayer.setVisible(mergedOptions.visible);
         this.map.addLayer(riverLayer);
+        return riverLayer;
+    }
+    /**
+     * 移除线图层
+     * @param layerName 图层名称
+     */
+    removeLineLayer(layerName) {
+        ValidationUtils.validateLayerName(layerName);
+        MapTools.removeLayer(this.map, layerName);
     }
-    setFeatureAttr(feature) {
-        const level = feature.get('level');
-        const levelWidth = { 1: 2, 2: 1, 3: 0.5, 4: 0.5, 5: 0.5 };
-        return new Style({
-            stroke: new Stroke({
-                color: 'rgba(3, 122, 255, 1)',
-                width: levelWidth[Number(level)]
-            }),
+    /**
+     * 清除所有河流图层
+     */
+    clearRiverLayers() {
+        this.riverLayerList.forEach(layer => {
+            this.map.removeLayer(layer);
         });
+        this.riverLayerList = [];
+        this.riverLayerShow = false;
+    }
+    /**
+     * 获取河流图层显示状态
+     * @returns 河流图层是否显示
+     */
+    getRiverLayerVisibility() {
+        return this.riverLayerShow;
+    }
+    /**
+     * 获取河流图层列表
+     * @returns 河流图层数组的副本
+     */
+    getRiverLayers() {
+        return [...this.riverLayerList];
+    }
+    /**
+     * 销毁线管理器，清理所有资源
+     */
+    destroy() {
+        // 清除所有河流图层
+        this.clearRiverLayers();
     }
 }

package/dist/core/MapBaseLayers.d.ts

@@ -1,5 +1,7 @@
 /**
- * 地图底图图层
+ * 地图底图图层管理类
+ * 提供天地图底图、注记图层、GeoServer图层等功能
+ * 支持图层切换、裁剪等高级功能
  */
 import Map from "ol/Map";
 import { Tile as TileLayer } from "ol/layer";
@@ -7,30 +9,196 @@ import { TileWMS } from "ol/source";
 import WMTSTileGrid from "ol/tilegrid/WMTS";
 import XYZ from "ol/source/XYZ";
 import { MapLayersOptions, TiandituType, AnnotationLayerOptions } from "../types";
+/**
+ * GeoServer图层选项接口
+ */
+interface GeoServerLayerOptions {
+    /** 图层层级 */
+    zIndex?: number;
+    /** 图层可见性 */
+    visible?: boolean;
+    /** WMS版本 */
+    version?: '1.1.1' | '1.3.0';
+    /** 服务器类型 */
+    serverType?: string;
+    /** 跨域设置 */
+    crossOrigin?: string;
+    /** WMS参数 */
+    params?: Record<string, any>;
+}
+/**
+ * 天地图图层选项接口
+ */
+interface TiandituLayerOptions {
+    /** 图层类型 */
+    type: TiandituType;
+    /** 天地图token */
+    token: string;
+    /** 图层层级 */
+    zIndex: number;
+    /** 图层可见性 */
+    visible: boolean;
+}
+/**
+ * 地图底图图层管理类
+ */
 export default class MapBaseLayers {
-    private map;
+    private readonly map;
     private readonly options;
-    private readonly layers;
+    private layers;
+    private readonly errorHandler;
+    private currentBaseLayerType;
+    /**
+     * 构造函数
+     * @param map OpenLayers地图实例
+     * @param options 图层配置选项
+     */
     constructor(map: Map, options: MapLayersOptions);
+    /**
+     * 验证构造函数参数
+     * @param map 地图实例
+     * @param options 配置选项
+     * @private
+     */
+    private validateConstructorParams;
+    /**
+     * 合并默认配置选项
+     * @param options 用户配置选项
+     * @returns 合并后的配置选项
+     * @private
+     */
+    private mergeDefaultOptions;
+    /**
+     * 初始化图层
+     * @private
+     */
+    private initializeLayers;
+    /**
+     * 初始化天地图图层
+     * @private
+     */
+    private initTiandituLayers;
+    /**
+     * 添加注记图层
+     * @param token 天地图token
+     * @param baseZIndex 基础层级
+     * @private
+     */
+    private addAnnotationLayers;
+    /**
+     * 切换底图图层
+     * @param type 图层类型
+     */
     switchBaseLayer(type: TiandituType): void;
-    initLayer(): void;
-    addAnnotationLayer(options: Omit<AnnotationLayerOptions, 'token'>): void;
+    /**
+     * 获取当前底图类型
+     * @returns 当前底图类型
+     */
+    getCurrentBaseLayerType(): string | null;
+    /**
+     * 获取可用的图层类型列表
+     * @returns 图层类型数组
+     */
+    getAvailableLayerTypes(): string[];
+    /**
+     * 检查指定图层类型是否存在
+     * @param type 图层类型
+     * @returns 是否存在
+     */
+    hasLayerType(type: string): boolean;
+    /**
+     * 添加注记图层（实例方法）
+     * @param options 注记图层选项（不包含token）
+     * @returns 创建的图层
+     */
+    addAnnotationLayer(options: Omit<AnnotationLayerOptions, 'token'>): TileLayer<XYZ>;
+    /**
+     * 添加注记图层（静态方法）
+     * @param map 地图实例
+     * @param options 注记图层选项
+     * @returns 创建的图层
+     */
     static addAnnotationLayer(map: Map, options: AnnotationLayerOptions): TileLayer<XYZ>;
-    addMapLayer(): void;
-    createLayer(layer: any): any;
-    addGeoServerLayer(url: string, layer: string, options: {
-        zIndex?: number;
-        visible?: boolean;
-    }): TileLayer<TileWMS>;
-    static getTiandiTuLayer(options: {
-        type: TiandituType;
-        token: string;
-        zIndex: number;
-        visible: boolean;
-    }): TileLayer<XYZ>;
-    /**
-     * 地图注记
+    /**
+     * 将所有图层添加到地图
+     * @private
+     */
+    private addMapLayer;
+    /**
+     * 处理图层（应用裁剪等）
+     * @param layer 原始图层
+     * @returns 处理后的图层
+     * @private
+     */
+    private processLayer;
+    /**
+     * 添加GeoServer图层
+     * @param url GeoServer服务URL
+     * @param layerName 图层名称
+     * @param options 图层选项
+     * @returns 创建的WMS图层
+     */
+    addGeoServerLayer(url: string, layerName: string, options?: GeoServerLayerOptions): TileLayer<TileWMS>;
+    /**
+     * 创建天地图图层（实例方法）
+     * @param options 天地图图层选项
+     * @returns 创建的图层
+     * @private
+     */
+    private createTiandituLayer;
+    /**
+     * 创建注记图层（实例方法）
+     * @param options 注记图层选项
+     * @returns 创建的图层
+     * @private
+     */
+    private createAnnotationLayer;
+    /**
+     * 创建天地图底图图层（静态方法）
+     * @param options 天地图图层选项
+     * @returns 创建的图层
+     */
+    static getTiandiTuLayer(options: TiandituLayerOptions): TileLayer<XYZ>;
+    /**
+     * 创建天地图注记图层（静态方法）
+     * @param options 注记图层选项
+     * @returns 创建的图层
+     */
+    static createAnnotationLayer(options: AnnotationLayerOptions): TileLayer<XYZ>;
+    /**
+     * 获取天地图注记图层（向后兼容的静态方法）
+     * @param options 注记图层选项
+     * @returns 创建的图层
+     * @deprecated 使用 createAnnotationLayer 替代
      */
     static getAnnotationLayer(options: AnnotationLayerOptions): TileLayer<XYZ>;
+    /**
+     * 创建WMTS瓦片网格
+     * @param length 层级数量
+     * @returns WMTS瓦片网格
+     */
     static getTileGrid(length: number): WMTSTileGrid;
+    /**
+     * 移除指定类型的图层
+     * @param type 图层类型
+     */
+    removeLayersByType(type: string): void;
+    /**
+     * 清除所有图层
+     */
+    clearAllLayers(): void;
+    /**
+     * 获取图层数量统计
+     * @returns 图层统计信息
+     */
+    getLayerStats(): {
+        totalTypes: number;
+        totalLayers: number;
+        layersByType: Record<string, number>;
+    };
+    /**
+     * 销毁实例，清理资源
+     */
+    destroy(): void;
 }
+export {};