my-openlayer 2.4.8 → 2.4.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +207 -151
- package/README.md +156 -156
- package/core/Point.js +21 -3
- package/docs/.vitepress/config.mts +57 -57
- package/docs/ConfigManager.md +71 -71
- package/docs/ErrorHandler.md +106 -106
- package/docs/EventManager.md +142 -142
- package/docs/Line.md +187 -187
- package/docs/MapBaseLayers.md +198 -198
- package/docs/MapTools.md +172 -172
- package/docs/MeasureHandler.md +87 -87
- package/docs/MyOl.md +247 -247
- package/docs/Point.md +165 -165
- package/docs/Polygon.md +241 -241
- package/docs/RiverLayerManager.md +187 -187
- package/docs/SelectHandler.md +147 -147
- package/docs/ValidationUtils.md +83 -83
- package/docs/VueTemplatePoint.md +214 -214
- package/docs/index.md +78 -78
- package/package.json +1 -2
- package/types.d.ts +2 -0
- package/AI_CONTEXT.md +0 -147
package/docs/MapTools.md
CHANGED
|
@@ -1,172 +1,172 @@
|
|
|
1
|
-
# MapTools 地图工具类
|
|
2
|
-
|
|
3
|
-
`MapTools` 提供通用的地图操作工具,包括图层查找、移除、显隐控制、地图裁剪和视图自适应等功能。
|
|
4
|
-
|
|
5
|
-
## 构造函数
|
|
6
|
-
|
|
7
|
-
```typescript
|
|
8
|
-
const tools = new MapTools(map: Map);
|
|
9
|
-
```
|
|
10
|
-
|
|
11
|
-
- **map**: OpenLayers 地图实例。
|
|
12
|
-
|
|
13
|
-
## 方法
|
|
14
|
-
|
|
15
|
-
### 图层管理
|
|
16
|
-
|
|
17
|
-
#### getLayerByLayerName
|
|
18
|
-
|
|
19
|
-
根据名称获取图层对象(支持模糊匹配)。
|
|
20
|
-
|
|
21
|
-
```typescript
|
|
22
|
-
getLayerByLayerName(layerName: string | string[]): Layer[]
|
|
23
|
-
```
|
|
24
|
-
|
|
25
|
-
| 参数 | 类型 | 说明 |
|
|
26
|
-
| :--- | :--- | :--- |
|
|
27
|
-
| `layerName` | `string` \| `string[]` | 图层名称或名称数组 |
|
|
28
|
-
|
|
29
|
-
#### removeLayer
|
|
30
|
-
|
|
31
|
-
移除指定名称的图层。
|
|
32
|
-
|
|
33
|
-
```typescript
|
|
34
|
-
removeLayer(layerName: string | string[]): void
|
|
35
|
-
```
|
|
36
|
-
|
|
37
|
-
#### setLayerVisible
|
|
38
|
-
|
|
39
|
-
设置图层可见性。
|
|
40
|
-
|
|
41
|
-
```typescript
|
|
42
|
-
setLayerVisible(layerName: string, visible: boolean): void
|
|
43
|
-
```
|
|
44
|
-
|
|
45
|
-
### 视图操作
|
|
46
|
-
|
|
47
|
-
#### locationAction
|
|
48
|
-
|
|
49
|
-
视图定位动画。
|
|
50
|
-
|
|
51
|
-
```typescript
|
|
52
|
-
locationAction(lgtd: number, lttd: number, zoom = 20, duration = 3000): boolean
|
|
53
|
-
```
|
|
54
|
-
|
|
55
|
-
| 参数 | 类型 | 说明 |
|
|
56
|
-
| :--- | :--- | :--- |
|
|
57
|
-
| `lgtd` | `number` | 目标经度 |
|
|
58
|
-
| `lttd` | `number` | 目标纬度 |
|
|
59
|
-
| `zoom` | `number` | 目标缩放层级 |
|
|
60
|
-
| `duration` | `number` | 动画持续时间(毫秒) |
|
|
61
|
-
|
|
62
|
-
#### fitToLayers
|
|
63
|
-
|
|
64
|
-
缩放地图以适应指定图层的范围。
|
|
65
|
-
|
|
66
|
-
```typescript
|
|
67
|
-
fitToLayers(
|
|
68
|
-
layerNameOrLayers: string | string[] | Layer[],
|
|
69
|
-
fitOptions?: {
|
|
70
|
-
padding?: [number, number, number, number];
|
|
71
|
-
maxZoom?: number;
|
|
72
|
-
duration?: number;
|
|
73
|
-
}
|
|
74
|
-
): boolean
|
|
75
|
-
```
|
|
76
|
-
|
|
77
|
-
| 参数 | 类型 | 说明 |
|
|
78
|
-
| :--- | :--- | :--- |
|
|
79
|
-
| `layerNameOrLayers` | `string` \| `Layer[]` | 图层名称或图层对象数组 |
|
|
80
|
-
| `fitOptions` | `Object` | 缩放配置:padding (边距), maxZoom, duration |
|
|
81
|
-
|
|
82
|
-
#### fitByData
|
|
83
|
-
|
|
84
|
-
缩放地图以适应 GeoJSON 数据的范围。
|
|
85
|
-
|
|
86
|
-
```typescript
|
|
87
|
-
fitByData(
|
|
88
|
-
jsonData: MapJSONData,
|
|
89
|
-
fitOptions?: {
|
|
90
|
-
padding?: [number, number, number, number];
|
|
91
|
-
maxZoom?: number;
|
|
92
|
-
duration?: number;
|
|
93
|
-
}
|
|
94
|
-
): boolean
|
|
95
|
-
```
|
|
96
|
-
|
|
97
|
-
### 高级功能
|
|
98
|
-
|
|
99
|
-
#### setMapClip
|
|
100
|
-
|
|
101
|
-
设置地图裁剪区域(基于 Canvas 的裁剪)。
|
|
102
|
-
|
|
103
|
-
```typescript
|
|
104
|
-
static setMapClip(baseLayer: Layer, data: MapJSONData): Layer
|
|
105
|
-
```
|
|
106
|
-
|
|
107
|
-
| 参数 | 类型 | 说明 |
|
|
108
|
-
| :--- | :--- | :--- |
|
|
109
|
-
| `baseLayer` | `Layer` | 需要被裁剪的图层 |
|
|
110
|
-
| `data` | `MapJSONData` | 定义裁剪形状的 GeoJSON 数据 |
|
|
111
|
-
|
|
112
|
-
## 使用示例
|
|
113
|
-
|
|
114
|
-
### 图层查找与控制
|
|
115
|
-
|
|
116
|
-
```typescript
|
|
117
|
-
const tools = map.getTools();
|
|
118
|
-
|
|
119
|
-
// 1. 获取图层
|
|
120
|
-
const layers = tools.getLayerByLayerName('my-layer');
|
|
121
|
-
if (layers.length > 0) {
|
|
122
|
-
console.log('找到图层:', layers[0]);
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
// 2. 移除图层
|
|
126
|
-
tools.removeLayer('temp-layer');
|
|
127
|
-
|
|
128
|
-
// 3. 设置可见性
|
|
129
|
-
tools.setLayerVisible('background-layer', false);
|
|
130
|
-
```
|
|
131
|
-
|
|
132
|
-
### 视图定位与缩放
|
|
133
|
-
|
|
134
|
-
```typescript
|
|
135
|
-
// 定位到指定坐标
|
|
136
|
-
tools.locationAction(120.123, 30.456, 15, 2000);
|
|
137
|
-
|
|
138
|
-
// 缩放以包含指定图层的所有要素
|
|
139
|
-
tools.fitToLayers('target-layer', {
|
|
140
|
-
padding: [50, 50, 50, 50], // 上右下左边距
|
|
141
|
-
duration: 1000
|
|
142
|
-
});
|
|
143
|
-
|
|
144
|
-
// 缩放以包含 GeoJSON 数据范围
|
|
145
|
-
tools.fitByData(geoJsonData, {
|
|
146
|
-
maxZoom: 18
|
|
147
|
-
});
|
|
148
|
-
```
|
|
149
|
-
|
|
150
|
-
### 地图裁剪
|
|
151
|
-
|
|
152
|
-
```typescript
|
|
153
|
-
// 创建底图图层
|
|
154
|
-
const baseLayer = new TileLayer({ ... });
|
|
155
|
-
|
|
156
|
-
// 定义裁剪区域(例如一个多边形)
|
|
157
|
-
const clipPolygon = {
|
|
158
|
-
type: 'FeatureCollection',
|
|
159
|
-
features: [{
|
|
160
|
-
type: 'Feature',
|
|
161
|
-
geometry: {
|
|
162
|
-
type: 'Polygon',
|
|
163
|
-
coordinates: [[...]]
|
|
164
|
-
}
|
|
165
|
-
}]
|
|
166
|
-
};
|
|
167
|
-
|
|
168
|
-
// 应用裁剪
|
|
169
|
-
// 注意:这会修改 baseLayer 的渲染行为,使其只在 clipPolygon 范围内显示
|
|
170
|
-
MapTools.setMapClip(baseLayer, clipPolygon);
|
|
171
|
-
map.addLayer(baseLayer);
|
|
172
|
-
```
|
|
1
|
+
# MapTools 地图工具类
|
|
2
|
+
|
|
3
|
+
`MapTools` 提供通用的地图操作工具,包括图层查找、移除、显隐控制、地图裁剪和视图自适应等功能。
|
|
4
|
+
|
|
5
|
+
## 构造函数
|
|
6
|
+
|
|
7
|
+
```typescript
|
|
8
|
+
const tools = new MapTools(map: Map);
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
- **map**: OpenLayers 地图实例。
|
|
12
|
+
|
|
13
|
+
## 方法
|
|
14
|
+
|
|
15
|
+
### 图层管理
|
|
16
|
+
|
|
17
|
+
#### getLayerByLayerName
|
|
18
|
+
|
|
19
|
+
根据名称获取图层对象(支持模糊匹配)。
|
|
20
|
+
|
|
21
|
+
```typescript
|
|
22
|
+
getLayerByLayerName(layerName: string | string[]): Layer[]
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
| 参数 | 类型 | 说明 |
|
|
26
|
+
| :--- | :--- | :--- |
|
|
27
|
+
| `layerName` | `string` \| `string[]` | 图层名称或名称数组 |
|
|
28
|
+
|
|
29
|
+
#### removeLayer
|
|
30
|
+
|
|
31
|
+
移除指定名称的图层。
|
|
32
|
+
|
|
33
|
+
```typescript
|
|
34
|
+
removeLayer(layerName: string | string[]): void
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
#### setLayerVisible
|
|
38
|
+
|
|
39
|
+
设置图层可见性。
|
|
40
|
+
|
|
41
|
+
```typescript
|
|
42
|
+
setLayerVisible(layerName: string, visible: boolean): void
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
### 视图操作
|
|
46
|
+
|
|
47
|
+
#### locationAction
|
|
48
|
+
|
|
49
|
+
视图定位动画。
|
|
50
|
+
|
|
51
|
+
```typescript
|
|
52
|
+
locationAction(lgtd: number, lttd: number, zoom = 20, duration = 3000): boolean
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
| 参数 | 类型 | 说明 |
|
|
56
|
+
| :--- | :--- | :--- |
|
|
57
|
+
| `lgtd` | `number` | 目标经度 |
|
|
58
|
+
| `lttd` | `number` | 目标纬度 |
|
|
59
|
+
| `zoom` | `number` | 目标缩放层级 |
|
|
60
|
+
| `duration` | `number` | 动画持续时间(毫秒) |
|
|
61
|
+
|
|
62
|
+
#### fitToLayers
|
|
63
|
+
|
|
64
|
+
缩放地图以适应指定图层的范围。
|
|
65
|
+
|
|
66
|
+
```typescript
|
|
67
|
+
fitToLayers(
|
|
68
|
+
layerNameOrLayers: string | string[] | Layer[],
|
|
69
|
+
fitOptions?: {
|
|
70
|
+
padding?: [number, number, number, number];
|
|
71
|
+
maxZoom?: number;
|
|
72
|
+
duration?: number;
|
|
73
|
+
}
|
|
74
|
+
): boolean
|
|
75
|
+
```
|
|
76
|
+
|
|
77
|
+
| 参数 | 类型 | 说明 |
|
|
78
|
+
| :--- | :--- | :--- |
|
|
79
|
+
| `layerNameOrLayers` | `string` \| `Layer[]` | 图层名称或图层对象数组 |
|
|
80
|
+
| `fitOptions` | `Object` | 缩放配置:padding (边距), maxZoom, duration |
|
|
81
|
+
|
|
82
|
+
#### fitByData
|
|
83
|
+
|
|
84
|
+
缩放地图以适应 GeoJSON 数据的范围。
|
|
85
|
+
|
|
86
|
+
```typescript
|
|
87
|
+
fitByData(
|
|
88
|
+
jsonData: MapJSONData,
|
|
89
|
+
fitOptions?: {
|
|
90
|
+
padding?: [number, number, number, number];
|
|
91
|
+
maxZoom?: number;
|
|
92
|
+
duration?: number;
|
|
93
|
+
}
|
|
94
|
+
): boolean
|
|
95
|
+
```
|
|
96
|
+
|
|
97
|
+
### 高级功能
|
|
98
|
+
|
|
99
|
+
#### setMapClip
|
|
100
|
+
|
|
101
|
+
设置地图裁剪区域(基于 Canvas 的裁剪)。
|
|
102
|
+
|
|
103
|
+
```typescript
|
|
104
|
+
static setMapClip(baseLayer: Layer, data: MapJSONData): Layer
|
|
105
|
+
```
|
|
106
|
+
|
|
107
|
+
| 参数 | 类型 | 说明 |
|
|
108
|
+
| :--- | :--- | :--- |
|
|
109
|
+
| `baseLayer` | `Layer` | 需要被裁剪的图层 |
|
|
110
|
+
| `data` | `MapJSONData` | 定义裁剪形状的 GeoJSON 数据 |
|
|
111
|
+
|
|
112
|
+
## 使用示例
|
|
113
|
+
|
|
114
|
+
### 图层查找与控制
|
|
115
|
+
|
|
116
|
+
```typescript
|
|
117
|
+
const tools = map.getTools();
|
|
118
|
+
|
|
119
|
+
// 1. 获取图层
|
|
120
|
+
const layers = tools.getLayerByLayerName('my-layer');
|
|
121
|
+
if (layers.length > 0) {
|
|
122
|
+
console.log('找到图层:', layers[0]);
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
// 2. 移除图层
|
|
126
|
+
tools.removeLayer('temp-layer');
|
|
127
|
+
|
|
128
|
+
// 3. 设置可见性
|
|
129
|
+
tools.setLayerVisible('background-layer', false);
|
|
130
|
+
```
|
|
131
|
+
|
|
132
|
+
### 视图定位与缩放
|
|
133
|
+
|
|
134
|
+
```typescript
|
|
135
|
+
// 定位到指定坐标
|
|
136
|
+
tools.locationAction(120.123, 30.456, 15, 2000);
|
|
137
|
+
|
|
138
|
+
// 缩放以包含指定图层的所有要素
|
|
139
|
+
tools.fitToLayers('target-layer', {
|
|
140
|
+
padding: [50, 50, 50, 50], // 上右下左边距
|
|
141
|
+
duration: 1000
|
|
142
|
+
});
|
|
143
|
+
|
|
144
|
+
// 缩放以包含 GeoJSON 数据范围
|
|
145
|
+
tools.fitByData(geoJsonData, {
|
|
146
|
+
maxZoom: 18
|
|
147
|
+
});
|
|
148
|
+
```
|
|
149
|
+
|
|
150
|
+
### 地图裁剪
|
|
151
|
+
|
|
152
|
+
```typescript
|
|
153
|
+
// 创建底图图层
|
|
154
|
+
const baseLayer = new TileLayer({ ... });
|
|
155
|
+
|
|
156
|
+
// 定义裁剪区域(例如一个多边形)
|
|
157
|
+
const clipPolygon = {
|
|
158
|
+
type: 'FeatureCollection',
|
|
159
|
+
features: [{
|
|
160
|
+
type: 'Feature',
|
|
161
|
+
geometry: {
|
|
162
|
+
type: 'Polygon',
|
|
163
|
+
coordinates: [[...]]
|
|
164
|
+
}
|
|
165
|
+
}]
|
|
166
|
+
};
|
|
167
|
+
|
|
168
|
+
// 应用裁剪
|
|
169
|
+
// 注意:这会修改 baseLayer 的渲染行为,使其只在 clipPolygon 范围内显示
|
|
170
|
+
MapTools.setMapClip(baseLayer, clipPolygon);
|
|
171
|
+
map.addLayer(baseLayer);
|
|
172
|
+
```
|
package/docs/MeasureHandler.md
CHANGED
|
@@ -1,87 +1,87 @@
|
|
|
1
|
-
# MeasureHandler 类
|
|
2
|
-
|
|
3
|
-
`MeasureHandler` 类提供地图上的距离和面积测量功能。
|
|
4
|
-
|
|
5
|
-
## 构造函数
|
|
6
|
-
|
|
7
|
-
```typescript
|
|
8
|
-
constructor(map: Map)
|
|
9
|
-
```
|
|
10
|
-
|
|
11
|
-
- **map**: OpenLayers 地图实例。
|
|
12
|
-
|
|
13
|
-
## 类型定义
|
|
14
|
-
|
|
15
|
-
### MeasureHandlerType
|
|
16
|
-
|
|
17
|
-
```typescript
|
|
18
|
-
type MeasureHandlerType = 'LineString' | 'Polygon';
|
|
19
|
-
```
|
|
20
|
-
|
|
21
|
-
## 方法
|
|
22
|
-
|
|
23
|
-
### start
|
|
24
|
-
|
|
25
|
-
开始测量。
|
|
26
|
-
|
|
27
|
-
```typescript
|
|
28
|
-
start(type: MeasureHandlerType): void
|
|
29
|
-
```
|
|
30
|
-
|
|
31
|
-
- **type**: 测量类型,`'LineString'` (测距) 或 `'Polygon'` (测面)。
|
|
32
|
-
- **说明**: 调用此方法后,鼠标在地图上点击开始绘制,双击结束绘制。绘制过程中会显示测量结果的 tooltip。
|
|
33
|
-
|
|
34
|
-
### end
|
|
35
|
-
|
|
36
|
-
结束测量绘制交互,但保留测量结果。
|
|
37
|
-
|
|
38
|
-
```typescript
|
|
39
|
-
end(): void
|
|
40
|
-
```
|
|
41
|
-
|
|
42
|
-
### clean
|
|
43
|
-
|
|
44
|
-
清除所有测量结果和交互。
|
|
45
|
-
|
|
46
|
-
```typescript
|
|
47
|
-
clean(): void
|
|
48
|
-
```
|
|
49
|
-
|
|
50
|
-
- **说明**: 移除地图上的所有测量绘制、结果标签和 tooltip。
|
|
51
|
-
|
|
52
|
-
### destroy
|
|
53
|
-
|
|
54
|
-
销毁实例。
|
|
55
|
-
|
|
56
|
-
```typescript
|
|
57
|
-
destory(): void
|
|
58
|
-
```
|
|
59
|
-
|
|
60
|
-
- **说明**: 彻底清理资源,同 `clean`。
|
|
61
|
-
|
|
62
|
-
## 使用示例
|
|
63
|
-
|
|
64
|
-
### 测距
|
|
65
|
-
|
|
66
|
-
```typescript
|
|
67
|
-
import { MeasureHandler } from 'my-openlayers';
|
|
68
|
-
|
|
69
|
-
const measureTool = new MeasureHandler(map);
|
|
70
|
-
|
|
71
|
-
// 开始测距
|
|
72
|
-
measureTool.start('LineString');
|
|
73
|
-
```
|
|
74
|
-
|
|
75
|
-
### 测面
|
|
76
|
-
|
|
77
|
-
```typescript
|
|
78
|
-
// 开始测面
|
|
79
|
-
measureTool.start('Polygon');
|
|
80
|
-
```
|
|
81
|
-
|
|
82
|
-
### 清除测量
|
|
83
|
-
|
|
84
|
-
```typescript
|
|
85
|
-
// 清除所有测量结果
|
|
86
|
-
measureTool.clean();
|
|
87
|
-
```
|
|
1
|
+
# MeasureHandler 类
|
|
2
|
+
|
|
3
|
+
`MeasureHandler` 类提供地图上的距离和面积测量功能。
|
|
4
|
+
|
|
5
|
+
## 构造函数
|
|
6
|
+
|
|
7
|
+
```typescript
|
|
8
|
+
constructor(map: Map)
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
- **map**: OpenLayers 地图实例。
|
|
12
|
+
|
|
13
|
+
## 类型定义
|
|
14
|
+
|
|
15
|
+
### MeasureHandlerType
|
|
16
|
+
|
|
17
|
+
```typescript
|
|
18
|
+
type MeasureHandlerType = 'LineString' | 'Polygon';
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
## 方法
|
|
22
|
+
|
|
23
|
+
### start
|
|
24
|
+
|
|
25
|
+
开始测量。
|
|
26
|
+
|
|
27
|
+
```typescript
|
|
28
|
+
start(type: MeasureHandlerType): void
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
- **type**: 测量类型,`'LineString'` (测距) 或 `'Polygon'` (测面)。
|
|
32
|
+
- **说明**: 调用此方法后,鼠标在地图上点击开始绘制,双击结束绘制。绘制过程中会显示测量结果的 tooltip。
|
|
33
|
+
|
|
34
|
+
### end
|
|
35
|
+
|
|
36
|
+
结束测量绘制交互,但保留测量结果。
|
|
37
|
+
|
|
38
|
+
```typescript
|
|
39
|
+
end(): void
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
### clean
|
|
43
|
+
|
|
44
|
+
清除所有测量结果和交互。
|
|
45
|
+
|
|
46
|
+
```typescript
|
|
47
|
+
clean(): void
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
- **说明**: 移除地图上的所有测量绘制、结果标签和 tooltip。
|
|
51
|
+
|
|
52
|
+
### destroy
|
|
53
|
+
|
|
54
|
+
销毁实例。
|
|
55
|
+
|
|
56
|
+
```typescript
|
|
57
|
+
destory(): void
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
- **说明**: 彻底清理资源,同 `clean`。
|
|
61
|
+
|
|
62
|
+
## 使用示例
|
|
63
|
+
|
|
64
|
+
### 测距
|
|
65
|
+
|
|
66
|
+
```typescript
|
|
67
|
+
import { MeasureHandler } from 'my-openlayers';
|
|
68
|
+
|
|
69
|
+
const measureTool = new MeasureHandler(map);
|
|
70
|
+
|
|
71
|
+
// 开始测距
|
|
72
|
+
measureTool.start('LineString');
|
|
73
|
+
```
|
|
74
|
+
|
|
75
|
+
### 测面
|
|
76
|
+
|
|
77
|
+
```typescript
|
|
78
|
+
// 开始测面
|
|
79
|
+
measureTool.start('Polygon');
|
|
80
|
+
```
|
|
81
|
+
|
|
82
|
+
### 清除测量
|
|
83
|
+
|
|
84
|
+
```typescript
|
|
85
|
+
// 清除所有测量结果
|
|
86
|
+
measureTool.clean();
|
|
87
|
+
```
|