my-openlayer 3.0.1 → 3.1.0

package/core/line/RiverLayerManager.js

@@ -1,340 +0,0 @@
-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 ValidationUtils from "../../utils/ValidationUtils";
-import { ErrorHandler } from "../../utils/ErrorHandler";
-import { ConfigManager, EventManager, MapTools } from "../map";
-export default class RiverLayerManager {
-    /**
-     * 构造函数
-     * @param map OpenLayers 地图实例
-     * @param eventManager 可选事件管理器，未传入则内部创建
-     */
-    constructor(map, eventManager) {
-        //************* 状态：分级河流图层列表与显示控制 *************
-        this.riverLayerList = [];
-        this.riverLayerShow = false;
-        this.riverZoomOffset = 8;
-        //************* 默认配置：按 level 映射线宽 *************
-        this.defaultLevelWidthMap = ConfigManager.DEFAULT_RIVER_LEVEL_WIDTH_MAP;
-        ValidationUtils.validateMapInstance(map);
-        this.map = map;
-        this.eventManager = eventManager ?? new EventManager(map);
-    }
-    addRiverLayersByZoom(fyRiverJson, options = {}) {
-        ValidationUtils.validateGeoJSONData(fyRiverJson);
-        const defaultOptions = {
-            ...ConfigManager.DEFAULT_RIVER_LAYERS_BY_ZOOM_OPTIONS,
-            removeExisting: options.removeExisting ?? false,
-            levelWidthMap: this.defaultLevelWidthMap
-        };
-        const mergedOptions = { ...defaultOptions, ...options };
-        this.riverZoomOffset = mergedOptions.zoomOffset;
-        if (mergedOptions.removeExisting) {
-            this.clearRiverLayers();
-        }
-        this.riverLayerShow = mergedOptions.visible;
-        this.riverLayerList = [];
-        for (let level = 1; level <= mergedOptions.levelCount; level++) {
-            const vectorSource = new VectorSource({
-                format: new GeoJSON(),
-                loader: () => {
-                    const geojson = new GeoJSON();
-                    fyRiverJson.features.forEach((feature) => {
-                        if (feature.properties && feature.properties.level === level) {
-                            try {
-                                const olFeature = geojson.readFeature(feature);
-                                if (Array.isArray(olFeature)) {
-                                    vectorSource.addFeatures(olFeature);
-                                }
-                                else {
-                                    vectorSource.addFeature(olFeature);
-                                }
-                            }
-                            catch (error) {
-                                ErrorHandler.getInstance().warn(`Failed to load river feature at level ${level}:`, error);
-                            }
-                        }
-                    });
-                }
-            });
-            const riverLayer = new VectorLayer({
-                properties: {
-                    name: mergedOptions.layerName,
-                    layerName: mergedOptions.layerName,
-                    riverLevel: level
-                },
-                source: vectorSource,
-                style: (feature) => {
-                    if (feature instanceof Feature) {
-                        feature.set("type", mergedOptions.layerName);
-                        feature.set("layerName", mergedOptions.layerName);
-                    }
-                    if (mergedOptions.style) {
-                        if (typeof mergedOptions.style === "function") {
-                            return mergedOptions.style(feature);
-                        }
-                        else {
-                            return mergedOptions.style;
-                        }
-                    }
-                    return new Style({
-                        stroke: new Stroke({
-                            color: mergedOptions.strokeColor,
-                            width: mergedOptions.strokeWidth
-                        })
-                    });
-                },
-                zIndex: mergedOptions.zIndex
-            });
-            riverLayer.setVisible(false);
-            this.riverLayerList.push(riverLayer);
-            this.map.addLayer(riverLayer);
-        }
-        this.eventManager.on("moveend", () => {
-            this.showRiverLayerByZoom();
-        });
-        this.showRiverLayerByZoom();
-    }
-    //************* 分级河流：按缩放级别显示（URL 加载） *************
-    /**
-     * 从 URL 添加分级河流图层：根据缩放级别显示不同 level 的河流
-     * @param url 河流数据 URL（GeoJSON）
-     * @param options 河流图层配置选项
-     */
-    addRiverLayersByZoomByUrl(url, options = {}) {
-        const defaultOptions = {
-            ...ConfigManager.DEFAULT_RIVER_LAYERS_BY_ZOOM_OPTIONS,
-            removeExisting: options.removeExisting ?? false,
-            levelWidthMap: this.defaultLevelWidthMap
-        };
-        const mergedOptions = { ...defaultOptions, ...options };
-        this.riverZoomOffset = mergedOptions.zoomOffset;
-        if (mergedOptions.removeExisting) {
-            this.clearRiverLayers();
-        }
-        this.riverLayerShow = mergedOptions.visible;
-        this.riverLayerList = [];
-        for (let level = 1; level <= mergedOptions.levelCount; level++) {
-            const vectorSource = new VectorSource({
-                url,
-                format: new GeoJSON(),
-                loader: function (extent, resolution, projection, success, failure) {
-                    fetch(url)
-                        .then(response => response.json())
-                        .then(data => {
-                        const geojson = new GeoJSON();
-                        data.features.forEach((feature) => {
-                            if (feature.properties && feature.properties.level === level) {
-                                try {
-                                    const olFeature = geojson.readFeature(feature);
-                                    if (Array.isArray(olFeature)) {
-                                        vectorSource.addFeatures(olFeature);
-                                    }
-                                    else {
-                                        vectorSource.addFeature(olFeature);
-                                    }
-                                }
-                                catch (error) {
-                                    ErrorHandler.getInstance().warn(`Failed to load river feature at level ${level}:`, error);
-                                }
-                            }
-                        });
-                        success?.(vectorSource.getFeatures());
-                    })
-                        .catch(error => {
-                        ErrorHandler.getInstance().error("Error loading river data:", error);
-                        failure?.();
-                    });
-                }
-            });
-            const riverLayer = new VectorLayer({
-                properties: {
-                    name: mergedOptions.layerName,
-                    layerName: mergedOptions.layerName,
-                    riverLevel: level
-                },
-                source: vectorSource,
-                style: (feature) => {
-                    if (feature instanceof Feature) {
-                        feature.set("type", mergedOptions.layerName);
-                        feature.set("layerName", mergedOptions.layerName);
-                    }
-                    if (mergedOptions.style) {
-                        if (typeof mergedOptions.style === "function") {
-                            return mergedOptions.style(feature);
-                        }
-                        else {
-                            return mergedOptions.style;
-                        }
-                    }
-                    return new Style({
-                        stroke: new Stroke({
-                            color: mergedOptions.strokeColor,
-                            width: mergedOptions.strokeWidth
-                        })
-                    });
-                },
-                zIndex: mergedOptions.zIndex
-            });
-            riverLayer.setVisible(false);
-            this.riverLayerList.push(riverLayer);
-            this.map.addLayer(riverLayer);
-        }
-        this.eventManager.on("moveend", () => {
-            this.showRiverLayerByZoom();
-        });
-        this.showRiverLayerByZoom();
-    }
-    //************* 分级河流：显示控制 *************
-    /**
-     * 设置分级河流图层是否显示
-     * @param show 是否显示
-     */
-    showRiverLayer(show) {
-        this.riverLayerShow = show;
-        this.showRiverLayerByZoom();
-    }
-    /**
-     * 根据当前 zoom 显示对应分级河流图层
-     * 缩放越大，显示的 riverLevel 越多
-     */
-    showRiverLayerByZoom() {
-        const zoom = this.map.getView().getZoom();
-        if (!zoom) {
-            return;
-        }
-        this.riverLayerList.forEach((layer, index) => {
-            const displayThreshold = index + 1 + this.riverZoomOffset;
-            if (zoom > displayThreshold) {
-                layer.setVisible(this.riverLayerShow);
-            }
-            else {
-                layer.setVisible(false);
-            }
-        });
-    }
-    addRiverWidthByLevel(data, options = {}) {
-        ValidationUtils.validateGeoJSONData(data);
-        const mergedOptions = {
-            ...ConfigManager.DEFAULT_RIVER_WIDTH_BY_LEVEL_OPTIONS,
-            ...options,
-            removeExisting: options.removeExisting ?? ConfigManager.DEFAULT_RIVER_WIDTH_BY_LEVEL_OPTIONS.removeExisting,
-            levelWidthMap: options.levelWidthMap ?? this.defaultLevelWidthMap,
-        };
-        if (mergedOptions.removeExisting && mergedOptions.layerName) {
-            MapTools.removeLayer(this.map, mergedOptions.layerName);
-        }
-        const features = new GeoJSON().readFeatures(data, mergedOptions.projectionOptOptions);
-        const riverLayer = new VectorLayer({
-            properties: {
-                name: mergedOptions.layerName,
-                layerName: mergedOptions.layerName
-            },
-            source: new VectorSource({ features }),
-            style: (feature) => {
-                if (mergedOptions.style) {
-                    if (typeof mergedOptions.style === "function") {
-                        return mergedOptions.style(feature);
-                    }
-                    else {
-                        return mergedOptions.style;
-                    }
-                }
-                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;
-    }
-    //************* 河流线宽：按 level 设置不同宽度（URL 加载） *************
-    /**
-     * 从 URL 添加按级别显示不同宽度的河流图层
-     * @param url 河流数据 URL（GeoJSON）
-     * @param options 河流图层配置选项
-     */
-    addRiverWidthByLevelByUrl(url, options = {}) {
-        const mergedOptions = {
-            ...ConfigManager.DEFAULT_RIVER_WIDTH_BY_LEVEL_OPTIONS,
-            ...options,
-            removeExisting: options.removeExisting ?? ConfigManager.DEFAULT_RIVER_WIDTH_BY_LEVEL_OPTIONS.removeExisting,
-            levelWidthMap: options.levelWidthMap ?? this.defaultLevelWidthMap,
-        };
-        if (mergedOptions.removeExisting && mergedOptions.layerName) {
-            MapTools.removeLayer(this.map, mergedOptions.layerName);
-        }
-        const source = new VectorSource({
-            url,
-            format: new GeoJSON(options.projectionOptOptions)
-        });
-        const riverLayer = new VectorLayer({
-            properties: {
-                name: mergedOptions.layerName,
-                layerName: mergedOptions.layerName
-            },
-            source,
-            style: (feature) => {
-                if (mergedOptions.style) {
-                    if (typeof mergedOptions.style === "function") {
-                        return mergedOptions.style(feature);
-                    }
-                    else {
-                        return mergedOptions.style;
-                    }
-                }
-                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;
-    }
-    //************* 清理与状态查询 *************
-    /**
-     * 清除本管理器创建的分级河流图层
-     */
-    clearRiverLayers() {
-        this.riverLayerList.forEach(layer => {
-            this.map.removeLayer(layer);
-        });
-        this.riverLayerList = [];
-        this.riverLayerShow = false;
-    }
-    /**
-     * 获取分级河流图层显示状态
-     */
-    getRiverLayerVisibility() {
-        return this.riverLayerShow;
-    }
-    /**
-     * 获取分级河流图层列表副本
-     */
-    getRiverLayers() {
-        return [...this.riverLayerList];
-    }
-    /**
-     * 销毁管理器，释放资源
-     */
-    destroy() {
-        this.clearRiverLayers();
-    }
-}

package/docs/RiverLayerManager.md

@@ -1,187 +0,0 @@
-# RiverLayerManager 河流图层管理类
-
-`RiverLayerManager` 专门用于处理河流数据的分级显示和样式管理。它支持基于地图缩放级别（Zoom-based）的动态分级显示，以及基于河流属性等级（Level-based）的固定线宽渲染。
-
-## 构造函数
-
-```typescript
-constructor(map: Map, eventManager?: EventManager)
-```
-
-- **参数**:
-  - `map` (Map): OpenLayers 地图实例。
-  - `eventManager` (EventManager): 可选。事件管理器实例，如果未提供则内部创建。
-
-## 接口定义
-
-### RiverLayerOptions
-
-河流图层配置选项，继承自 `LineOptions`。
-
-| 属性 | 类型 | 必填 | 默认值 | 描述 |
-| :--- | :--- | :--- | :--- | :--- |
-| levelCount | `number` | 否 | `5` | 河流等级总数。用于分级显示循环加载。 |
-| zoomOffset | `number` | 否 | `8` | 缩放级别偏移量。控制何时显示哪一级河流 (Zoom > Level + Offset)。 |
-| levelWidthMap | `RiverLevelWidthMap` | 否 | 默认映射 | 河流级别与线宽的映射对象。 |
-| removeExisting | `boolean` | 否 | `false` | 添加前是否删除由本管理器创建的旧图层。 |
-| layerName | `string` | 否 | - | 图层名称，用于标识和清理。 |
-| visible | `boolean` | 否 | `true` | 初始可见性。 |
-| strokeColor | `string` | 否 | - | 线条颜色。 |
-| strokeWidth | `number` | 否 | - | 基础线宽（如果未使用 levelWidthMap）。 |
-| zIndex | `number` | 否 | - | 图层 Z-Index。 |
-| projectionOptOptions | `any` | 否 | - | GeoJSON 读取时的投影选项。 |
-
-### RiverLevelWidthMap
-
-河流级别线宽映射接口。
-
-```typescript
-interface RiverLevelWidthMap {
-  [level: number]: number;
-}
-```
-
-默认映射 (`ConfigManager.DEFAULT_RIVER_LEVEL_WIDTH_MAP`) 通常为 `{1: 5, 2: 4, 3: 3, 4: 2, 5: 1}` 等类似结构。
-
-## 方法
-
-### 分级显示 (Zoom-based)
-
-根据地图缩放级别自动显示不同等级的河流。通常用于实现“缩放越大约详细”的效果。
-
-#### addRiverLayersByZoom
-
-直接传递 GeoJSON 数据添加分级河流图层。
-
-```typescript
-addRiverLayersByZoom(fyRiverJson: MapJSONData, options?: RiverLayerOptions): void
-```
-
-- **参数**:
-  - `fyRiverJson`: 河流 GeoJSON 数据对象。
-  - `options`: 配置选项。
-
-#### addRiverLayersByZoomByUrl
-
-通过 URL 加载 GeoJSON 数据并添加分级河流图层。
-
-```typescript
-addRiverLayersByZoomByUrl(url: string, options?: RiverLayerOptions): void
-```
-
-#### showRiverLayer
-
-控制分级河流图层的总开关。
-
-```typescript
-showRiverLayer(show: boolean): void
-```
-
-#### showRiverLayerByZoom
-
-手动触发根据当前缩放级别更新图层可见性（通常不需要手动调用，已绑定 `moveend` 事件）。
-
-```typescript
-showRiverLayerByZoom(): void
-```
-
-### 宽度分级 (Level-based Width)
-
-根据河流数据中的 `level` 属性渲染不同宽度的线条，通常用于静态展示不同等级河流的粗细差异。
-
-#### addRiverWidthByLevel
-
-直接传递 GeoJSON 数据添加按等级设定宽度的河流。
-
-```typescript
-addRiverWidthByLevel(data: MapJSONData, options?: RiverLayerOptions): VectorLayer<VectorSource>
-```
-
-- **返回值**: 创建的矢量图层。
-
-#### addRiverWidthByLevelByUrl
-
-通过 URL 加载 GeoJSON 数据并添加按等级设定宽度的河流。
-
-```typescript
-addRiverWidthByLevelByUrl(url: string, options?: RiverLayerOptions): VectorLayer<VectorSource>
-```
-
-### 管理与清理
-
-#### clearRiverLayers
-
-清除所有由该管理器创建的分级河流图层。
-
-```typescript
-clearRiverLayers(): void
-```
-
-#### getRiverLayerVisibility
-
-获取当前分级河流图层的总显示状态。
-
-```typescript
-getRiverLayerVisibility(): boolean
-```
-
-#### getRiverLayers
-
-获取当前管理的所有分级河流图层列表。
-
-```typescript
-getRiverLayers(): VectorLayer<VectorSource>[]
-```
-
-#### destroy
-
-销毁管理器，清理所有图层和事件监听。
-
-```typescript
-destroy(): void
-```
-
-## 使用示例
-
-```typescript
-import { MyOl, RiverLayerManager } from 'my-openlayer';
-
-const map = new MyOl('map-container');
-const riverManager = new RiverLayerManager(map.map);
-
-// 假设 riverGeoJSON 数据中每个 feature 都有 properties.level (1-5)
-
-// 示例 1: 添加分级河流（随地图缩放自动显隐不同级别的河流）
-// Level 1 在 Zoom > 9 (1+8) 显示
-// Level 2 在 Zoom > 10 (2+8) 显示
-// ...
-riverManager.addRiverLayersByZoom(riverGeoJSON, {
-  layerName: 'dynamic-river',
-  levelCount: 5, 
-  zoomOffset: 8, 
-  strokeColor: '#0071FF',
-  strokeWidth: 2,
-  removeExisting: true
-});
-
-// 控制分级河流的总开关
-riverManager.showRiverLayer(false); // 全部隐藏
-riverManager.showRiverLayer(true);  // 恢复并根据当前 Zoom 显示对应级别
-
-// 示例 2: 添加静态河流，根据等级显示不同粗细
-riverManager.addRiverWidthByLevel(riverGeoJSON, {
-  layerName: 'static-river',
-  strokeColor: '#0071FF',
-  levelWidthMap: {
-    1: 6, // 1级河流宽 6px
-    2: 5,
-    3: 4,
-    4: 3,
-    5: 1
-  },
-  zIndex: 10
-});
-
-// 清理资源
-// riverManager.destroy();
-```