map-ol-utils 0.1.27 → 0.1.29

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/dist/index.js CHANGED
@@ -58,25 +58,9 @@ import Map2 from "ol/Map";
58
58
  import View from "ol/View";
59
59
  import { defaults } from "ol/control";
60
60
 
61
- // src/layer-utils.ts
62
- import { GeoJSON } from "ol/format";
63
- import { Feature, Overlay } from "ol";
64
- import Cluster from "ol/source/Cluster";
65
- import { Select } from "ol/interaction";
66
- import CircleStyle from "ol/style/Circle";
61
+ // src/overlay.ts
67
62
  import gcoord from "gcoord";
68
- import VectorLayer from "ol/layer/Vector";
69
- import VectorSource from "ol/source/Vector";
70
- import { Point } from "ol/geom";
71
- import { singleClick } from "ol/events/condition";
72
- import { boundingExtent, getCenter } from "ol/extent";
73
- import {
74
- Icon,
75
- Text,
76
- Fill,
77
- Style,
78
- Stroke
79
- } from "ol/style";
63
+ import { Overlay } from "ol";
80
64
  var removeOverlays = (key = "") => {
81
65
  if (instance) {
82
66
  const overlays = instance.getOverlays().getArray().filter((overlay) => overlay.get(key || "position"));
@@ -102,6 +86,18 @@ var createAnimationMarker = (imgUrl, data) => {
102
86
  overlay.set("_isAnimationMarker", true);
103
87
  instance.addOverlay(overlay);
104
88
  };
89
+ var createOverlay = (config = { id: "popup-container", positioning: "top-center" }) => {
90
+ return new Overlay(
91
+ Object.assign(
92
+ {
93
+ element: document.getElementById(config.id) || void 0
94
+ },
95
+ config
96
+ )
97
+ );
98
+ };
99
+
100
+ // src/layer-manager.ts
105
101
  var resetActiveVector = () => {
106
102
  removeOverlays();
107
103
  const layers = instance.getAllLayers();
@@ -110,167 +106,6 @@ var resetActiveVector = () => {
110
106
  interaction == null ? void 0 : interaction.getFeatures().clear();
111
107
  });
112
108
  };
113
- var setFitViewByCoords = (coords, mapInstance = instance, fitOptions) => {
114
- const view = mapInstance.getView();
115
- if (coords.length === 1) {
116
- view.animate(__spreadValues({
117
- zoom: 14,
118
- duration: 1e3,
119
- center: coords[0]
120
- }, fitOptions || {}));
121
- } else {
122
- const extent = boundingExtent(coords);
123
- view.fit(extent, __spreadValues({
124
- padding: [50, 50, 50, 50],
125
- duration: 1e3
126
- }, fitOptions || {}));
127
- }
128
- };
129
- var setFitViewByGeom = (geom, mapInstance = instance, fitOptions) => {
130
- mapInstance.getView().fit(geom, __spreadValues({
131
- padding: [50, 50, 50, 50],
132
- duration: 1e3
133
- }, fitOptions || {}));
134
- };
135
- var setFitViewByLayer = (layer, mapInstance = instance, fitOptions) => {
136
- var _a;
137
- const extent = ((_a = layer.getSource()) == null ? void 0 : _a.getExtent()) || [];
138
- mapInstance.getView().fit(extent, __spreadValues({
139
- padding: [50, 50, 50, 50],
140
- duration: 1e3
141
- }, fitOptions || {}));
142
- };
143
- var assembleGeoJson = (dataList, config) => {
144
- const { key, crsForm } = config;
145
- const tempList = [];
146
- dataList.forEach((item) => {
147
- try {
148
- const pathArray = Array.isArray(item[key]) ? item[key] : JSON.parse(item[key] || "[]");
149
- if (pathArray.length) {
150
- const type = item["geoType"] || determineGeometryType(pathArray);
151
- if (type !== "Invalid" /* Invalid */) {
152
- tempList.push({
153
- type: "Feature",
154
- properties: __spreadValues({}, item),
155
- geometry: {
156
- type,
157
- coordinates: pathArray
158
- }
159
- });
160
- }
161
- }
162
- } catch (e) {
163
- console.error(`\u521B\u5EFA\u7EBF\u72B6\u6570\u636E\u5931\u8D25\uFF1A${e}`);
164
- }
165
- });
166
- return gcoord.transform(
167
- { type: "FeatureCollection", features: tempList },
168
- crsForm || gcoord.WGS84,
169
- gcoord.WGS84
170
- );
171
- };
172
- var createVectorStyle = (feature, config) => {
173
- const {
174
- isLine,
175
- colorMap,
176
- fillColor,
177
- colorKey,
178
- strokeColor,
179
- fillOpacity,
180
- strokeWeight,
181
- activeFillColor,
182
- activeFillOpacity,
183
- activeStrokeColor,
184
- activeStrokeWeight
185
- } = config || {};
186
- const data = feature.getProperties();
187
- const activeStyle = new Style({
188
- stroke: new Stroke({
189
- width: activeStrokeWeight || strokeWeight || 4,
190
- color: activeStrokeColor || (colorKey ? (colorMap == null ? void 0 : colorMap.get(data[colorKey])) || strokeColor : strokeColor)
191
- })
192
- });
193
- const unActiveStyle = new Style({
194
- stroke: new Stroke({
195
- width: strokeWeight || 2,
196
- color: colorKey ? (colorMap == null ? void 0 : colorMap.get(data[colorKey])) || strokeColor : strokeColor
197
- })
198
- });
199
- if (!isLine) {
200
- activeStyle.setFill(
201
- new Fill({
202
- color: hexToRgba(
203
- activeFillColor || fillColor || "",
204
- activeFillOpacity || 1
205
- ) || hexToRgba(
206
- (colorKey ? (colorMap == null ? void 0 : colorMap.get(data[colorKey])) || fillColor : fillColor) || "",
207
- fillOpacity || 1
208
- )
209
- })
210
- );
211
- unActiveStyle.setFill(
212
- new Fill({
213
- color: hexToRgba(
214
- (colorKey ? (colorMap == null ? void 0 : colorMap.get(data[colorKey])) || fillColor : fillColor) || "",
215
- fillOpacity || 1
216
- )
217
- })
218
- );
219
- }
220
- feature.setProperties(
221
- Object.assign(data, {
222
- activeStyle,
223
- unActiveStyle
224
- })
225
- );
226
- return unActiveStyle;
227
- };
228
- var createBusinessLayer = (dataList, config) => {
229
- const { isAutoFit, layerName, openClick } = config;
230
- const geoJson = assembleGeoJson(dataList, config);
231
- const vectorLayer = new VectorLayer({
232
- zIndex: 5,
233
- className: layerName ? layerName : "ol-layer",
234
- source: new VectorSource({
235
- features: new GeoJSON().readFeatures(geoJson).map((feature) => {
236
- feature.setStyle(createVectorStyle(feature, config));
237
- return feature;
238
- })
239
- })
240
- });
241
- if (openClick) {
242
- createSelectByLayer(vectorLayer);
243
- }
244
- vectorLayer.setProperties({
245
- _isCustom: true,
246
- _isAutoFit: isAutoFit,
247
- _isVectorLayer: true,
248
- _vectorConfig: config,
249
- _layerName: layerName,
250
- _dataList: [...dataList],
251
- _uuidSet: new Set(dataList.map((item) => item._uuid) || [])
252
- });
253
- return vectorLayer;
254
- };
255
- var appendFeaturesByLayer = (targetLayer, dataList, crsForm) => {
256
- const vectorSource = targetLayer.getSource();
257
- const tempSet = targetLayer.get("_uuidSet") || /* @__PURE__ */ new Set();
258
- dataList.forEach((item) => tempSet.add(item._uuid));
259
- targetLayer.set("_uuidSet", tempSet);
260
- const { _vectorConfig: config } = targetLayer.getProperties() || {};
261
- const geoJson = assembleGeoJson(
262
- dataList,
263
- Object.assign({}, config, { crsForm })
264
- );
265
- vectorSource.addFeatures(
266
- new GeoJSON().readFeatures(geoJson).map((feature) => {
267
- feature.setStyle(createVectorStyle(feature, config));
268
- return feature;
269
- })
270
- );
271
- };
272
- var createVectorFaceLayer = (dataList = [], config) => createBusinessLayer(dataList, Object.assign({}, config, { isLine: false }));
273
- var createVectorLineLayer = (dataList = [], config) => createBusinessLayer(dataList, Object.assign({}, config, { isLine: true }));
274
109
  var removeAllLayers = () => {
275
110
  removeOverlays();
276
111
  if (instance) {
@@ -333,707 +168,897 @@ var activeFeatureByUid = (uid) => {
333
168
  }
334
169
  }
335
170
  };
336
- var buildMassMarksStyles = (getImgUrlFn) => {
337
- return (iconConfig) => {
338
- const {
339
- baseUrl,
340
- markerIcon,
341
- statusNum = 5,
342
- activeScale = 1.3,
343
- markerSize = [32, 32]
344
- } = iconConfig;
345
- const getMarkerUrl = getImgUrlFn(baseUrl);
346
- const [x, y] = markerSize;
347
- const massMarksStyles = new Array(statusNum * 2);
348
- for (let i = 0; i < statusNum; i++) {
349
- const imageUrl = getMarkerUrl(`${markerIcon}-${i}`, ".webp");
350
- massMarksStyles[i] = new Style({
351
- zIndex: 88 + i,
352
- image: new Icon({
353
- width: x,
354
- height: y,
355
- src: imageUrl,
356
- anchor: [0.5, 1]
357
- })
358
- });
359
- const activeImage = getMarkerUrl(`${markerIcon}-${i}-active`, ".webp");
360
- massMarksStyles[i + statusNum] = new Style({
361
- zIndex: 120,
362
- image: new Icon({
363
- width: x * activeScale,
364
- height: y * activeScale,
365
- anchor: [0.5, 1],
366
- src: activeImage ? activeImage : imageUrl
367
- })
368
- });
171
+
172
+ // src/create-map.ts
173
+ import { defaults as interactionDefaults } from "ol/interaction";
174
+
175
+ // src/base-layer.ts
176
+ import { XYZ, WMTS } from "ol/source";
177
+ import { TileGrid } from "ol/tilegrid";
178
+ import { Tile } from "ol/layer";
179
+ import WMTSTileGrid from "ol/tilegrid/WMTS";
180
+
181
+ // src/constants.ts
182
+ var DEFAULT_TIANDITU_TK = "c77eddc667c5bed016fded560baf93e7";
183
+ var DEFAULT_ZHEJIANG_TOKEN = "3b0cdd02-c366-4363-b6de-081a9f12b364";
184
+
185
+ // src/base-layer.ts
186
+ var createBaseLayer = (layerName = "hzsyvector_dark") => {
187
+ const config = {
188
+ zIndex: -5,
189
+ preload: 1,
190
+ minZoom: 8,
191
+ maxZoom: 21,
192
+ source: new XYZ({
193
+ tileGrid: new TileGrid({
194
+ tileSize: 256,
195
+ resolutions: [
196
+ 0.00549933137253187,
197
+ 0.00274966568626595,
198
+ 0.00137483284313297,
199
+ 687416421566485e-18,
200
+ 343708210783242e-18,
201
+ 171854105391621e-18,
202
+ 859270526958104e-19,
203
+ 429635263479052e-19,
204
+ 214817631739526e-19,
205
+ 107408815869763e-19,
206
+ 537044079348816e-20,
207
+ 268522039674407e-20,
208
+ 134261019837204e-20
209
+ ],
210
+ origin: [118.122911693886, 31.2869311022836],
211
+ extent: [
212
+ 116.43263049006,
213
+ 28.6201742126026,
214
+ 123.705594256347,
215
+ 31.9765041681924
216
+ ]
217
+ }),
218
+ projection: "EPSG:4326",
219
+ urls: [
220
+ `https://cb.hangzhoumap.gov.cn/E36CCEA93443D1495DB9B9F2B2FFE348CB1A367D75176F815040AB19E54CDCA5DAAA25813AF965E2ABD0CC2463DD1223/PBS/rest/services/hzsyvector_dark/Mapserver/tile/${layerName}/{z}/{y}/{x}`
221
+ ]
222
+ }),
223
+ properties: {
224
+ _isBaseLayer: true,
225
+ _layerName: layerName
369
226
  }
370
- return massMarksStyles;
371
227
  };
228
+ return new Tile(config);
372
229
  };
373
- var selectEventHandle = (vectorLayer, feature) => {
374
- const data = feature.getProperties();
375
- const { activeStyle } = data;
376
- feature.setStyle(activeStyle);
377
- emitter_default.emit("selected-feature", data);
378
- vectorLayer.set("_hasActive", true);
379
- if (vectorLayer.get("_isDynamic")) {
380
- const activeImage = activeStyle.getImage();
381
- setTimeout(() => {
382
- emitter_default.emit(
383
- "dynamic-marker",
384
- Object.assign({}, data.rawData || {}, {
385
- lnglat: data.lnglat,
386
- style: data.style,
387
- crsForm: data.crsForm,
388
- width: activeImage.getWidth(),
389
- height: activeImage.getHeight()
390
- })
391
- );
392
- }, 1e3);
393
- }
394
- const isAutoFit = vectorLayer.get("_isAutoFit");
395
- if (isAutoFit) {
396
- const view = instance.getView();
397
- view.animate({
398
- duration: 1e3,
399
- zoom: view.getZoom(),
400
- center: getCenter(feature.getGeometry().getExtent())
401
- });
402
- }
230
+ var createMapWorldLayer = (layerName, tk = DEFAULT_TIANDITU_TK) => {
231
+ const [name, matrixSet] = layerName.split("_");
232
+ const config = {
233
+ preload: 1,
234
+ zIndex: -10,
235
+ cacheSize: 20240,
236
+ properties: {
237
+ _isBaseLayer: true,
238
+ _layerName: layerName
239
+ },
240
+ source: new WMTS({
241
+ crossOrigin: "anonymous",
242
+ projection: "EPSG:4326",
243
+ wrapX: true,
244
+ layer: name,
245
+ style: "default",
246
+ version: "1.0.0",
247
+ format: "image/png",
248
+ matrixSet,
249
+ tileGrid: new WMTSTileGrid({
250
+ tileSize: 256,
251
+ origin: [-180, 90],
252
+ matrixIds: [
253
+ "1",
254
+ "2",
255
+ "3",
256
+ "4",
257
+ "5",
258
+ "6",
259
+ "7",
260
+ "8",
261
+ "9",
262
+ "10",
263
+ "11",
264
+ "12",
265
+ "13",
266
+ "14",
267
+ "15",
268
+ "16",
269
+ "17",
270
+ "18",
271
+ "19"
272
+ ],
273
+ resolutions: [
274
+ 0.703125,
275
+ 0.3515625,
276
+ 0.17578125,
277
+ 0.087890625,
278
+ 0.0439453125,
279
+ 0.02197265625,
280
+ 0.010986328125,
281
+ 0.0054931640625,
282
+ 0.00274658203125,
283
+ 0.001373291015625,
284
+ 6866455078125e-16,
285
+ 34332275390625e-17,
286
+ 171661376953125e-18,
287
+ 858306884765625e-19,
288
+ 4291534423828125e-20,
289
+ 21457672119140625e-21,
290
+ 10728836059570312e-21,
291
+ 5364418029785156e-21,
292
+ 2682209014892578e-21
293
+ ]
294
+ }),
295
+ url: `https://t{0-7}.tianditu.gov.cn/${layerName}/wmts?tk=${tk}`
296
+ })
297
+ };
298
+ return new Tile(config);
403
299
  };
404
- var createSelectByLayer = (vectorLayer) => {
405
- const interaction = new Select({
406
- style: null,
407
- multi: false,
408
- hitTolerance: 10,
409
- layers: [vectorLayer],
410
- condition: (evt) => {
411
- let hasFeature = false;
412
- instance.forEachFeatureAtPixel(
413
- evt.pixel,
414
- () => {
415
- hasFeature = true;
416
- },
417
- {
418
- layerFilter: (layer) => layer === vectorLayer
419
- }
420
- );
421
- return singleClick(evt) && hasFeature;
422
- }
300
+ var createZheJiangLayer = (layerName = "emap", tk = DEFAULT_ZHEJIANG_TOKEN) => {
301
+ return new Tile({
302
+ preload: 1,
303
+ minZoom: 4,
304
+ maxZoom: 20,
305
+ zIndex: -10,
306
+ cacheSize: 20240,
307
+ source: new XYZ({
308
+ wrapX: true,
309
+ projection: "EPSG:4326",
310
+ crossOrigin: "anonymous",
311
+ url: `https://ditu{0-6}.zjzwfw.gov.cn/services/wmts/${layerName}/default/oss/getTile/{z}/{y}/{x}?token=${tk}`
312
+ })
423
313
  });
424
- interaction.on("select", (evt) => {
425
- const { selected, deselected } = evt;
426
- if (selected.length) {
427
- const feature = selected[0];
428
- const isClusterLayer = vectorLayer.get("_isClusterLayer");
429
- if (isClusterLayer) {
430
- const features = feature.get("features");
431
- if (features.length === 1) {
432
- selectEventHandle(vectorLayer, features[0]);
433
- }
434
- } else {
435
- selectEventHandle(vectorLayer, feature);
436
- }
437
- }
438
- if (deselected.length) {
439
- const feature = deselected[0];
440
- const data = feature.getProperties();
441
- feature.setStyle(data.unActiveStyle);
442
- vectorLayer.set("_hasActive", false);
314
+ };
315
+ var getLayerByName = (name) => instance.getAllLayers().find((item) => (item.get("_layerName") || item.getClassName()) === name);
316
+ var removeLayerByName = (name) => {
317
+ const layer = getLayerByName(name);
318
+ if (layer) {
319
+ const source = layer.getSource();
320
+ if (source && source.dispose) {
321
+ source.dispose();
443
322
  }
323
+ instance.removeLayer(layer);
324
+ layer.dispose();
325
+ }
326
+ };
327
+ var changeLayersByNames = (activeNames, allLayerNames) => {
328
+ const changeLayers = instance.getAllLayers().filter((item) => allLayerNames.includes(item.getClassName()));
329
+ changeLayers.forEach((layer) => {
330
+ layer.setVisible(activeNames == null ? void 0 : activeNames.includes(layer.getClassName()));
444
331
  });
445
- instance.addInteraction(interaction);
446
- vectorLayer.set("_selectInteraction", interaction);
447
- return interaction;
448
332
  };
449
- var createMassMarksLayer = (dataList, styleList = []) => {
450
- const features = dataList.map((item) => {
451
- const { crsForm } = item;
452
- const coord = gcoord.transform(
453
- [+item.lnglat[0], +item.lnglat[1]],
454
- crsForm || gcoord.WGS84,
455
- gcoord.WGS84
456
- );
457
- const feature = new Feature({
458
- geometry: new Point(coord)
459
- });
460
- feature.setProperties(__spreadProps(__spreadValues({}, item), {
461
- unActiveStyle: styleList[item.style],
462
- activeStyle: styleList[item.style + styleList.length / 2]
463
- }));
464
- feature.setStyle(styleList[item.style]);
465
- return feature;
333
+
334
+ // src/create-map.ts
335
+ var instance;
336
+ var mapCenter = [119.71512016971076, 30.122490541963536];
337
+ var createMapInstance = (config = {}) => {
338
+ if (instance) {
339
+ return instance;
340
+ }
341
+ instance = createMap(config);
342
+ return instance;
343
+ };
344
+ var createMap = (config = {}) => {
345
+ const innerConfig = Object.assign(
346
+ {
347
+ zoom: 9.4,
348
+ maxZoom: 18,
349
+ minZoom: 9.4,
350
+ center: mapCenter,
351
+ baseLayer: "vec-layer",
352
+ projection: "EPSG:4326",
353
+ layers: [createBaseLayer()],
354
+ constrainResolution: false,
355
+ smoothExtentConstraint: false,
356
+ tk: DEFAULT_TIANDITU_TK
357
+ },
358
+ config || {}
359
+ );
360
+ const map = new Map2({
361
+ view: new View(innerConfig),
362
+ controls: defaults({
363
+ zoom: false,
364
+ rotate: false,
365
+ attribution: false
366
+ }),
367
+ interactions: interactionDefaults({
368
+ pinchRotate: false,
369
+ doubleClickZoom: false,
370
+ altShiftDragRotate: false
371
+ }),
372
+ layers: innerConfig.layers || [createBaseLayer()]
466
373
  });
467
- const vectorLayer = new VectorLayer({
468
- zIndex: 2e3,
469
- source: new VectorSource({
470
- features
471
- })
374
+ mapCenter = innerConfig.center || mapCenter;
375
+ map.activeBaseLayer = innerConfig.baseLayer;
376
+ map.getLayerByName = getLayerByName;
377
+ map.removeLayerByName = removeLayerByName;
378
+ map.changeLayersByNames = changeLayersByNames;
379
+ map.on("pointermove", (evt) => {
380
+ map.getTargetElement().style.cursor = map.hasFeatureAtPixel(evt.pixel) ? "pointer" : "";
472
381
  });
473
- vectorLayer.setProperties({
474
- _isCustom: true,
475
- _isVectorLayer: true,
476
- _isMassMarksLayer: true,
477
- _statusNum: styleList.length / 2,
478
- _dataList: [...dataList],
479
- _uuidSet: new Set(dataList.map((item) => item._uuid) || [])
382
+ return map;
383
+ };
384
+ var disposeMap = () => {
385
+ instance.getOverlays().forEach((overlay) => {
386
+ instance.removeOverlay(overlay);
480
387
  });
481
- return vectorLayer;
388
+ instance.getInteractions().clear();
389
+ const layers = instance.getAllLayers();
390
+ layers.forEach((layer) => {
391
+ const source = layer.getSource();
392
+ if (source && source.dispose) {
393
+ source.dispose();
394
+ }
395
+ instance.removeLayer(layer);
396
+ layer.dispose();
397
+ });
398
+ instance.setTarget("");
399
+ instance.dispose();
400
+ instance = void 0;
482
401
  };
483
- var addMassMarksLayer = (getImgUrlFn) => {
484
- return (dataList = [], iconConfig, openClick = true) => {
485
- const {
486
- offset = [0, 0],
487
- baseUrl,
488
- hasLine,
489
- hasFace,
490
- layerName,
491
- isDynamic,
492
- isAutoFit,
493
- statusNum,
494
- markerIcon,
495
- marksStyles,
496
- markerSize,
497
- activeScale,
498
- vectorConfig
499
- } = iconConfig;
500
- const massMarksStyles = marksStyles ? marksStyles : buildMassMarksStyles(getImgUrlFn)({
501
- baseUrl,
502
- markerIcon,
503
- markerSize,
504
- statusNum: statusNum || 5,
505
- activeScale: activeScale || 1.3
402
+ var getMapInstance = () => instance;
403
+ var resetZoomAndCenter = (center = mapCenter) => {
404
+ if (instance) {
405
+ const view = instance.getView();
406
+ view.animate({
407
+ zoom: 9.4,
408
+ center,
409
+ duration: 1e3
506
410
  });
507
- const massMarksLayer = createMassMarksLayer(dataList, massMarksStyles);
508
- if (openClick) {
509
- massMarksLayer.setProperties({
510
- _offset: offset,
511
- _isAutoFit: isAutoFit
512
- });
513
- createSelectByLayer(massMarksLayer);
411
+ }
412
+ };
413
+ var resetMap = (config = { center: mapCenter, isClearAll: true }) => {
414
+ removeAllLayers();
415
+ resetZoomAndCenter(config.center || mapCenter);
416
+ };
417
+
418
+ // src/helper.ts
419
+ var hexToRgba = (hex, alpha) => {
420
+ if (hex.startsWith("#")) {
421
+ let tempHex = hex.replace("#", "");
422
+ if (tempHex.length === 3) {
423
+ tempHex = tempHex[0] + tempHex[0] + tempHex[1] + tempHex[1] + tempHex[2] + tempHex[2];
514
424
  }
515
- if (hasLine) {
516
- const vectorLayer = createBusinessLayer(
517
- dataList,
518
- Object.assign(
519
- {},
520
- {
521
- key: "line",
522
- isLine: true,
523
- openClick: false,
524
- strokeWeight: 4,
525
- strokeColor: "rgba(29, 235, 255, 0.8)"
526
- },
527
- vectorConfig || {}
528
- )
529
- );
530
- instance.addLayer(vectorLayer);
425
+ const r = parseInt(tempHex.substring(0, 2), 16);
426
+ const g = parseInt(tempHex.substring(2, 4), 16);
427
+ const b = parseInt(tempHex.substring(4, 6), 16);
428
+ return `rgba(${r}, ${g}, ${b}, ${alpha})`;
429
+ } else {
430
+ return hex;
431
+ }
432
+ };
433
+ var getLayersDataList = () => {
434
+ var _a;
435
+ return ((_a = instance) == null ? void 0 : _a.getAllLayers().map((layer) => layer.get("_dataList") || []).flat(2)) || [];
436
+ };
437
+ var determineGeometryType = (coordinates) => {
438
+ const getArrayDepth = (arr) => {
439
+ if (!Array.isArray(arr) || arr.length === 0) return 0;
440
+ return 1 + getArrayDepth(arr[0]);
441
+ };
442
+ const isClosedRing = (coords) => {
443
+ if (!Array.isArray(coords) || coords.length < 3) return false;
444
+ const first = coords[0];
445
+ const last = coords[coords.length - 1];
446
+ return first[0] === last[0] && first[1] === last[1];
447
+ };
448
+ const isValidCoordinate = (coord) => {
449
+ return Array.isArray(coord) && coord.length >= 2 && typeof coord[0] === "number" && typeof coord[1] === "number";
450
+ };
451
+ const isValidLineString = (coords) => {
452
+ return Array.isArray(coords) && coords.length >= 2 && coords.every(isValidCoordinate);
453
+ };
454
+ const isValidPolygon = (coords) => {
455
+ if (!Array.isArray(coords)) return false;
456
+ const rings = getArrayDepth(coords) === 2 ? [coords] : coords;
457
+ return rings.every(
458
+ (ring) => Array.isArray(ring) && ring.length >= 4 && isClosedRing(ring) && ring.every(isValidCoordinate)
459
+ );
460
+ };
461
+ const depth = getArrayDepth(coordinates);
462
+ try {
463
+ if (depth < 2 || !coordinates || coordinates.length === 0) {
464
+ return "Invalid" /* Invalid */;
465
+ } else if (depth === 2 && isValidLineString(coordinates)) {
466
+ return isClosedRing(coordinates) && coordinates.length >= 4 ? "Polygon" /* Polygon */ : "LineString" /* LineString */;
467
+ } else if (depth === 3 && Array.isArray(coordinates) && coordinates.every(isValidLineString)) {
468
+ if (isValidPolygon(coordinates)) {
469
+ return "Polygon" /* Polygon */;
470
+ } else if (coordinates.every((arr) => !isClosedRing(arr))) {
471
+ return "MultiLineString" /* MultiLineString */;
472
+ } else {
473
+ return "Invalid" /* Invalid */;
474
+ }
475
+ } else if (depth === 4 && Array.isArray(coordinates) && coordinates.every((rings) => isValidPolygon(rings))) {
476
+ return "MultiPolygon" /* MultiPolygon */;
477
+ } else {
478
+ return "Invalid" /* Invalid */;
531
479
  }
532
- if (hasFace) {
533
- const vectorLayer = createBusinessLayer(
534
- dataList,
535
- Object.assign(
536
- {},
537
- {
538
- isLine: false,
539
- key: "faceList",
540
- strokeWeight: 1,
541
- openClick: false,
542
- fillColor: "#4247DF",
543
- strokeStyle: "dashed",
544
- strokeColor: "#4247DF"
545
- },
546
- vectorConfig || {}
547
- )
548
- );
549
- instance.addLayer(vectorLayer);
480
+ } catch (error) {
481
+ console.error("Error analyzing coordinates:", error);
482
+ return "Invalid" /* Invalid */;
483
+ }
484
+ };
485
+
486
+ // src/ogc-utils.ts
487
+ import { WMTS as WMTS2 } from "ol/source";
488
+ import TileLayer from "ol/layer/Tile";
489
+ import { WMTSCapabilities } from "ol/format";
490
+ import { optionsFromCapabilities } from "ol/source/WMTS";
491
+ var parser = new WMTSCapabilities();
492
+ var capabilitiesMap = /* @__PURE__ */ new Map();
493
+ var getCapabilities = (url) => {
494
+ return new Promise((resolve) => {
495
+ const capabilities = capabilitiesMap.get(url);
496
+ if (capabilities) {
497
+ resolve(capabilities);
498
+ } else {
499
+ fetch(url).then((data) => data.text()).then((text) => {
500
+ const capabilities2 = parser.read(text);
501
+ capabilitiesMap.set(url, capabilities2);
502
+ resolve(capabilities2);
503
+ });
550
504
  }
551
- massMarksLayer.setProperties({
552
- _isCustom: true,
553
- _offset: offset,
554
- _hasLine: hasLine,
555
- _hasFace: hasFace,
556
- className: layerName,
557
- _layerName: layerName,
558
- _isVectorLayer: true,
559
- _isDynamic: isDynamic
560
- });
561
- instance.addLayer(massMarksLayer);
562
- return massMarksLayer;
563
- };
505
+ });
564
506
  };
565
- var updateMarksLayersByStatus = (checkedStatusList = []) => {
566
- const hideStyle = new Style({});
567
- const tempList = [];
568
- const targetLayers = instance.getAllLayers().filter((layer) => layer.get("_isMassMarksLayer"));
569
- targetLayers.forEach((layer) => {
570
- const features = layer.getSource().getFeatures();
571
- features.forEach((feature) => {
572
- const data = feature.getProperties();
573
- if (!checkedStatusList.includes(data.status)) {
574
- feature.setStyle(hideStyle);
507
+ var createWmtsLayer = (serverUrl) => (config) => __async(null, null, function* () {
508
+ const { style, format, version, layerName, matrixSet } = config;
509
+ const [workspace, datastore] = layerName.split(":");
510
+ const capabilitiesUrl = `${serverUrl}/${workspace}/${datastore}/gwc/service/wmts?request=GetCapabilities`;
511
+ return new Promise((resolve, reject) => {
512
+ getCapabilities(capabilitiesUrl).then((data) => {
513
+ const options = optionsFromCapabilities(data, {
514
+ Style: style || "",
515
+ layer: datastore,
516
+ version: version || "1.1.0",
517
+ format: format || "image/png",
518
+ matrixSet: matrixSet || "EPSG:4326"
519
+ });
520
+ if (options) {
521
+ resolve(
522
+ new TileLayer({
523
+ zIndex: 3,
524
+ className: layerName,
525
+ source: new WMTS2(options)
526
+ })
527
+ );
575
528
  } else {
576
- tempList.push(data);
577
- feature.setStyle(data.unActiveStyle);
529
+ reject(new Error("Unable to create TileLayer"));
578
530
  }
579
531
  });
580
532
  });
581
- return tempList;
533
+ });
534
+
535
+ // src/view-fit.ts
536
+ import { boundingExtent } from "ol/extent";
537
+ var DEFAULT_FIT_OPTIONS = {
538
+ padding: [50, 50, 50, 50],
539
+ duration: 1e3
582
540
  };
583
- var createOverlay = (config = { id: "popup-container", positioning: "top-center" }) => {
584
- return new Overlay(
585
- Object.assign(
586
- {
587
- element: document.getElementById(config.id) || void 0
588
- },
589
- config
590
- )
591
- );
541
+ var setFitViewByCoords = (coords, mapInstance = instance, fitOptions) => {
542
+ const view = mapInstance.getView();
543
+ if (coords.length === 1) {
544
+ view.animate(__spreadValues({
545
+ zoom: 14,
546
+ duration: 1e3,
547
+ center: coords[0]
548
+ }, fitOptions || {}));
549
+ } else {
550
+ const extent = boundingExtent(coords);
551
+ view.fit(extent, __spreadValues(__spreadValues({}, DEFAULT_FIT_OPTIONS), fitOptions || {}));
552
+ }
592
553
  };
593
- var createClusterLayer = (dataList, config) => {
594
- const count = dataList.length;
595
- const styleCache = {};
596
- const {
597
- distance,
598
- minDistance,
599
- openClick,
600
- buildStyle,
601
- singleStyles,
602
- computedRadius,
603
- layerName = "cluster-layer"
604
- } = config;
605
- const innerComputedRadius = (size) => Math.pow(size / count, 1 / 18);
606
- styleCache[1] = singleStyles;
607
- const innerBuildStyle = (feature) => {
608
- const size = feature.get("features").length;
609
- let style = styleCache[size];
610
- const tempRadius = computedRadius ? computedRadius(size) : innerComputedRadius(size);
611
- if (!style) {
612
- style = new Style({
613
- image: new CircleStyle({
614
- radius: tempRadius * 20,
615
- stroke: new Stroke({
616
- width: 2,
617
- color: `hsla(${180 - tempRadius * 180}, 100%, 40%, 1)`
618
- }),
619
- fill: new Fill({
620
- color: `hsla(${180 - tempRadius * 180}, 100%, 50%, 1)`
621
- })
622
- }),
623
- text: new Text({
624
- text: size.toString(),
625
- fill: new Fill({
626
- color: `hsla(${180 - tempRadius * 180}, 100%, 10%, 1)`
627
- }),
628
- textBaseline: "middle"
554
+ var setFitViewByGeom = (geom, mapInstance = instance, fitOptions) => {
555
+ mapInstance.getView().fit(geom, __spreadValues(__spreadValues({}, DEFAULT_FIT_OPTIONS), fitOptions || {}));
556
+ };
557
+ var setFitViewByLayer = (layer, mapInstance = instance, fitOptions) => {
558
+ var _a;
559
+ const extent = ((_a = layer.getSource()) == null ? void 0 : _a.getExtent()) || [];
560
+ mapInstance.getView().fit(extent, __spreadValues(__spreadValues({}, DEFAULT_FIT_OPTIONS), fitOptions || {}));
561
+ };
562
+
563
+ // src/select.ts
564
+ import { getCenter } from "ol/extent";
565
+ import { Select } from "ol/interaction";
566
+ import { singleClick } from "ol/events/condition";
567
+ var selectEventHandle = (vectorLayer, feature) => {
568
+ const data = feature.getProperties();
569
+ const { activeStyle } = data;
570
+ feature.setStyle(activeStyle);
571
+ emitter_default.emit("selected-feature", data);
572
+ vectorLayer.set("_hasActive", true);
573
+ if (vectorLayer.get("_isDynamic")) {
574
+ const activeImage = activeStyle.getImage();
575
+ setTimeout(() => {
576
+ emitter_default.emit(
577
+ "dynamic-marker",
578
+ Object.assign({}, data.rawData || {}, {
579
+ lnglat: data.lnglat,
580
+ style: data.style,
581
+ crsForm: data.crsForm,
582
+ width: activeImage.getWidth(),
583
+ height: activeImage.getHeight()
629
584
  })
630
- });
631
- styleCache[size] = style;
632
- }
633
- if (Array.isArray(style)) {
634
- const tempFeature = feature.get("features")[0];
635
- const index = tempFeature.get("styleIndex") || 0;
636
- tempFeature.setProperties({
637
- unActiveStyle: style[index],
638
- activeStyle: style[index + style.length / 2]
639
- });
640
- return style[index];
585
+ );
586
+ }, 1e3);
587
+ }
588
+ const isAutoFit = vectorLayer.get("_isAutoFit");
589
+ if (isAutoFit) {
590
+ const view = instance.getView();
591
+ view.animate({
592
+ duration: 1e3,
593
+ zoom: view.getZoom(),
594
+ center: getCenter(feature.getGeometry().getExtent())
595
+ });
596
+ }
597
+ };
598
+ var createSelectByLayer = (vectorLayer) => {
599
+ const interaction = new Select({
600
+ style: null,
601
+ multi: false,
602
+ hitTolerance: 10,
603
+ layers: [vectorLayer],
604
+ condition: (evt) => {
605
+ let hasFeature = false;
606
+ instance.forEachFeatureAtPixel(
607
+ evt.pixel,
608
+ () => {
609
+ hasFeature = true;
610
+ },
611
+ {
612
+ layerFilter: (layer) => layer === vectorLayer
613
+ }
614
+ );
615
+ return singleClick(evt) && hasFeature;
641
616
  }
642
- return style;
643
- };
644
- const vectorLayer = new VectorLayer({
645
- zIndex: 200,
646
- className: layerName,
647
- source: new Cluster({
648
- distance: distance || 80,
649
- minDistance: minDistance || 0,
650
- source: new VectorSource({
651
- features: dataList.map((item) => {
652
- const feature = new Feature(new Point(item.lnglat));
653
- feature.setProperties(item);
654
- return feature;
655
- })
656
- })
657
- }),
658
- style: (feature) => buildStyle ? buildStyle(feature) : innerBuildStyle(feature)
659
617
  });
660
- vectorLayer.setProperties({
661
- _isCustom: true,
662
- _isVectorLayer: true,
663
- _isClusterLayer: true
618
+ interaction.on("select", (evt) => {
619
+ const { selected, deselected } = evt;
620
+ if (selected.length) {
621
+ const feature = selected[0];
622
+ const isClusterLayer = vectorLayer.get("_isClusterLayer");
623
+ if (isClusterLayer) {
624
+ const features = feature.get("features");
625
+ if (features.length === 1) {
626
+ selectEventHandle(vectorLayer, features[0]);
627
+ }
628
+ } else {
629
+ selectEventHandle(vectorLayer, feature);
630
+ }
631
+ }
632
+ if (deselected.length) {
633
+ const feature = deselected[0];
634
+ const data = feature.getProperties();
635
+ feature.setStyle(data.unActiveStyle);
636
+ vectorLayer.set("_hasActive", false);
637
+ }
664
638
  });
665
- if (openClick) {
666
- createSelectByLayer(vectorLayer);
667
- }
668
- return vectorLayer;
639
+ instance.addInteraction(interaction);
640
+ vectorLayer.set("_selectInteraction", interaction);
641
+ return interaction;
669
642
  };
670
643
 
671
- // src/create-map.ts
672
- import { defaults as interactionDefaults } from "ol/interaction";
673
-
674
- // src/base-layer.ts
675
- import { XYZ } from "ol/source";
676
- import { WMTS } from "ol/source";
677
- import { TileGrid } from "ol/tilegrid";
678
- import { Tile } from "ol/layer";
679
- import WMTSTileGrid from "ol/tilegrid/WMTS";
680
- var createBaseLayer = (layerName = "hzsyvector_dark") => {
681
- const config = {
682
- zIndex: -5,
683
- preload: 1,
684
- minZoom: 8,
685
- maxZoom: 21,
686
- source: new XYZ({
687
- tileGrid: new TileGrid({
688
- tileSize: 256,
689
- resolutions: [
690
- 0.00549933137253187,
691
- 0.00274966568626595,
692
- 0.00137483284313297,
693
- 687416421566485e-18,
694
- 343708210783242e-18,
695
- 171854105391621e-18,
696
- 859270526958104e-19,
697
- 429635263479052e-19,
698
- 214817631739526e-19,
699
- 107408815869763e-19,
700
- 537044079348816e-20,
701
- 268522039674407e-20,
702
- 134261019837204e-20
703
- ],
704
- origin: [118.122911693886, 31.2869311022836],
705
- extent: [
706
- 116.43263049006,
707
- 28.6201742126026,
708
- 123.705594256347,
709
- 31.9765041681924
710
- ]
711
- }),
712
- projection: "EPSG:4326",
713
- urls: [
714
- `https://ywtg.citybrain.hangzhou.gov.cn/${layerName}/{z}/{y}/{x}`,
715
- `https://ywtg.citybrain.hangzhou.gov.cn:9456/${layerName}/{z}/{y}/{x}`,
716
- `https://ywtg.citybrain.hangzhou.gov.cn:9457/${layerName}/{z}/{y}/{x}`,
717
- `https://ywtg.citybrain.hangzhou.gov.cn:9458/${layerName}/{z}/{y}/{x}`,
718
- `https://ywtg.citybrain.hangzhou.gov.cn:9459/${layerName}/{z}/{y}/{x}`
719
- ]
720
- }),
721
- properties: {
722
- _isBaseLayer: true,
723
- _layerName: layerName
724
- }
725
- };
726
- return new Tile(config);
727
- };
728
- var createMapWorldLayer = (layerName, tk = "c77eddc667c5bed016fded560baf93e7") => {
729
- const [name, matrixSet] = layerName.split("_");
730
- const config = {
731
- preload: 1,
732
- zIndex: -10,
733
- cacheSize: 20240,
734
- properties: {
735
- _isBaseLayer: true,
736
- _layerName: layerName
737
- },
738
- source: new WMTS({
739
- crossOrigin: "anonymous",
740
- projection: "EPSG:4326",
741
- wrapX: true,
742
- layer: name,
743
- style: "default",
744
- version: "1.0.0",
745
- format: "image/png",
746
- matrixSet,
747
- tileGrid: new WMTSTileGrid({
748
- tileSize: 256,
749
- origin: [-180, 90],
750
- matrixIds: [
751
- "1",
752
- "2",
753
- "3",
754
- "4",
755
- "5",
756
- "6",
757
- "7",
758
- "8",
759
- "9",
760
- "10",
761
- "11",
762
- "12",
763
- "13",
764
- "14",
765
- "15",
766
- "16",
767
- "17",
768
- "18",
769
- "19"
770
- ],
771
- resolutions: [
772
- 0.703125,
773
- 0.3515625,
774
- 0.17578125,
775
- 0.087890625,
776
- 0.0439453125,
777
- 0.02197265625,
778
- 0.010986328125,
779
- 0.0054931640625,
780
- 0.00274658203125,
781
- 0.001373291015625,
782
- 6866455078125e-16,
783
- 34332275390625e-17,
784
- 171661376953125e-18,
785
- 858306884765625e-19,
786
- 4291534423828125e-20,
787
- 21457672119140625e-21,
788
- 10728836059570312e-21,
789
- 5364418029785156e-21,
790
- 2682209014892578e-21
791
- ]
792
- }),
793
- url: `https://t{0-7}.tianditu.gov.cn/${layerName}/wmts?tk=${tk}`
794
- })
795
- };
796
- return new Tile(config);
644
+ // src/vector-layer.ts
645
+ import { GeoJSON } from "ol/format";
646
+ import gcoord2 from "gcoord";
647
+ import VectorLayer from "ol/layer/Vector";
648
+ import VectorSource from "ol/source/Vector";
649
+ import { Fill, Style, Stroke } from "ol/style";
650
+ var resolveColor = (data, colorKey, colorMap, fallback) => colorKey ? (colorMap == null ? void 0 : colorMap.get(data[colorKey])) || fallback : fallback;
651
+ var assembleGeoJson = (dataList, config) => {
652
+ const { key, crsForm } = config;
653
+ const tempList = [];
654
+ dataList.forEach((item) => {
655
+ try {
656
+ const raw = item[key];
657
+ const pathArray = Array.isArray(raw) ? raw : JSON.parse(raw || "[]");
658
+ if (pathArray.length) {
659
+ const type = item["geoType"] || determineGeometryType(pathArray);
660
+ if (type !== "Invalid" /* Invalid */) {
661
+ tempList.push({
662
+ type: "Feature",
663
+ properties: __spreadValues({}, item),
664
+ geometry: {
665
+ type,
666
+ coordinates: pathArray
667
+ }
668
+ });
669
+ }
670
+ }
671
+ } catch (e) {
672
+ console.error(`\u521B\u5EFA\u7EBF\u72B6\u6570\u636E\u5931\u8D25\uFF1A${e}`);
673
+ }
674
+ });
675
+ return gcoord2.transform(
676
+ { type: "FeatureCollection", features: tempList },
677
+ crsForm || gcoord2.WGS84,
678
+ gcoord2.WGS84
679
+ );
797
680
  };
798
- var createZheJiangLayer = (layerName = "emap", tk = "3b0cdd02-c366-4363-b6de-081a9f12b364") => {
799
- return new Tile({
800
- preload: 1,
801
- minZoom: 4,
802
- maxZoom: 20,
803
- zIndex: -10,
804
- cacheSize: 20240,
805
- source: new XYZ({
806
- wrapX: true,
807
- projection: "EPSG:4326",
808
- crossOrigin: "anonymous",
809
- url: `https://ditu{0-6}.zjzwfw.gov.cn/services/wmts/${layerName}/default/oss/getTile/{z}/{y}/{x}?token=${tk}`
681
+ var createVectorStyle = (feature, config) => {
682
+ const {
683
+ isLine,
684
+ colorMap,
685
+ fillColor,
686
+ colorKey,
687
+ strokeColor,
688
+ fillOpacity,
689
+ strokeWeight,
690
+ activeFillColor,
691
+ activeFillOpacity,
692
+ activeStrokeColor,
693
+ activeStrokeWeight
694
+ } = config || {};
695
+ const data = feature.getProperties();
696
+ const activeStyle = new Style({
697
+ stroke: new Stroke({
698
+ width: activeStrokeWeight || strokeWeight || 4,
699
+ color: activeStrokeColor || resolveColor(data, colorKey, colorMap, strokeColor)
810
700
  })
811
701
  });
812
- };
813
- var getLayerByName = (name) => instance.getAllLayers().find((item) => (item.get("_layerName") || item.getClassName()) === name);
814
- var removeLayerByName = (name) => {
815
- const layer = instance.getAllLayers().find((item) => (item.get("_layerName") || item.getClassName()) === name);
816
- if (layer) {
817
- const source = layer.getSource();
818
- if (source && source.dispose) {
819
- source.dispose();
820
- }
821
- instance.removeLayer(layer);
822
- layer.dispose();
702
+ const unActiveStyle = new Style({
703
+ stroke: new Stroke({
704
+ width: strokeWeight || 2,
705
+ color: resolveColor(data, colorKey, colorMap, strokeColor)
706
+ })
707
+ });
708
+ if (!isLine) {
709
+ activeStyle.setFill(
710
+ new Fill({
711
+ color: hexToRgba(
712
+ activeFillColor || fillColor || "",
713
+ activeFillOpacity || 1
714
+ ) || hexToRgba(
715
+ resolveColor(data, colorKey, colorMap, fillColor) || "",
716
+ fillOpacity || 1
717
+ )
718
+ })
719
+ );
720
+ unActiveStyle.setFill(
721
+ new Fill({
722
+ color: hexToRgba(
723
+ resolveColor(data, colorKey, colorMap, fillColor) || "",
724
+ fillOpacity || 1
725
+ )
726
+ })
727
+ );
823
728
  }
824
- };
825
- var changeLayersByNames = (activeNames, allLayerNames) => {
826
- const changeLayers = instance.getAllLayers().filter((item) => allLayerNames.includes(item.getClassName()));
827
- changeLayers.forEach((layer) => {
828
- layer.setVisible(activeNames == null ? void 0 : activeNames.includes(layer.getClassName()));
729
+ feature.setProperties({
730
+ activeStyle,
731
+ unActiveStyle
829
732
  });
733
+ return unActiveStyle;
830
734
  };
831
-
832
- // src/create-map.ts
833
- var instance;
834
- var mapCenter = [119.71512016971076, 30.122490541963536];
835
- var createMapInstance = (config = {}) => {
836
- if (instance) {
837
- return instance;
735
+ var createBusinessLayer = (dataList, config) => {
736
+ const { isAutoFit, layerName, openClick } = config;
737
+ const geoJson = assembleGeoJson(dataList, config);
738
+ const vectorLayer = new VectorLayer({
739
+ zIndex: 5,
740
+ className: layerName ? layerName : "ol-layer",
741
+ source: new VectorSource({
742
+ features: new GeoJSON().readFeatures(geoJson).map((feature) => {
743
+ feature.setStyle(createVectorStyle(feature, config));
744
+ return feature;
745
+ })
746
+ })
747
+ });
748
+ if (openClick) {
749
+ createSelectByLayer(vectorLayer);
838
750
  }
839
- instance = createMap(config);
840
- return instance;
751
+ vectorLayer.setProperties({
752
+ _isCustom: true,
753
+ _isAutoFit: isAutoFit,
754
+ _isVectorLayer: true,
755
+ _vectorConfig: config,
756
+ _layerName: layerName,
757
+ _dataList: [...dataList],
758
+ _uuidSet: new Set(dataList.map((item) => item._uuid) || [])
759
+ });
760
+ return vectorLayer;
841
761
  };
842
- var createMap = (config = {}) => {
843
- const innerConfig = Object.assign(
844
- {
845
- zoom: 9.4,
846
- maxZoom: 18,
847
- minZoom: 9.4,
848
- center: mapCenter,
849
- baseLayer: "vec-layer",
850
- projection: "EPSG:4326",
851
- layers: [createBaseLayer()],
852
- constrainResolution: false,
853
- smoothExtentConstraint: false,
854
- tk: "c77eddc667c5bed016fded560baf93e7"
855
- },
856
- config || {}
762
+ var appendFeaturesByLayer = (targetLayer, dataList, crsForm) => {
763
+ const vectorSource = targetLayer.getSource();
764
+ const tempSet = targetLayer.get("_uuidSet") || /* @__PURE__ */ new Set();
765
+ dataList.forEach((item) => tempSet.add(item._uuid));
766
+ targetLayer.set("_uuidSet", tempSet);
767
+ const { _vectorConfig: config } = targetLayer.getProperties() || {};
768
+ const geoJson = assembleGeoJson(
769
+ dataList,
770
+ Object.assign({}, config, { crsForm })
857
771
  );
858
- const instance2 = new Map2({
859
- view: new View(innerConfig),
860
- controls: defaults({
861
- zoom: false,
862
- rotate: false,
863
- attribution: false
864
- }),
865
- interactions: interactionDefaults({
866
- pinchRotate: false,
867
- doubleClickZoom: false,
868
- altShiftDragRotate: false
869
- }),
870
- layers: innerConfig.layers || [createBaseLayer()]
871
- });
872
- mapCenter = innerConfig.center || mapCenter;
873
- instance2.activeBaseLayer = innerConfig.baseLayer;
874
- instance2.getLayerByName = getLayerByName;
875
- instance2.removeLayerByName = removeLayerByName;
876
- instance2.changeLayersByNames = changeLayersByNames;
877
- instance2.on("pointermove", (evt) => {
878
- instance2.getTargetElement().style.cursor = instance2.hasFeatureAtPixel(
879
- evt.pixel
880
- ) ? "pointer" : "";
772
+ vectorSource.addFeatures(
773
+ new GeoJSON().readFeatures(geoJson).map((feature) => {
774
+ feature.setStyle(createVectorStyle(feature, config));
775
+ return feature;
776
+ })
777
+ );
778
+ };
779
+ var createVectorFaceLayer = (dataList = [], config) => createBusinessLayer(dataList, Object.assign({}, config, { isLine: false }));
780
+ var createVectorLineLayer = (dataList = [], config) => createBusinessLayer(dataList, Object.assign({}, config, { isLine: true }));
781
+
782
+ // src/mass-marks.ts
783
+ import { Feature } from "ol";
784
+ import { Point } from "ol/geom";
785
+ import gcoord3 from "gcoord";
786
+ import { Icon, Style as Style2 } from "ol/style";
787
+ import VectorLayer2 from "ol/layer/Vector";
788
+ import VectorSource2 from "ol/source/Vector";
789
+ var buildMassMarksStyles = (getImgUrlFn) => {
790
+ return (iconConfig) => {
791
+ const {
792
+ baseUrl,
793
+ markerIcon,
794
+ statusNum = 5,
795
+ activeScale = 1.3,
796
+ markerSize = [32, 32]
797
+ } = iconConfig;
798
+ const getMarkerUrl = getImgUrlFn(baseUrl);
799
+ const [x, y] = markerSize;
800
+ const massMarksStyles = new Array(statusNum * 2);
801
+ for (let i = 0; i < statusNum; i++) {
802
+ const imageUrl = getMarkerUrl(`${markerIcon}-${i}`, ".webp");
803
+ massMarksStyles[i] = new Style2({
804
+ zIndex: 88 + i,
805
+ image: new Icon({
806
+ width: x,
807
+ height: y,
808
+ src: imageUrl,
809
+ anchor: [0.5, 1]
810
+ })
811
+ });
812
+ const activeImage = getMarkerUrl(`${markerIcon}-${i}-active`, ".webp");
813
+ massMarksStyles[i + statusNum] = new Style2({
814
+ zIndex: 120,
815
+ image: new Icon({
816
+ width: x * activeScale,
817
+ height: y * activeScale,
818
+ anchor: [0.5, 1],
819
+ src: activeImage ? activeImage : imageUrl
820
+ })
821
+ });
822
+ }
823
+ return massMarksStyles;
824
+ };
825
+ };
826
+ var createFeatures = (dataList, styleList = []) => {
827
+ return dataList.map((item) => {
828
+ const { crsForm } = item;
829
+ const coord = gcoord3.transform(
830
+ [+item.lnglat[0], +item.lnglat[1]],
831
+ crsForm || gcoord3.WGS84,
832
+ gcoord3.WGS84
833
+ );
834
+ const feature = new Feature({
835
+ geometry: new Point(coord)
836
+ });
837
+ feature.setProperties(__spreadProps(__spreadValues({}, item), {
838
+ unActiveStyle: styleList[item.style],
839
+ activeStyle: styleList[item.style + styleList.length / 2]
840
+ }));
841
+ feature.setStyle(styleList[item.style]);
842
+ return feature;
881
843
  });
882
- return instance2;
883
844
  };
884
- var disposeMap = () => {
885
- instance.getOverlays().forEach((overlay) => {
886
- instance.removeOverlay(overlay);
845
+ var addFeaturesByLayer = (targetLayer, dataList, config) => {
846
+ const massMarksStyles = targetLayer.get("_massMarksStyles");
847
+ const targetSource = targetLayer == null ? void 0 : targetLayer.getSource();
848
+ const { clear } = config;
849
+ if (clear) {
850
+ targetSource == null ? void 0 : targetSource.clear();
851
+ }
852
+ targetSource == null ? void 0 : targetSource.addFeatures(createFeatures(dataList, massMarksStyles));
853
+ };
854
+ var createMassMarksLayer = (dataList, styleList = []) => {
855
+ const vectorLayer = new VectorLayer2({
856
+ zIndex: 2e3,
857
+ source: new VectorSource2({
858
+ features: createFeatures(dataList, styleList)
859
+ })
887
860
  });
888
- instance.getInteractions().clear();
889
- const layers = instance.getAllLayers();
890
- layers.forEach((layer) => {
891
- const source = layer.getSource();
892
- if (source && source.dispose) {
893
- source.dispose();
894
- }
895
- instance.removeLayer(layer);
896
- layer.dispose();
861
+ vectorLayer.setProperties({
862
+ _isCustom: true,
863
+ _isVectorLayer: true,
864
+ _isMassMarksLayer: true,
865
+ _statusNum: styleList.length / 2,
866
+ _dataList: [...dataList],
867
+ _uuidSet: new Set(dataList.map((item) => item._uuid) || [])
897
868
  });
898
- instance.setTarget("");
899
- instance.dispose();
900
- instance = void 0;
869
+ return vectorLayer;
901
870
  };
902
- var getMapInstance = () => instance;
903
- var resetZoomAndCenter = (center = mapCenter) => {
904
- if (instance) {
905
- const view = instance.getView();
906
- view.animate({
907
- zoom: 9.4,
908
- center,
909
- duration: 1e3
871
+ var addMassMarksLayer = (getImgUrlFn) => {
872
+ return (dataList = [], iconConfig, openClick = true) => {
873
+ const {
874
+ offset = [0, 0],
875
+ baseUrl,
876
+ hasLine,
877
+ hasFace,
878
+ layerName,
879
+ isDynamic,
880
+ isAutoFit,
881
+ statusNum,
882
+ markerIcon,
883
+ marksStyles,
884
+ markerSize,
885
+ activeScale,
886
+ vectorConfig
887
+ } = iconConfig;
888
+ const massMarksStyles = marksStyles ? marksStyles : buildMassMarksStyles(getImgUrlFn)({
889
+ baseUrl,
890
+ markerIcon,
891
+ markerSize,
892
+ statusNum: statusNum || 5,
893
+ activeScale: activeScale || 1.3
910
894
  });
911
- }
912
- };
913
- var resetMap = (config = { center: mapCenter, isClearAll: true }) => {
914
- removeAllLayers();
915
- resetZoomAndCenter(config.center || mapCenter);
916
- };
917
-
918
- // src/helper.ts
919
- var hexToRgba = (hex, alpha) => {
920
- if (hex.startsWith("#")) {
921
- let tempHex = hex.replace("#", "");
922
- if (tempHex.length === 3) {
923
- tempHex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];
895
+ const massMarksLayer = createMassMarksLayer(dataList, massMarksStyles);
896
+ if (openClick) {
897
+ massMarksLayer.setProperties({
898
+ _offset: offset,
899
+ _isAutoFit: isAutoFit
900
+ });
901
+ createSelectByLayer(massMarksLayer);
924
902
  }
925
- const r = parseInt(tempHex.substring(0, 2), 16);
926
- const g = parseInt(tempHex.substring(2, 4), 16);
927
- const b = parseInt(tempHex.substring(4, 6), 16);
928
- return `rgba(${r}, ${g}, ${b}, ${alpha})`;
929
- } else {
930
- return hex;
931
- }
932
- };
933
- var getLayersDataList = () => {
934
- var _a;
935
- return ((_a = instance) == null ? void 0 : _a.getAllLayers().map((layer) => layer.get("_dataList") || []).flat(2)) || [];
936
- };
937
- var determineGeometryType = (coordinates) => {
938
- const getArrayDepth = (arr) => {
939
- if (!Array.isArray(arr)) return 0;
940
- return 1 + Math.max(...arr.map((item) => getArrayDepth(item)), 0);
941
- };
942
- const isClosedRing = (coords) => {
943
- if (!Array.isArray(coords) || coords.length < 3) return false;
944
- const first = coords[0];
945
- const last = coords[coords.length - 1];
946
- return first[0] === last[0] && first[1] === last[1];
947
- };
948
- const isValidCoordinate = (coord) => {
949
- return Array.isArray(coord) && coord.length >= 2 && typeof coord[0] === "number" && typeof coord[1] === "number";
950
- };
951
- const isValidLineString = (coords) => {
952
- return Array.isArray(coords) && coords.length >= 2 && coords.every(isValidCoordinate);
953
- };
954
- const isValidPolygon = (coords) => {
955
- if (!Array.isArray(coords)) return false;
956
- const rings = getArrayDepth(coords) === 2 ? [coords] : coords;
957
- return rings.every(
958
- (ring) => Array.isArray(ring) && ring.length >= 4 && isClosedRing(ring) && ring.every(isValidCoordinate)
959
- );
903
+ if (hasLine) {
904
+ const vectorLayer = createBusinessLayer(
905
+ dataList,
906
+ Object.assign(
907
+ {},
908
+ {
909
+ key: "line",
910
+ isLine: true,
911
+ openClick: false,
912
+ strokeWeight: 4,
913
+ strokeColor: "rgba(29, 235, 255, 0.8)"
914
+ },
915
+ vectorConfig || {}
916
+ )
917
+ );
918
+ instance.addLayer(vectorLayer);
919
+ }
920
+ if (hasFace) {
921
+ const vectorLayer = createBusinessLayer(
922
+ dataList,
923
+ Object.assign(
924
+ {},
925
+ {
926
+ isLine: false,
927
+ key: "faceList",
928
+ strokeWeight: 1,
929
+ openClick: false,
930
+ fillColor: "#4247DF",
931
+ strokeStyle: "dashed",
932
+ strokeColor: "#4247DF"
933
+ },
934
+ vectorConfig || {}
935
+ )
936
+ );
937
+ instance.addLayer(vectorLayer);
938
+ }
939
+ massMarksLayer.setProperties({
940
+ _isCustom: true,
941
+ _offset: offset,
942
+ _hasLine: hasLine,
943
+ _hasFace: hasFace,
944
+ className: layerName,
945
+ _layerName: layerName,
946
+ _isVectorLayer: true,
947
+ _isDynamic: isDynamic,
948
+ _massMarksStyles: massMarksStyles
949
+ });
950
+ instance.addLayer(massMarksLayer);
951
+ return massMarksLayer;
960
952
  };
961
- const depth = getArrayDepth(coordinates);
962
- try {
963
- if (depth < 2 || !coordinates || coordinates.length === 0) {
964
- return "Invalid" /* Invalid */;
965
- } else if (depth === 2 && isValidLineString(coordinates)) {
966
- return isClosedRing(coordinates) && coordinates.length >= 4 ? "Polygon" /* Polygon */ : "LineString" /* LineString */;
967
- } else if (depth === 3 && Array.isArray(coordinates) && coordinates.every(isValidLineString)) {
968
- if (isValidPolygon(coordinates)) {
969
- return "Polygon" /* Polygon */;
970
- } else if (coordinates.every((arr) => !isClosedRing(arr))) {
971
- return "MultiLineString" /* MultiLineString */;
953
+ };
954
+ var updateMarksLayersByStatus = (checkedStatusList = []) => {
955
+ const hideStyle = new Style2({});
956
+ const tempList = [];
957
+ const targetLayers = instance.getAllLayers().filter((layer) => layer.get("_isMassMarksLayer"));
958
+ targetLayers.forEach((layer) => {
959
+ const features = layer.getSource().getFeatures();
960
+ features.forEach((feature) => {
961
+ const data = feature.getProperties();
962
+ if (!checkedStatusList.includes(data.status)) {
963
+ feature.setStyle(hideStyle);
972
964
  } else {
973
- return "Invalid" /* Invalid */;
965
+ tempList.push(data);
966
+ feature.setStyle(data.unActiveStyle);
974
967
  }
975
- } else if (depth === 4 && Array.isArray(coordinates) && coordinates.every((rings) => isValidPolygon(rings))) {
976
- return "MultiPolygon" /* MultiPolygon */;
977
- } else {
978
- return "Invalid" /* Invalid */;
979
- }
980
- } catch (error) {
981
- console.error("Error analyzing coordinates:", error);
982
- return "Invalid" /* Invalid */;
983
- }
968
+ });
969
+ });
970
+ return tempList;
984
971
  };
985
972
 
986
- // src/ogc-utils.ts
987
- import { WMTS as WMTS2 } from "ol/source";
988
- import TileLayer from "ol/layer/Tile";
989
- import { WMTSCapabilities } from "ol/format";
990
- import { optionsFromCapabilities } from "ol/source/WMTS";
991
- var parser = new WMTSCapabilities();
992
- var capabilitiesMap = /* @__PURE__ */ new Map();
993
- var getCapabilities = (url) => {
994
- return new Promise((resolve) => {
995
- const capabilities = capabilitiesMap.get(url);
996
- if (capabilities) {
997
- resolve(capabilities);
998
- } else {
999
- fetch(url).then((data) => data.text()).then((text) => {
1000
- const capabilities2 = parser.read(text);
1001
- capabilitiesMap.set(url, capabilities2);
1002
- resolve(capabilities2);
973
+ // src/cluster.ts
974
+ import { Feature as Feature2 } from "ol";
975
+ import { Point as Point2 } from "ol/geom";
976
+ import Cluster from "ol/source/Cluster";
977
+ import CircleStyle from "ol/style/Circle";
978
+ import VectorLayer3 from "ol/layer/Vector";
979
+ import VectorSource3 from "ol/source/Vector";
980
+ import { Fill as Fill2, Style as Style3, Stroke as Stroke2, Text } from "ol/style";
981
+ var createClusterLayer = (dataList, config) => {
982
+ const count = dataList.length;
983
+ const styleCache = {};
984
+ const {
985
+ distance,
986
+ minDistance,
987
+ openClick,
988
+ buildStyle,
989
+ singleStyles,
990
+ computedRadius,
991
+ layerName = "cluster-layer"
992
+ } = config;
993
+ const innerComputedRadius = (size) => Math.pow(size / count, 1 / 18);
994
+ styleCache[1] = singleStyles;
995
+ const innerBuildStyle = (feature) => {
996
+ const size = feature.get("features").length;
997
+ let style = styleCache[size];
998
+ const tempRadius = computedRadius ? computedRadius(size) : innerComputedRadius(size);
999
+ if (!style) {
1000
+ style = new Style3({
1001
+ image: new CircleStyle({
1002
+ radius: tempRadius * 20,
1003
+ stroke: new Stroke2({
1004
+ width: 2,
1005
+ color: `hsla(${180 - tempRadius * 180}, 100%, 40%, 1)`
1006
+ }),
1007
+ fill: new Fill2({
1008
+ color: `hsla(${180 - tempRadius * 180}, 100%, 50%, 1)`
1009
+ })
1010
+ }),
1011
+ text: new Text({
1012
+ text: size.toString(),
1013
+ fill: new Fill2({
1014
+ color: `hsla(${180 - tempRadius * 180}, 100%, 10%, 1)`
1015
+ }),
1016
+ textBaseline: "middle"
1017
+ })
1003
1018
  });
1019
+ styleCache[size] = style;
1004
1020
  }
1005
- });
1006
- };
1007
- var createWmtsLayer = (serverUrl) => (config) => __async(null, null, function* () {
1008
- const { style, format, version, layerName, matrixSet } = config;
1009
- const [workspace, datastore] = layerName.split(":");
1010
- const capabilitiesUrl = `${serverUrl}/${workspace}/${datastore}/gwc/service/wmts?request=GetCapabilities`;
1011
- return new Promise((resolve, reject) => {
1012
- getCapabilities(capabilitiesUrl).then((data) => {
1013
- const options = optionsFromCapabilities(data, {
1014
- Style: style || "",
1015
- layer: datastore,
1016
- version: version || "1.1.0",
1017
- format: format || "image/png",
1018
- matrixSet: matrixSet || "EPSG:4326"
1021
+ if (Array.isArray(style)) {
1022
+ const tempFeature = feature.get("features")[0];
1023
+ const index = tempFeature.get("styleIndex") || 0;
1024
+ tempFeature.setProperties({
1025
+ unActiveStyle: style[index],
1026
+ activeStyle: style[index + style.length / 2]
1019
1027
  });
1020
- if (options) {
1021
- resolve(
1022
- new TileLayer({
1023
- zIndex: 3,
1024
- className: layerName,
1025
- source: new WMTS2(options)
1026
- })
1027
- );
1028
- } else {
1029
- reject(new Error("Unable to create TileLayer"));
1030
- }
1031
- });
1028
+ return style[index];
1029
+ }
1030
+ return style;
1031
+ };
1032
+ const vectorLayer = new VectorLayer3({
1033
+ zIndex: 200,
1034
+ className: layerName,
1035
+ source: new Cluster({
1036
+ distance: distance || 80,
1037
+ minDistance: minDistance || 0,
1038
+ source: new VectorSource3({
1039
+ features: dataList.map((item) => {
1040
+ const feature = new Feature2(new Point2(item.lnglat));
1041
+ feature.setProperties(item);
1042
+ return feature;
1043
+ })
1044
+ })
1045
+ }),
1046
+ style: (feature) => buildStyle ? buildStyle(feature) : innerBuildStyle(feature)
1032
1047
  });
1033
- });
1048
+ vectorLayer.setProperties({
1049
+ _isCustom: true,
1050
+ _isVectorLayer: true,
1051
+ _isClusterLayer: true
1052
+ });
1053
+ if (openClick) {
1054
+ createSelectByLayer(vectorLayer);
1055
+ }
1056
+ return vectorLayer;
1057
+ };
1034
1058
  export {
1035
1059
  GeometryType,
1036
1060
  activeFeatureByUid,
1061
+ addFeaturesByLayer,
1037
1062
  addMassMarksLayer,
1038
1063
  appendFeaturesByLayer,
1039
1064
  buildMassMarksStyles,