@mapgis/webclient-mapboxgl-plugin 17.0.6 → 17.2.0

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.
Files changed (48) hide show
  1. package/README.md +11 -35
  2. package/dist/es5/webclient-common.min.js +15 -4
  3. package/dist/es5/webclient-mapboxgl-plugin.min.js +1 -1
  4. package/dist/webclient-mapboxgl-plugin-es6.min.js +1 -1
  5. package/documention/MapViewMapboxgl.html +1233 -8
  6. package/documention/Popup.html +3 -3
  7. package/documention/Screenshot.html +0 -11
  8. package/documention/SketchEditorMapboxgl.html +31 -2
  9. package/documention/index.html +4 -4
  10. package/documention/scripts/sideBar.js +16 -2
  11. package/package.json +3 -4
  12. package/documention/document_ArcGISVectorTileLayerView.js.html +0 -265
  13. package/documention/document_EchartsLayerView.js.html +0 -246
  14. package/documention/document_GraphicsLayerView.js.html +0 -314
  15. package/documention/document_IGSFeatureLayerView.js.html +0 -218
  16. package/documention/document_IGSMapImageLayerView.js.html +0 -240
  17. package/documention/document_IGSTileLayerView.js.html +0 -236
  18. package/documention/document_IGSVectorTileLayerView.js.html +0 -264
  19. package/documention/document_MapVLayerView.js.html +0 -247
  20. package/documention/document_WMSLayerView.js.html +0 -240
  21. package/documention/document_WMTSLayerView.js.html +0 -234
  22. package/documention/document_WebTileLayerView.js.html +0 -240
  23. package/documention/document_support_FeatureRenderView.js.html +0 -682
  24. package/documention/document_support_MapboxglGraphicsLayer.js.html +0 -1184
  25. package/documention/document_support_SourceMetaData.js.html +0 -223
  26. package/documention/document_support_Utils.js.html +0 -624
  27. package/documention/document_support_mapbox_mapboxCustomUtil.js.html +0 -322
  28. package/documention/sketchEditor_SketchEditorMapboxgl.js.html +0 -875
  29. package/documention/util_ConvertRendererToStyleLayerUtil.js.html +0 -844
  30. package/documention/util_MapboxglFeatureRender.js.html +0 -225
  31. package/documention/util_MapboxglPlugin.js.html +0 -284
  32. package/documention/view_MapViewMapboxgl.js.html +0 -1882
  33. package/documention/view_utils_ArcGISVectorTileLayerUtil.js.html +0 -382
  34. package/documention/view_utils_EchartsLayerUtil.js.html +0 -194
  35. package/documention/view_utils_IGSMapImageUtil.js.html +0 -373
  36. package/documention/view_utils_IGSTileLayerUtil.js.html +0 -285
  37. package/documention/view_utils_IGSVectorTileLayerUtil.js.html +0 -379
  38. package/documention/view_utils_MapVLayerUtil.js.html +0 -197
  39. package/documention/view_utils_Popup.js.html +0 -525
  40. package/documention/view_utils_Screenshot.js.html +0 -320
  41. package/documention/view_utils_WMSLayerUtil.js.html +0 -337
  42. package/documention/view_utils_WMTSLayerUtil.js.html +0 -331
  43. package/documention/view_utils_WebTileLayerUtil.js.html +0 -284
  44. package/documention/view_utils_echarts_EchartsLayerPlugin.js.html +0 -419
  45. package/documention/view_utils_mapV_MapVLayerPlugin.js.html +0 -527
  46. package/documention/view_utils_mapV_MapvBaseLayer.js.html +0 -477
  47. package/documention/view_utils_support_rasterLayerUtil.js.html +0 -244
  48. package/documention/view_utils_support_vectorLayerUtil.js.html +0 -503
