my-openlayer 0.1.18 → 1.0.0

package/dist/core/Polygon.js

@@ -9,7 +9,15 @@ import { fromExtent } from "ol/geom/Polygon";
 import Feature from "ol/Feature";
 import ImageStatic from "ol/source/ImageStatic";
 import MapTools from "./MapTools";
+/**
+ * Polygon 类用于处理地图上的面要素操作
+ * 包括添加多边形、边框、图片图层、热力图等功能
+ */
 export default class Polygon {
+    /**
+     * 构造函数
+     * @param map OpenLayers 地图实例
+     */
     constructor(map) {
         this.colorMap = {
             '0': 'rgba(255, 0, 0, 0.6)',
@@ -17,123 +25,228 @@ export default class Polygon {
             '2': 'rgba(255, 238, 0, 0.6)',
             '3': 'rgba(1, 111, 255, 0.6)'
         };
+        if (!map) {
+            throw new Error('Map instance is required');
+        }
         this.map = map;
     }
     /**
      * 获取等级颜色
-     * @param lev
+     * @param lev 等级值，支持字符串或数字
+     * @returns 对应等级的颜色值，如果等级不存在则返回默认颜色
      */
     getLevColor(lev) {
-        return this.colorMap[lev.toString()];
+        const key = lev.toString();
+        return this.colorMap[key] || 'rgba(128, 128, 128, 0.6)';
     }
     /**
-     * 添加 地图 边框 图层
-     * @param data 图层数据
-     * @param options 图层配置
+     * 添加地图边框图层
+     * @param data 图层数据，必须是有效的 GeoJSON 格式
+     * @param options 图层配置选项
+     * @returns 创建的图层实例
+     * @throws 当数据格式无效时抛出错误
      */
     addBorderPolygon(data, options) {
-        options = options ?? {};
-        options.layerName = options.layerName ?? 'border';
-        options.fillColor = options.fillColor ?? 'rgba(255, 255, 255, 0)';
-        this.addPolygon(data, options);
-        if (options.mask)
+        if (!data || !data.features || !Array.isArray(data.features)) {
+            throw new Error('Invalid GeoJSON data: features array is required');
+        }
+        const mergedOptions = {
+            layerName: 'border',
+            fillColor: 'rgba(255, 255, 255, 0)',
+            ...options
+        };
+        const layer = this.addPolygon(data, mergedOptions);
+        if (mergedOptions.mask) {
             this.setOutLayer(data);
+        }
+        return layer;
     }
-    // 添加分区
-    //fyBasinJson中的id的key需要跟options中的nameKey一致
+    /**
+     * 添加多边形图层
+     * @param dataJSON GeoJSON 数据
+     * @param options 图层配置选项
+     * @returns 创建的矢量图层
+     * @throws 当数据格式无效时抛出错误
+     */
     addPolygon(dataJSON, options) {
-        options = options ?? {};
-        if (options.layerName != null) {
-            MapTools.removeLayer(this.map, options.layerName);
+        if (!dataJSON || !dataJSON.features || !Array.isArray(dataJSON.features)) {
+            throw new Error('Invalid GeoJSON data: features array is required');
+        }
+        const mergedOptions = {
+            zIndex: 11,
+            visible: true,
+            strokeColor: '#EBEEF5',
+            strokeWidth: 2,
+            fillColor: 'rgba(255, 255, 255, 0.3)',
+            textFont: '14px Calibri,sans-serif',
+            textFillColor: '#FFF',
+            textStrokeColor: '#409EFF',
+            textStrokeWidth: 2,
+            ...options
+        };
+        // 如果指定了图层名称，先移除同名图层
+        if (mergedOptions.layerName) {
+            new MapTools(this.map).removeLayer(mergedOptions.layerName);
+        }
+        let features;
+        try {
+            features = new GeoJSON().readFeatures(dataJSON, mergedOptions.projectionOptOptions ?? {});
+        }
+        catch (error) {
+            throw new Error(`Failed to parse GeoJSON data: ${error}`);
         }
         const layer = new VectorLayer({
-            name: options.layerName,
-            layerName: options.layerName,
-            source: new VectorSource({
-                features: (new GeoJSON()).readFeatures(dataJSON, options.projectionOptOptions ?? {})
-            }),
-            zIndex: options.zIndex ?? 11
+            properties: {
+                name: mergedOptions.layerName,
+                layerName: mergedOptions.layerName
+            },
+            source: new VectorSource({ features }),
+            zIndex: mergedOptions.zIndex
         });
-        const features = layer.getSource()?.getFeatures();
-        features?.forEach(feature => {
-            feature.set('type', options?.type);
-            feature.set('layerName', options?.type);
-            const fillColor = options?.fillColorCallBack ? options.fillColorCallBack(feature) : options?.fillColor;
+        // 设置要素样式
+        this.setFeatureStyles(features, mergedOptions);
+        layer.setVisible(mergedOptions.visible);
+        this.map.addLayer(layer);
+        // 如果需要适应视图
+        if (mergedOptions.fitView) {
+            this.fitViewToLayer(layer);
+        }
+        return layer;
+    }
+    /**
+     * 设置要素样式
+     * @param features 要素数组
+     * @param options 样式配置选项
+     */
+    setFeatureStyles(features, options) {
+        features.forEach(feature => {
+            feature.set('type', options.type || options.layerName);
+            feature.set('layerName', options.type || options.layerName);
+            const fillColor = options.fillColorCallBack
+                ? options.fillColorCallBack(feature)
+                : options.fillColor;
             const featureStyle = new Style({
                 stroke: new Stroke({
-                    color: options?.strokeColor ?? '#EBEEF5',
-                    width: options?.strokeWidth ?? 2,
-                    lineDash: options?.lineDash,
-                    lineDashOffset: options?.lineDashOffset
+                    color: options.strokeColor,
+                    width: options.strokeWidth,
+                    lineDash: options.lineDash,
+                    lineDashOffset: options.lineDashOffset
                 }),
-                fill: new Fill({ color: fillColor ?? 'rgba(255, 255, 255, 0.3)' }),
+                fill: new Fill({ color: fillColor })
             });
-            if (options?.textVisible) {
-                const text = (options?.textCallBack ? options?.textCallBack(feature) : '') || (options.nameKey ? feature.get(options.nameKey) : "");
-                featureStyle.setText(new Text({
-                    text: text,
-                    font: options?.textFont ?? '14px Calibri,sans-serif',
-                    fill: new Fill({ color: options?.textFillColor ?? '#FFF' }),
-                    stroke: new Stroke({
-                        color: options?.textStrokeColor ?? '#409EFF',
-                        width: options?.textStrokeWidth ?? 2
-                    })
-                }));
+            // 添加文本样式
+            if (options.textVisible) {
+                const text = this.getFeatureText(feature, options);
+                if (text) {
+                    featureStyle.setText(new Text({
+                        text,
+                        font: options.textFont,
+                        fill: new Fill({ color: options.textFillColor }),
+                        stroke: new Stroke({
+                            color: options.textStrokeColor,
+                            width: options.textStrokeWidth
+                        })
+                    }));
+                }
             }
             feature.setStyle(featureStyle);
         });
-        layer.setVisible(options.visible === undefined ? true : options.visible);
-        this.map.addLayer(layer);
-        if (options.fitView) {
-            // 获取面的范围
-            const extent = layer.getSource()?.getExtent();
-            // 适应这个范围
-            if (extent)
-                this.map.getView().fit(extent, { duration: 500 });
+    }
+    /**
+     * 获取要素文本
+     * @param feature 要素对象
+     * @param options 配置选项
+     * @returns 文本内容
+     */
+    getFeatureText(feature, options) {
+        if (options.textCallBack) {
+            return options.textCallBack(feature) || '';
+        }
+        if (options.nameKey) {
+            return feature.get(options.nameKey) || '';
+        }
+        return '';
+    }
+    /**
+     * 适应图层视图
+     * @param layer 图层对象
+     */
+    fitViewToLayer(layer) {
+        const extent = layer.getSource()?.getExtent();
+        if (extent) {
+            this.map.getView().fit(extent, { duration: 500 });
         }
-        return layer;
     }
     /**
      * 根据数据数组更新某个面颜色
      * @param layerName 图层名称
-     * @param colorObj 数据 不传或者传{}则重置所有颜色
-     *   colorObj:{
-     *     对应geojson文件中的索引字段[propName]: 'rgba(255, 0, 0, 0.6)', // 颜色
-     *     ...
-     *   }
+     * @param colorObj 颜色映射对象，键为要素属性值，值为颜色字符串
      * @param options 配置项
+     * @throws 当图层不存在时抛出错误
      */
     updateFeatureColor(layerName, colorObj, options) {
-        const layer = MapTools.getLayerByLayerName(this.map, layerName)[0];
-        if (layer instanceof VectorLayer) {
-            const features = layer.getSource()?.getFeatures();
-            features?.forEach((feature) => {
-                if (options?.nameKey || (!colorObj || Object.keys(colorObj).length === 0)) {
-                    const name = options?.nameKey ? feature.get(options.nameKey) : '';
-                    const newColor = colorObj?.[name];
-                    const featureStyle = new Style({
-                        stroke: new Stroke({
-                            color: options?.strokeColor ?? '#EBEEF5',
-                            width: options?.strokeWidth ?? 2
-                        }),
-                        fill: new Fill({ color: newColor || options?.fillColor || 'rgba(255, 255, 255, 0.3)' }),
-                    });
-                    if (options?.textVisible) {
-                        const text = (options?.textCallBack ? options?.textCallBack(feature) : '') || (options.nameKey ? feature.get(options.nameKey) : "");
-                        featureStyle.setText(new Text({
-                            text,
-                            font: options?.textFont ?? '14px Calibri,sans-serif',
-                            fill: new Fill({ color: options?.textFillColor || '#FFF' }),
-                            stroke: new Stroke({
-                                color: options?.textStrokeColor ?? '#409EFF',
-                                width: options?.textStrokeWidth ?? 2
-                            })
-                        }));
-                    }
-                    feature.setStyle(featureStyle);
-                }
-            });
+        if (!layerName) {
+            throw new Error('Layer name is required');
+        }
+        const layers = MapTools.getLayerByLayerName(this.map, layerName);
+        if (layers.length === 0) {
+            throw new Error(`Layer with name '${layerName}' not found`);
         }
+        const layer = layers[0];
+        if (!(layer instanceof VectorLayer)) {
+            throw new Error(`Layer '${layerName}' is not a vector layer`);
+        }
+        const mergedOptions = {
+            strokeColor: '#EBEEF5',
+            strokeWidth: 2,
+            fillColor: 'rgba(255, 255, 255, 0.3)',
+            textFont: '14px Calibri,sans-serif',
+            textFillColor: '#FFF',
+            textStrokeColor: '#409EFF',
+            textStrokeWidth: 2,
+            ...options
+        };
+        const features = layer.getSource()?.getFeatures();
+        if (!features) {
+            console.warn(`No features found in layer '${layerName}'`);
+            return;
+        }
+        features.forEach((feature) => {
+            this.updateSingleFeatureColor(feature, colorObj, mergedOptions);
+        });
+    }
+    /**
+     * 更新单个要素的颜色
+     * @param feature 要素对象
+     * @param colorObj 颜色映射对象
+     * @param options 配置选项
+     */
+    updateSingleFeatureColor(feature, colorObj, options) {
+        const name = options?.nameKey ? feature.get(options.nameKey) : '';
+        const newColor = colorObj?.[name] || options?.fillColor;
+        const featureStyle = new Style({
+            stroke: new Stroke({
+                color: options?.strokeColor,
+                width: options?.strokeWidth
+            }),
+            fill: new Fill({ color: newColor })
+        });
+        // 添加文本样式
+        if (options?.textVisible) {
+            const text = this.getFeatureText(feature, options);
+            if (text) {
+                featureStyle.setText(new Text({
+                    text,
+                    font: options.textFont,
+                    fill: new Fill({ color: options.textFillColor }),
+                    stroke: new Stroke({
+                        color: options.textStrokeColor,
+                        width: options.textStrokeWidth
+                    })
+                }));
+            }
+        }
+        feature.setStyle(featureStyle);
     }
     /**
      * 设置外围蒙版图层
@@ -227,65 +340,133 @@ export default class Polygon {
     }
     /**
      * 添加图片图层
-     * @param layerName 图层名称
-     * @param img 图片地址
-     * @param extent 图片范围（对角线坐标） [minx, miny, maxx, maxy]
-     * @param options 图层配置
+     * @param imageData 图片数据，包含url和extent
+     * @param options 配置项
+     * @returns 创建的图片图层
+     * @throws 当数据格式无效时抛出错误
      */
-    addImage(layerName, img, extent, options) {
-        let imageLayer = MapTools.getLayerByLayerName(this.map, layerName)[0];
-        if (img && extent) {
-            const source = new ImageStatic({
-                url: img,
-                imageExtent: extent
-            });
-            if (imageLayer && imageLayer instanceof ImageLayer) {
-                imageLayer.setSource(source);
-            }
-            else {
-                imageLayer = new ImageLayer();
-                imageLayer.set('name', layerName);
-                imageLayer.set('layerName', layerName);
-                if (imageLayer instanceof ImageLayer)
-                    imageLayer.setSource(source);
-                imageLayer.setZIndex(options?.zIndex ?? 11);
-                imageLayer.setOpacity(options?.opacity ?? 1);
-                if (options?.visible !== undefined)
-                    imageLayer.setVisible(options?.visible);
-                if (options?.mapClip && options?.mapClipData) {
-                    imageLayer = MapTools.setMapClip(imageLayer, options?.mapClipData);
-                }
-                this.map.addLayer(imageLayer);
-            }
+    addImageLayer(imageData, options) {
+        if (!imageData || !imageData.img || !imageData.extent) {
+            throw new Error('Invalid image data: img and extent are required');
         }
-        else {
-            this.removePolygonLayer(layerName);
+        if (!Array.isArray(imageData.extent) || imageData.extent.length !== 4) {
+            throw new Error('Invalid extent: must be an array of 4 numbers [minX, minY, maxX, maxY]');
         }
+        const mergedOptions = {
+            opacity: 1,
+            visible: true,
+            zIndex: 11,
+            layerName: 'imageLayer',
+            ...options
+        };
+        // 如果指定了图层名称，先移除同名图层
+        if (mergedOptions.layerName) {
+            MapTools.removeLayer(this.map, mergedOptions.layerName);
+        }
+        const source = new ImageStatic({
+            url: imageData.img,
+            imageExtent: imageData.extent
+        });
+        const imageLayer = new ImageLayer({
+            source,
+            opacity: mergedOptions.opacity,
+            visible: mergedOptions.visible
+        });
+        imageLayer.set('name', mergedOptions.layerName);
+        imageLayer.set('layerName', mergedOptions.layerName);
+        imageLayer.setZIndex(mergedOptions.zIndex);
+        // 应用地图裁剪
+        if (mergedOptions.mapClip && mergedOptions.mapClipData) {
+            const clippedLayer = MapTools.setMapClip(imageLayer, mergedOptions.mapClipData);
+            this.map.addLayer(clippedLayer);
+            return clippedLayer;
+        }
+        this.map.addLayer(imageLayer);
         return imageLayer;
     }
-    addHeatmap(layerName, pointData, options) {
+    /**
+     * 添加热力图图层
+     * @param pointData 点数据数组
+     * @param options 热力图配置
+     */
+    addHeatmap(pointData, options) {
+        // 只有在指定layerName时才移除已存在的同名图层
+        if (options?.layerName) {
+            new MapTools(this.map).removeLayer(options.layerName);
+        }
         const heatmapLayer = new Heatmap({
             source: new VectorSource(),
             weight: function (fea) {
                 return fea.get('weight');
             },
-            blur: options.blur ?? 15,
-            radius: options.radius ?? 10,
-            zIndex: options.zIndex ?? 11,
-            opacity: options.opacity ?? 1,
+            blur: options?.blur ?? 15,
+            radius: options?.radius ?? 10,
+            zIndex: options?.zIndex ?? 11,
+            opacity: options?.opacity ?? 1,
         });
-        heatmapLayer.set('layerName', layerName);
+        // 只有在指定layerName时才设置layerName
+        if (options?.layerName) {
+            heatmapLayer.set('layerName', options.layerName);
+        }
         this.map.addLayer(heatmapLayer);
-        const max = Math.max(...pointData.map(item => item[options.valueKey]));
+        const valueKey = options?.valueKey || 'value';
+        const max = Math.max(...pointData.map(item => item[valueKey]));
         pointData.forEach((item) => {
             heatmapLayer?.getSource().addFeature(new Feature({
                 geometry: new Point([item.lgtd, item.lttd]),
-                weight: item[options.valueKey] / max //热力值范围是【0,1】；热力值计算 = 找出数据集中的最大值，然后用值除以最大值
+                weight: item[valueKey] / max //热力值范围是【0,1】；热力值计算 = 找出数据集中的最大值，然后用值除以最大值
             }));
         });
+        return heatmapLayer;
+    }
+    /**
+     * 添加遮罩图层
+     * @param data GeoJSON格式的遮罩数据
+     * @param options 配置项
+     * @returns 创建的遮罩图层
+     * @throws 当数据格式无效时抛出错误
+     */
+    addMaskLayer(data, options) {
+        if (!data) {
+            throw new Error('Mask data is required');
+        }
+        const mergedOptions = {
+            fillColor: 'rgba(0, 0, 0, 0.5)',
+            opacity: 1,
+            visible: true,
+            layerName: 'maskLayer',
+            ...options
+        };
+        let features;
+        try {
+            features = new GeoJSON().readFeatures(data);
+        }
+        catch (error) {
+            throw new Error(`Invalid GeoJSON data: ${error}`);
+        }
+        if (!features || features.length === 0) {
+            console.warn('No features found in mask data');
+        }
+        const maskLayer = new VectorLayer({
+            source: new VectorSource({ features }),
+            style: new Style({
+                fill: new Fill({
+                    color: mergedOptions.fillColor
+                }),
+                stroke: mergedOptions.strokeColor ? new Stroke({
+                    color: mergedOptions.strokeColor,
+                    width: mergedOptions.strokeWidth || 1
+                }) : undefined
+            }),
+            opacity: mergedOptions.opacity,
+            visible: mergedOptions.visible
+        });
+        maskLayer.set('layerName', mergedOptions.layerName);
+        this.map.addLayer(maskLayer);
+        return maskLayer;
     }
     removePolygonLayer(layerName) {
-        MapTools.removeLayer(this.map, layerName);
+        new MapTools(this.map).removeLayer(layerName);
         this[layerName] = null;
     }
 }

package/dist/index.d.ts

@@ -1,10 +1,17 @@
-import MyOl from "./MyOl";
-import Line from "./core/Line";
-import Point from "./core/Point";
-import MapTools from "./core/MapTools";
-import Polygon from "./core/Polygon";
-import MapBaseLayers from "./core/MapBaseLayers";
-import DomPoint from "./core/DomPoint";
-import MeasureHandler from "./core/MeasureHandler";
-export { Line, Point, MapTools, Polygon, MapBaseLayers, DomPoint, MeasureHandler };
-export default MyOl;
+export { default } from './MyOl';
+export { default as MyOl } from './MyOl';
+export { default as Point } from './core/Point';
+export { default as Line } from './core/Line';
+export { default as Polygon } from './core/Polygon';
+export { default as MapBaseLayers } from './core/MapBaseLayers';
+export { default as MapTools } from './core/MapTools';
+export { default as MeasureHandler } from './core/MeasureHandler';
+export { default as DomPoint } from './core/DomPoint';
+export { ConfigManager } from './core/ConfigManager';
+export { EventManager } from './core/EventManager';
+export type { MapEventType, EventCallback, MapEventData } from './core/EventManager';
+export { ErrorHandler, MyOpenLayersError, ErrorType } from './utils/ErrorHandler';
+export type { BaseOptions, StyleOptions, TextOptions } from './types';
+export type { PointOptions, LineOptions, PolygonOptions } from './types';
+export type { OptionsType } from './types';
+export type { MapInitType, MapLayersOptions, HeatMapOptions, ImageLayerData, MaskLayerOptions, ColorMap, FeatureColorUpdateOptions, PointData, LineData, ClusterOptions, MeasureHandlerType, EventType, DomPointOptions, MapJSONData, Feature, AnnotationType, TiandituType, MapLayers, AnnotationLayerOptions } from './types';

package/dist/index.js

@@ -1,10 +1,15 @@
-import MyOl from "./MyOl";
-import Line from "./core/Line";
-import Point from "./core/Point";
-import MapTools from "./core/MapTools";
-import Polygon from "./core/Polygon";
-import MapBaseLayers from "./core/MapBaseLayers";
-import DomPoint from "./core/DomPoint";
-import MeasureHandler from "./core/MeasureHandler";
-export { Line, Point, MapTools, Polygon, MapBaseLayers, DomPoint, MeasureHandler };
-export default MyOl;
+// 导出核心类 - 默认导出
+export { default } from './MyOl';
+export { default as MyOl } from './MyOl';
+export { default as Point } from './core/Point';
+export { default as Line } from './core/Line';
+export { default as Polygon } from './core/Polygon';
+export { default as MapBaseLayers } from './core/MapBaseLayers';
+export { default as MapTools } from './core/MapTools';
+export { default as MeasureHandler } from './core/MeasureHandler';
+export { default as DomPoint } from './core/DomPoint';
+// 新增工具类
+export { ConfigManager } from './core/ConfigManager';
+export { EventManager } from './core/EventManager';
+// 错误处理
+export { ErrorHandler, MyOpenLayersError, ErrorType } from './utils/ErrorHandler';