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/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
+ ```
@@ -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
+ ```