package/documention/sketchEditor_SketchEditorMapboxgl.js.html DELETED
@@ -1,875 +0,0 @@
1
-
2
-
3
- <!DOCTYPE html>
4
- <html lang="en">
5
-
6
- <head>
7
-
8
- <meta charset="utf-8">
9
- <meta name="viewport" content="width=device-width, initial-scale=1">
10
- <title>Client for JavaScript sketchEditor/SketchEditorMapboxgl.js</title>
11
- <!--[if lt IE 9]>
12
- <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
13
- <![endif]-->
14
- <link type="text/css" rel="stylesheet" href="styles/app.min.css">
15
- <link type="text/css" rel="stylesheet" href="styles/iframe.css">
16
- <link type="text/css" rel="stylesheet" href="">
17
-
18
-
19
- </head>
20
-
21
-
22
-
23
- <body class="layout small-header">
24
- <div id="stickyNavbarOverlay"></div>
25
-
26
-
27
- <div class="top-nav">
28
- <div class="inner">
29
- <a id="hamburger" role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
30
- <span aria-hidden="true"></span>
31
- <span aria-hidden="true"></span>
32
- <span aria-hidden="true"></span>
33
- </a>
34
- <div class="logo">
35
-
36
- <h1> MapGIS Client for JavaScript API</h1>
37
-
38
-
39
- </div>
40
- <div class="menu">
41
-
42
- <div class="navigation">
43
-
44
-
45
- <a
46
- class="link user-link "
47
- href="/static/modules/common/api/common-mapgis/index.html"
48
- >
49
- Common
50
- </a>
51
-
52
- <a
53
- class="link user-link "
54
- href="/static/modules/cesium/api/cesium-mapgis/index.html"
55
- >
56
- Cesium
57
- </a>
58
-
59
- <a
60
- class="link user-link "
61
- href="/static/modules/mapboxgl/api/mapboxgl-mapgis/index.html"
62
- >
63
- MapboxGL
64
- </a>
65
-
66
- <a
67
- class="link user-link "
68
- href="/static/modules/leaflet/api/leaflet-mapgis/index.html"
69
- >
70
- Leaflet
71
- </a>
72
-
73
- <a
74
- class="link user-link "
75
- href="/static/modules/openlayers/api/openLayers-mapgis/index.html"
76
- >
77
- OpenLayers
78
- </a>
79
-
80
-
81
-
82
- </div>
83
- </div>
84
- </div>
85
- </div>
86
-
87
- <div id="main">
88
- <div
89
- class="sidebar "
90
- id="sidebarNav"
91
- >
92
- <div>
93
- <span class="mapgis-api-document-span"><a href="index.html">API文档</a></span>
94
- </div>
95
-
96
- <div class="search-wrapper">
97
- <input id="search" type="text" placeholder="搜索文档..." class="input">
98
- </div>
99
-
100
- <nav>
101
-
102
- <div class="category"><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">undefined</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Popup.html">Popup</a><span style="display: none;"><p>二维场景信息弹窗(leaflet引擎)
103
- 参考示例：
104
- <a href='#MapView'>[初始化二维场景视图]</a>
105
- [ES6引入方式]：<br/>
106
- import { Popup } from '@mapgis/webclient-leaflet-plugin' <br/>
107
- 自定义样式说明：<br/>
108
- zondy-popup__content 弹窗容器样式<br/>
109
- zondy-popup__tip 弹窗对话框箭头样式<br/>
110
- zondy-popup__header 弹窗头部样式<br/>
111
- zondy-popup__content 弹窗主体样式<br/>
112
- zondy-popup__footer 弹窗底部样式<br/></p></span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">undefined</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Screenshot.html">Screenshot</a><span style="display: none;"><p>打印工具</p></span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">草图编辑模块</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SketchEditorMapboxgl.html">SketchEditorMapboxgl</a><span style="display: none;"><p>二维场景草图编辑类<br/>
113
- <br>[ES5引入方式]：<br/>
114
- const { SketchEditorMapboxgl } = Zondy <br/>
115
- [ES6引入方式]：<br/>
116
- import { SketchEditorMapboxgl } from &quot;@mapgis/webclient-leaflet-plugin&quot; <br/></p></span></li></ul></div>
117
-
118
- </nav>
119
- </div>
120
- <div class="core" id="main-content-wrapper">
121
- <div class="content">
122
- <header id="page-title" class="page-title">
123
- <span class="page-title-main">类名</span>
124
- <span class="page-title-sub">sketchEditor/SketchEditorMapboxgl.js</span>
125
- </header>
126
-
127
-
128
-
129
-
130
-
131
- <section>
132
- <article>
133
- <pre class="prettyprint source linenums"><code>import {
134
- Zondy,
135
- SketchEditor,
136
- defaultValue,
137
- SketchStyle,
138
- ViewEventType,
139
- SketchEditMode,
140
- SketchEditorEventType,
141
- SketchEditorState,
142
- SketchEditorEvent
143
- } from '@mapgis/webclient-common'
144
- /**
145
- * 二维场景草图编辑类&lt;br/>
146
- * &lt;br>[ES5引入方式]：&lt;br/>
147
- * const { SketchEditorMapboxgl } = Zondy &lt;br/>
148
- * [ES6引入方式]：&lt;br/>
149
- * import { SketchEditorMapboxgl } from "@mapgis/webclient-leaflet-plugin" &lt;br/>
150
- * @classdesc 二维草图编辑类
151
- * @class SketchEditorMapboxgl
152
- * @extends SketchEditor
153
- * @moduleEX SketchEditorModule
154
- * @fires SketchEditor#草图绘制完成事件
155
- * @fires SketchEditor#草图被选中事件
156
- * @param {Object} options 构造参数
157
- * @param {MapView|SceneView} [options.view] 地图视图对象
158
- * @param {GraphicsLayer} [options.layer] 草图图层管对象
159
- * @param {SketchStyle} [options.sketchStyle] 草图符号
160
- * @param {Object} [options.snapOption] 草图捕获配置项
161
- *
162
- * @summary &lt;h5>支持如下方法：&lt;/h5>
163
- * &lt;a href='#start'>[1、开始绘制草图]&lt;/a>&lt;br/>
164
- * &lt;a href='#stop'>[2、停止绘制]&lt;/a>&lt;br/>
165
- * &lt;a href='#remove'>[3、移除当前草图]&lt;/a>&lt;br/>
166
- * &lt;a href='#addVertex'>[4、向草线或面草图中插入新的顶点]&lt;/a>&lt;br/>
167
- * &lt;a href='#updateVertex'>[5、更新草图图形的某个顶点]&lt;/a>&lt;br/>
168
- * &lt;a href='#removeVertex'>[6、移除草图图形的某个顶点]&lt;/a>&lt;br/>
169
- * &lt;a href='#getSketchDataType'>[7、获取草图图形类型]&lt;/a>&lt;br/>
170
- * &lt;a href='#setSketchStyle'>[8、设置草图样式]&lt;/a>&lt;br/>
171
- * &lt;a href='#getSketchStyle'>[9、获取草图样式]&lt;/a>&lt;br/>
172
- * &lt;a href='#getGeometry'>[10、获取草图几何对象]&lt;/a>&lt;br/>
173
- * &lt;a href='#union'>[11、合并多个区几何]&lt;/a>&lt;br/>
174
- * &lt;a href='#split'>[12、分割草图对象或区几何对象]&lt;/a>&lt;br/>
175
- * &lt;a href='#undo'>[13、撤销当前编辑操作]&lt;/a>&lt;br/>
176
- * &lt;a href='#redo'>[14、恢复被撤销的草图]&lt;/a>&lt;br/>
177
- * &lt;a href='#drawPolylineToPolygon'>[15、拓扑线造区]&lt;/a>&lt;br/>
178
- *
179
- * @example &lt;caption>&lt;h7>初始化一个二维场景草图编辑类&lt;/h7>&lt;/caption>
180
- * // [ES5引入方式]：
181
- * const { SketchEditorMapboxgl } = Zondy
182
- * [ES6引入方式]：
183
- * import { MapView, SketchEditorMapboxgl } from "@mapgis/webclient-leaflet-plugin" &lt;br/>
184
- * import { SketchStyle, SimpleMarkerSymbol, Color, SketchDataType} from "@mapgis/webclient-common" &lt;br/>
185
- * var map = new Map()
186
- * var mapView = new MapView({
187
- * viewId: "mapgis-2d-viewer",
188
- * map: map,
189
- * })
190
- * var simpleMarkerSymbol = new SimpleMarkerSymbol({
191
- * color: new Color(24, 144, 255, 1),
192
- * size: 10,
193
- * });
194
- * var sketchStyle = new SketchStyle({
195
- * vertexStyle: simpleMarkerSymbol,
196
- * lineStyle: undefined,
197
- * fillStyle: undefined
198
- * })
199
- * var SketchEditorMapboxgl = new SketchEditorMapboxgl({
200
- * view: mapView,
201
- * layer: new GraphicsLayer(),
202
- * vertexStyle: vertexStyle
203
- * })
204
- * SketchEditorMapboxgl.start(SketchDataType.POINT) // 绘制点
205
- * SketchEditorMapboxgl.start(SketchDataType.POLYLINE) // 绘制线
206
- * SketchEditorMapboxgl.start(SketchDataType.POLYGON) // 绘制区
207
- * * */
208
- class SketchEditorMapboxgl extends SketchEditor {
209
- constructor(options) {
210
- super(options)
211
- }
212
-
213
- /**
214
- * 开始绘制草图&lt;a id='start'>&lt;/a>
215
- * @param {SketchDataType} dataType 草图编辑类型
216
- * @example &lt;caption>&lt;h7>初始化一个二维场景草图编辑类&lt;/h7>&lt;/caption>
217
- * // [ES5引入方式]：
218
- * const { SketchEditorMapboxgl } = Zondy
219
- * [ES6引入方式]：
220
- * import { MapView, SketchEditorMapboxgl } from "@mapgis/webclient-leaflet-plugin" &lt;br/>
221
- * import { SketchStyle, SimpleMarkerSymbol, Color, SketchDataType} from "@mapgis/webclient-common" &lt;br/>
222
- * var map = new Map()
223
- * var mapView = new MapView({
224
- * viewId: "mapgis-2d-viewer",
225
- * map: map,
226
- * })
227
- * var simpleMarkerSymbol = new SimpleMarkerSymbol({
228
- * color: new Color(24, 144, 255, 1),
229
- * size: 10,
230
- * });
231
- * var sketchStyle = new SketchStyle({
232
- * vertexStyle: simpleMarkerSymbol,
233
- * lineStyle: undefined,
234
- * fillStyle: undefined
235
- * })
236
- * var SketchEditorMapboxgl = new SketchEditorMapboxgl({
237
- * view: mapView,
238
- * layer: new GraphicsLayer(),
239
- * vertexStyle: vertexStyle
240
- * })
241
- * SketchEditorMapboxgl.start(SketchDataType.POINT) // 绘制点
242
- * SketchEditorMapboxgl.start(SketchDataType.POLYLINE) // 绘制线
243
- * SketchEditorMapboxgl.start(SketchDataType.POLYGON) // 绘制区
244
- */
245
- start(dataType, extentOptions) {
246
- super.start(dataType, extentOptions)
247
- }
248
-
249
- /**
250
- * 开始绘制草图&lt;a id='start'>&lt;/a>
251
- * @param {SketchDataType} dataType 草图编辑类型
252
- * @example &lt;caption>&lt;h7>初始化一个二维场景草图编辑类&lt;/h7>&lt;/caption>
253
- * // [ES5引入方式]：
254
- * const { SketchEditorMapboxgl } = Zondy
255
- * [ES6引入方式]：
256
- * import { MapView, SketchEditorMapboxgl } from "@mapgis/webclient-leaflet-plugin" &lt;br/>
257
- * import { SketchStyle, SimpleMarkerSymbol, Color, SketchDataType} from "@mapgis/webclient-common" &lt;br/>
258
- * import SketchEllipseDrawTool from "./SketchEllipseDrawTool" &lt;br/>
259
- * var map = new Map()
260
- * var mapView = new MapView({
261
- * viewId: "mapgis-2d-viewer",
262
- * map: map,
263
- * })
264
- * var simpleMarkerSymbol = new SimpleMarkerSymbol({
265
- * color: new Color(24, 144, 255, 1),
266
- * size: 10,
267
- * });
268
- * var sketchStyle = new SketchStyle({
269
- * vertexStyle: simpleMarkerSymbol,
270
- * lineStyle: undefined,
271
- * fillStyle: undefined
272
- * })
273
- * var sketchEditorMapboxgl = new SketchEditorMapboxgl({
274
- * view: mapView,
275
- * layer: new GraphicsLayer(),
276
- * vertexStyle: vertexStyle
277
- * })
278
- * sketchEditorMapboxgl.startCustomDrawTool(SketchEllipseDrawTool, "ellipse") // 绘制椭圆
279
- */
280
- startCustomDrawTool(dataType) {
281
- super.startCustomDrawTool(dataType)
282
- }
283
-
284
- /**
285
- * 停止绘制&lt;a id='stop'>&lt;/a>
286
- */
287
- stop() {
288
- super.stop()
289
- }
290
-
291
- /**
292
- * 移除当前草图&lt;a id='remove'>&lt;/a>
293
- */
294
- remove() {
295
- super.remove()
296
- }
297
-
298
- /**
299
- * 更新当前选中的草图
300
- * @private
301
- */
302
- update(data, featureId) {
303
- super.updateFeature(data, featureId)
304
- }
305
-
306
- /**
307
- * 向当前线或区草图中插入新的顶点&lt;a id='addVertex'>&lt;/a>
308
- * @param {Point} point 新增/插入顶点
309
- * @param {Number} index 新增/新增点的序号
310
- */
311
- addVertex(point, index) {
312
- super.addVertex(point, index)
313
- }
314
-
315
- /**
316
- * 更新当前草图图形的某个顶点&lt;a id='updateVertex'>&lt;/a>
317
- * @param {Point} point 新的顶点
318
- * @param {Number} index 需更新的顶点的序号
319
- */
320
- updateVertex(point, index) {
321
- super.updateVertex(point, index)
322
- }
323
-
324
- /**
325
- * 移除草图图形的某个顶点&lt;a id='removeVertex'>&lt;/a>
326
- * @param {Number} index 需更新的顶点的序号
327
- */
328
- removeVertex(index) {
329
- super.removeVertex(index)
330
- }
331
-
332
- /**
333
- * 获取草图图形类型&lt;a id='getSketchDataType'>&lt;/a>
334
- * @private
335
- */
336
- getSketchDataType() {
337
- super.getSketchDataType()
338
- }
339
-
340
- /**
341
- * 设置草图样式&lt;a id='setSketchStyle'>&lt;/a>
342
- * @param {SketchStyle} sketchStyle
343
- * @example
344
- * // ES5引入方式
345
- * const { SimpleMarkerSymbol, SimpleFillSymbol, SimpleLineSymbol } = Zondy.Symbol
346
- * const { Map, MapView, Color, SketchStyle, SketchEditorMapboxgl } = Zondy
347
- * const { SketchDataType } = Zondy.Enum
348
- * // ES6引入方式
349
- * import { Map, SimpleMarkerSymbol, SimpleFillSymbol, SimpleLineSymbol, Color, SketchStyle, SketchDataType } from "@mapgis/webclient-common"
350
- * import { MapView, SketchEditorMapboxgl } from "@mapgis/webclient-leaflet-plugin" &lt;br/>
351
- * var map = new Map()
352
- * var mapView = new MapView({
353
- * viewId: "mapgis-2d-viewer",
354
- * map: map,
355
- * })
356
- * // 新建一个填充样式
357
- * var fillStyle = new SimpleFillSymbol({
358
- * color: new Color(0, 255, 255, 1),
359
- * outline: new SimpleLineSymbol({
360
- * color: new Color(255, 0, 0, 1),
361
- * width: 2
362
- * })
363
- * })
364
- * // 新建一个草图样式
365
- * var sketchStyle = new SketchStyle({
366
- * vertexStyle: new SimpleMarkerSymbol({
367
- * color: new Color(0, 255, 255, 1),
368
- * size: 10,
369
- * outline: new SimpleLineSymbol({
370
- * color: new Color(255, 255, 255, 1),
371
- * width: 3
372
- * })
373
- * }),
374
- * lineStyle: new SimpleLineSymbol({
375
- * color: new Color(0, 255, 255, 0.8),
376
- * width: 3
377
- * }),
378
- * fillStyle: new SimpleFillSymbol({
379
- * color: new Color(0, 255, 255, 0.5),
380
- * outline: new SimpleLineSymbol({
381
- * color: new Color(0, 255, 255, 0.8),
382
- * width: 2
383
- * })
384
- * }),
385
- * selectBoxStyle: new SimpleFillSymbol({
386
- * color: new Color(122, 22, 255, 0.5),
387
- * outline: new SimpleLineSymbol({
388
- * color: new Color(122, 22, 255, 0.8),
389
- * width: 1
390
- * })
391
- * }),
392
- * selectVertexStyle: new SimpleMarkerSymbol({
393
- * color: new Color(122, 22, 255, 1),
394
- * size: 12,
395
- * outline: new SimpleLineSymbol({
396
- * color: new Color(255, 255, 255, 1),
397
- * width: 1
398
- * })
399
- * }),
400
- * selectVertexStyle: new SimpleMarkerSymbol({
401
- * color: new Color(0, 188, 0, 1),
402
- * size: 11,
403
- * outline: new SimpleLineSymbol({
404
- * color: new Color(255, 255, 255, 1),
405
- * width: 1
406
- * })
407
- * }),
408
- * selectMidVertexStyle: new SimpleMarkerSymbol({
409
- * color: new Color(0, 0, 255, 1),
410
- * size: 8,
411
- * outline: new SimpleLineSymbol({
412
- * color: new Color(255, 255, 255, 1),
413
- * width: 1
414
- * })
415
- * })
416
- * })
417
- * var sketchEditor = new SketchEditorMapboxgl({
418
- * view: mapView,
419
- * layer: graphicsLayer,
420
- * })
421
- * sketchEditor.setSketchStyle(sketchStyle)
422
- * sketchEditor.start(SketchDataType.POLYGON)
423
- */
424
- setSketchStyle(sketchStyle) {
425
- super.setSketchStyle(sketchStyle)
426
- }
427
-
428
- /**
429
- * 获取草图样式&lt;a id='getSketchStyle'>&lt;/a>
430
- * @returns {SketchStyle}
431
- */
432
- getSketchStyle() {
433
- return super.getSketchStyle()
434
- }
435
-
436
- /**
437
- * 获取草图几何对象&lt;a id='getGeometry'>&lt;/a>
438
- * @returns {Geometry}
439
- */
440
- getGeometry() {
441
- return super.getGeometry()
442
- }
443
-
444
- /**
445
- * 合并多个区几何&lt;a id='union'>&lt;/a>
446
- * @param {Polygon} polygons 被合并的区几何对象
447
- * @returns {Polygon} 合并后的几何对象
448
- * @example &lt;caption>&lt;h7>二维草图几何合并&lt;/h7>&lt;/caption>
449
- * // [ES5引入方式]：
450
- * const { MapView, SketchEditorMapboxgl, polygon } = Zondy
451
- * [ES6引入方式]：
452
- * import { MapView, SketchEditorMapboxgl } from "@mapgis/webclient-leaflet-plugin" &lt;br/>
453
- * import { polygon } from "@mapgis/webclient-common" &lt;br/>
454
- * var map = new Map()
455
- * var mapView = new MapView({
456
- * viewId: "mapgis-2d-viewer",
457
- * map: map,
458
- * })
459
- * var SketchEditorMapboxgl = new SketchEditorMapboxgl({
460
- * view: mapView,
461
- * layer: new GraphicsLayer()
462
- * })
463
- * const polygon = new Polygon({
464
- * coordinates: [
465
- * [
466
- * [0, -60],
467
- * [0, 60],
468
- * [160, 60],
469
- * [160, -60],
470
- * [0, -60]
471
- * ]
472
- * ]
473
- * })
474
- * const polygon1 = new Polygon({
475
- * coordinates: [
476
- * [
477
- * [10, -60],
478
- * [10, 60],
479
- * [170, 60],
480
- * [170, -60],
481
- * [10, -60]
482
- * ]
483
- * ]
484
- * })
485
- * const polygons = [polygon,polygon1]
486
- * SketchEditorMapboxgl.union(polygons)
487
- */
488
- union(polygons) {
489
- return super.union(polygons)
490
- }
491
-
492
- /**
493
- * 分割草图对象或区几何对象&lt;a id='split'>&lt;/a>
494
- * @param {Polygon|SketchEditor} target 被分割的几何/草图对象
495
- * @param {Polyline} splitPolyline 线几何对象
496
- * @returns {Array&lt;Polygon>} 分割后的几何对象
497
- * @example &lt;caption>&lt;h7>二维草图几何分割&lt;/h7>&lt;/caption>
498
- * // [ES5引入方式]：
499
- * const { MapView, SketchEditorMapboxgl, Polygon, LineString } = Zondy
500
- * [ES6引入方式]：
501
- * import { MapView, SketchEditorMapboxgl } from "@mapgis/webclient-leaflet-plugin" &lt;br/>
502
- * import { Polygon, LineString } from "@mapgis/webclient-common" &lt;br/>
503
- * var map = new Map()
504
- * var mapView = new MapView({
505
- * viewId: "mapgis-2d-viewer",
506
- * map: map,
507
- * })
508
- * var SketchEditorMapboxgl = new SketchEditorMapboxgl({
509
- * view: mapView,
510
- * layer: new GraphicsLayer()
511
- * })
512
- * const polygon = new Polygon({
513
- * coordinates: [
514
- * [
515
- * [108, 29],
516
- * [116, 29],
517
- * [116, 33],
518
- * [108, 33],
519
- * [108, 29]
520
- * ]
521
- * ]
522
- * })
523
- * const polyline = new LineString({
524
- * coordinates: [
525
- * [100, 30],
526
- * [120, 30]
527
- * ]
528
- * })
529
- * const newSketchEditors = SketchEditorMapboxgl.split(polygon,polyline)
530
- */
531
- split(target, splitPolyline) {
532
- return super.split(target, splitPolyline)
533
- }
534
-
535
- /**
536
- * 线拓扑造区&lt;a id='drawPolylineToPolygon'>&lt;/a>
537
- * @param {Array&lt;Polygon>} snapAndReferGeometries 捕获参考几何对象数组
538
- * @example &lt;caption>&lt;h7>二维草图线拓扑造区&lt;/h7>&lt;/caption>
539
- * // [ES5引入方式]：
540
- * const { MapView, SketchEditorMapboxgl, Polygon, LineString } = Zondy
541
- * [ES6引入方式]：
542
- * import { MapView, SketchEditorMapboxgl } from "@mapgis/webclient-leaflet-plugin" &lt;br/>
543
- * import { Polygon, LineString } from "@mapgis/webclient-common" &lt;br/>
544
- * var map = new Map()
545
- * var mapView = new MapView({
546
- * viewId: "mapgis-2d-viewer",
547
- * map: map,
548
- * })
549
- * var testGeometries = [
550
- * new Polygon({
551
- * coordinates: [
552
- * [
553
- * [114.0, 29.0],
554
- * [117.0, 29.0],
555
- * [117.0, 35.0],
556
- * [114.0, 35.0],
557
- * [114.0, 29.0]
558
- * ]
559
- * ]
560
- * }),
561
- * new Polygon({
562
- * coordinates: [
563
- * [
564
- * [113.0, 29.0],
565
- * [116.0, 29.0],
566
- * [116.0, 35.0],
567
- * [113.0, 35.0],
568
- * [113.0, 29.0]
569
- * ]
570
- * ]
571
- * })
572
- * ]
573
- * testFeatures = [
574
- * new Feature({
575
- * id: '11114',
576
- * geometry: this.testGeometries[0],
577
- * symbol: new SimpleFillSymbol({
578
- * color: new Color(0, 255, 255, 0.5),
579
- * outline: new SimpleLineSymbol({
580
- * color: new Color(0, 255, 255, 0.8),
581
- * width: 2
582
- * })
583
- * })
584
- * }),
585
- * new Feature({
586
- * id: '11115',
587
- * geometry: this.testGeometries[1],
588
- * symbol: new SimpleFillSymbol({
589
- * color: new Color(0, 255, 255, 0.5),
590
- * outline: new SimpleLineSymbol({
591
- * color: new Color(0, 255, 255, 0.8),
592
- * width: 2
593
- * })
594
- * })
595
- * }),
596
- * ]
597
- * var testLayer = new GraphicsLayer({
598
- * graphics: this.testFeatures
599
- * })
600
- * map.add(testLayer)
601
- * var sketchEditorMapboxgl = new SketchEditorMapboxgl({
602
- * view: mapView,
603
- * layer: new GraphicsLayer()
604
- * })
605
- * sketchEditorMapboxgl.drawPolylineToPolygon(testGeometries)
606
- */
607
- drawPolylineToPolygon(snapAndReferGeometries) {
608
- super.drawPolylineToPolygon(snapAndReferGeometries)
609
- }
610
-
611
- /**
612
- * 撤销当前编辑操作&lt;a id='undo'>&lt;/a>
613
- * @returns {Geometry}
614
- * @example &lt;caption>&lt;h7>二维草图几何分割&lt;/h7>&lt;/caption>
615
- * // [ES5引入方式]：
616
- * const { MapView, SketchEditorMapboxgl, Polygon, LineString, SketchDataType } = Zondy
617
- * [ES6引入方式]：
618
- * import { MapView, SketchEditorMapboxgl } from "@mapgis/webclient-leaflet-plugin" &lt;br/>
619
- * import { Polygon, LineString, SketchDataType } from "@mapgis/webclient-common" &lt;br/>
620
- * var map = new Map()
621
- * var mapView = new MapView({
622
- * viewId: "mapgis-2d-viewer",
623
- * map: map,
624
- * })
625
- * var SketchEditorMapboxgl = new SketchEditorMapboxgl({
626
- * view: mapView,
627
- * layer: new GraphicsLayer()
628
- * })
629
- * SketchEditorMapboxgl.start(SketchDataType.POLYGON)
630
- * console.log("是否可以进行撤销操作：" + this.SketchEditorMapboxgl.canUndo())
631
- * const geometry = this.SketchEditorMapboxgl.undo()
632
- * console.log("恢复后的几何对象" + geometry)
633
- */
634
- undo() {
635
- return super.undo()
636
- }
637
-
638
- /**
639
- * 恢复被撤销的草图&lt;a id='redo'>&lt;/a>
640
- * @returns {Geometry}
641
- * @example &lt;caption>&lt;h7>二维草图几何分割&lt;/h7>&lt;/caption>
642
- * // [ES5引入方式]：
643
- * const { SketchEditorMapboxgl } = Zondy
644
- * [ES6引入方式]：
645
- * import { MapView, SketchEditorMapboxgl } from "@mapgis/webclient-leaflet-plugin" &lt;br/>
646
- * import { Polygon, LineString } from "@mapgis/webclient-common" &lt;br/>
647
- * var map = new Map()
648
- * var mapView = new MapView({
649
- * viewId: "mapgis-2d-viewer",
650
- * map: map,
651
- * })
652
- * var SketchEditorMapboxgl = new SketchEditorMapboxgl({
653
- * view: mapView,
654
- * layer: new GraphicsLayer()
655
- * })
656
- * SketchEditorMapboxgl.start(SketchDataType.POLYGON)
657
- * console.log("是否可以进行恢复操作：" + this.SketchEditorMapboxgl.canRedo())
658
- * const geometry = this.SketchEditorMapboxgl.redo()
659
- * console.log("恢复后的几何对象" + geometry)
660
- */
661
- redo() {
662
- return super.redo()
663
- }
664
-
665
- /**
666
- * 草图是否可执行撤销操作&lt;a id='canUndo'>&lt;/a>
667
- * @returns {Boolean}
668
- */
669
- canUndo() {
670
- return super.canUndo()
671
- }
672
-
673
- /**
674
- * 草图是否可执行恢复操作&lt;a id='canRedo'>&lt;/a>
675
- * @returns {Boolean}
676
- */
677
- canRedo() {
678
- return super.canRedo()
679
- }
680
-
681
- /**
682
- * 二维leaflet草图拾取事件
683
- * @private
684
- */
685
- _hitTestSketchEvent(layer = this._sketchInnerLayer) {
686
- // 实例化sketchEditor之后，将拾取事件注册
687
- const self = this
688
- const handler = (event) => {
689
- // 事件没有x，y坐标，则退出，不拾取草图图形
690
- if (!event || !event.x || !event.y) return
691
- // 当前草图编辑状态为正在绘制中，则退出，不拾取草图图形
692
- if (
693
- self._drawTool &amp;&amp;
694
- self._drawTool._editMode === SketchEditMode.DRAWING
695
- ) {
696
- return
697
- }
698
-
699
- let pickedFeature = undefined
700
- const hitTestFeatures = self.view.hitTest({
701
- x: event.x,
702
- y: event.y
703
- })
704
- if (hitTestFeatures &amp;&amp; Array.isArray(hitTestFeatures)) {
705
- pickedFeature = hitTestFeatures[0]
706
- }
707
- // 拾取时：情景1.（同一个图形）拾取到的当前图形featureId与编辑器草图本图featureId相同，则该草图进入整体图形编辑状态，编辑器drawTool不变
708
- // 情景2.（同一个图形）拾取到的当前图形featureId与辅助图featureId相同，则该草图进由整体图形编辑切换到顶点编辑状态，编辑器drawTool不变
709
- // 情景3.（切换到其他已绘制的图形时）拾取到的当前图形featureId与编辑器草图本图featureId以及辅助图featureId都不同，编辑器drawTool需变为当前featureId的drawTool
710
- if (pickedFeature &amp;&amp; layer.id === pickedFeature.layer.id) {
711
- let curDrawTool = self._drawTool
712
- ? self._drawTool._getDrawToolByFeatureId(pickedFeature.graphic.id)
713
- : undefined
714
- if (!curDrawTool) {
715
- if (
716
- !self._drawTool ||
717
- (self._drawTool.sketchStage.entityGraphic &amp;&amp;
718
- self._drawTool.state === 'drawn')
719
- ) {
720
- const layer = self.view.getLayer(pickedFeature.layer.id)
721
- // 1.根据featureId找到feature对象 2.清除上一次编辑器的辅助图形 3.根据feature对象构建drawTool加入到编辑器中，当前编辑器draw为新构建的drawTool
722
- const features = layer.graphics.filter((item) => {
723
- if (item.id === pickedFeature.graphic.id) {
724
- return item
725
- }
726
- })
727
- if (features &amp;&amp; features.items.length > 0) {
728
- // 情景3
729
- const feature = features.items[0]
730
- if (self._drawTool) {
731
- self._drawTool._clearEditGraphics(self._drawTool._editMode)
732
- }
733
- this._addFeatureToSketchEditor(feature)
734
- self._undoRedoManager.reset()
735
- self._drawTools = [self._drawTool]
736
- curDrawTool = self._drawTool
737
- } else {
738
- return
739
- }
740
- }
741
- }
742
- if (
743
- !curDrawTool ||
744
- (curDrawTool === self._drawTool &amp;&amp; curDrawTool.state !== 'drawn')
745
- ) {
746
- // 如果是绘制时触发的事件，则不是拾取 返回
747
- return
748
- }
749
- // self._bindHit(curDrawTool, event)'
750
- const mode = curDrawTool.editOption._hitTestMode
751
- if (mode === 0) {
752
- // 响应click拾取
753
- const hitTestHandler = () => {
754
- // 不可编辑状态直接返回
755
- if (!self._editable) {
756
- return
757
- }
758
- if (
759
- self._drawTool !== undefined &amp;&amp;
760
- self._drawTool !== null &amp;&amp;
761
- self._drawTool._editMode === 3
762
- ) {
763
- return
764
- }
765
- // 发送草图被选中事件
766
- if (self._drawTool !== undefined &amp;&amp; self._drawTool !== null) {
767
- self.fire(
768
- 'selected',
769
- {
770
- isSelected: true,
771
- selectedDrawTool: self._drawTool,
772
- selectedGeometry:
773
- self._drawTool.sketchStage.entityGraphic.geometry
774
- },
775
- self
776
- )
777
- }
778
- if (!curDrawTool._parent &amp;&amp; curDrawTool._editMode === 0) {
779
- const changedEvent = new SketchEditorEvent({
780
- type: SketchEditorEventType.update,
781
- target: self,
782
- toolEventInfo: null,
783
- state: SketchEditorState.start,
784
- feature: self._drawTool.sketchStage.entityGraphic,
785
- geometry: self._drawTool.sketchStage.entityGraphic.geometry
786
- })
787
- self.fire(SketchEditorEventType.update, changedEvent)
788
- }
789
-
790
- curDrawTool.hitTestFeature(
791
- curDrawTool.sketchStage.entityGraphic,
792
- event
793
- )
794
- self.view.off(ViewEventType.mouseUp, hitTestHandler)
795
- }
796
- self.view.on(ViewEventType.mouseUp, hitTestHandler)
797
- } else {
798
- if (!self._editable) {
799
- return
800
- }
801
- if (
802
- self._drawTool !== undefined &amp;&amp;
803
- self._drawTool !== null &amp;&amp;
804
- self._drawTool._editMode === 3
805
- ) {
806
- return
807
- }
808
- // 响应mousedown 拾取图形后平移
809
- curDrawTool.hitTestFeature(
810
- curDrawTool.sketchStage.entityGraphic,
811
- event
812
- )
813
- }
814
- }
815
- }
816
- this.view.on(ViewEventType.mouseDown, handler)
817
- }
818
-
819
- /**
820
- * 根据两个坐标获取坐标中点
821
- * @private
822
- * @param {Array} coordinate1 第一个坐标
823
- * @param {Array} coordinates2 第一个坐标
824
- * @returns {Array} 中点坐标
825
- * */
826
- _getCenterCoordinate(coordinate1, coordinates2) {
827
- return [
828
- (coordinate1[0] + coordinates2[0]) / 2,
829
- (coordinate1[1] + coordinates2[1]) / 2
830
- ]
831
- }
832
- }
833
- Zondy.SketchEditorMapboxgl = SketchEditorMapboxgl
834
- export default SketchEditorMapboxgl
835
- </code></pre>
836
- </article>
837
- </section>
838
-
839
-
840
-
841
-
842
- </div>
843
-
844
- <footer class="footer">
845
- <div class="content has-text-centered">
846
- <p>文档生成<a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.11</a></p>
847
- <p class="sidebar-created-by">
848
- <a href="http://www.smaryun.com" target="_blank">司马云</a> <span>© 2023 云生态圈</span>
849
- <a href="http://192.168.82.89:8086/#/index" target="_blank">MapGIS Client for JavaScript</a>
850
- </p>
851
- </div>
852
- </footer>
853
-
854
- </div>
855
- <div id="side-nav" class="side-nav">
856
- <div style="margin-bottom: 10px;">
857
- <img style="vertical-align: middle;margin-right: 10px;width: 30px;" src="./styles/anchor.png"/><a href="#page-title">构造函数</a>
858
- </div>
859
- <div style="margin-bottom: 10px;">
860
- <img style="vertical-align: middle;margin-right: 10px;width: 30px;" src="./styles/anchor.png"/><a href="#member">成员变量</a>
861
- </div>
862
- <div style="margin-bottom: 10px;">
863
- <img style="vertical-align: middle;margin-right: 10px;width: 30px;" src="./styles/anchor.png"/><a href="#function">方法</a>
864
- </div>
865
- <div>
866
- <img style="vertical-align: middle;margin-right: 10px;width: 30px;" src="./styles/anchor.png"/><a href="#event">事件</a>
867
- </div>
868
- </div>
869
- </div>
870
- <script src="scripts/linenumber.js"> </script>
871
-
872
- <script src="scripts/search.js"> </script>
873
-
874
- </body>
875
- </html>