zhihao-ui 1.3.57 → 1.3.58-alpha.2

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 (56) hide show
  1. package/dist/es/BaseInfo-CD2tAAod.js +51 -0
  2. package/dist/es/BaseItem-DcezA7sa.js +127 -0
  3. package/dist/es/{Button-DlEYWX3X.js → Button-B2Z_WKdq.js} +2 -2
  4. package/dist/es/CascaderLoadMore-Bt031LmH.js +277 -0
  5. package/dist/es/{DatePicker-CymT2gjS.js → DatePicker-CP0KSqBs.js} +3 -3
  6. package/dist/es/{DetailHeader-DlAjiYhV.js → DetailHeader-DoaD0eKO.js} +3 -3
  7. package/dist/es/{DetailSubTitle-OH6TMyKI.js → DetailSubTitle-oiPuqJg6.js} +2 -2
  8. package/dist/es/{Dialog-B_Psb_wh.js → Dialog-BynyEy56.js} +3 -3
  9. package/dist/es/{DiyDataTable-DRuRQedj.js → DiyDataTable-Bwk_tQDp.js} +9 -7
  10. package/dist/es/{EditInfoPair-B3TKNnnl.js → EditInfoPair-BRkRrmJI.js} +3 -3
  11. package/dist/es/{FileWrapper-bVyPV48o.js → FileWrapper-Bw-FhIY5.js} +4 -4
  12. package/dist/es/{Grid-CLU3cdzX.js → Grid-Cndtkriq.js} +35 -34
  13. package/dist/es/{InfoPair-nPqi45Ys.js → InfoPair-CIuXeXV1.js} +3 -3
  14. package/dist/es/{Input-DjQtffZg.js → Input-EcnKRK5Q.js} +3 -3
  15. package/dist/es/{Loading-CDxuHkdt.js → Loading-Mq3IiaFA.js} +2 -2
  16. package/dist/es/Map-CxCxmeGO.js +2560 -0
  17. package/dist/es/{MessageBox-kkpNeAii.js → MessageBox-wQY1ft63.js} +2 -2
  18. package/dist/es/{MoneyInput-ZLGQmpLk.js → MoneyInput-DZuOujIc.js} +5 -5
  19. package/dist/es/{PageHeadPanel-DsEeXTgj.js → PageHeadPanel-B2Uqf3zz.js} +2 -2
  20. package/dist/es/{Table-gFH87j_O.js → Table-NT97DzT0.js} +155 -155
  21. package/dist/es/{ToolTips-BRjrysPf.js → ToolTips-CVkx0nFU.js} +3 -3
  22. package/dist/es/index.js +60 -60
  23. package/dist/es/{utils-B-n1yx0L.js → utils-vqG84sMo.js} +1 -1
  24. package/dist/es/{vendor-DkGhDRdQ.js → vendor-MMWA2y7U.js} +29 -28
  25. package/dist/index.css +1 -1
  26. package/dist/types/components/BaseInfo/BaseInfo.vue.d.ts +2 -2
  27. package/dist/types/components/BaseInfo/index.d.ts +33 -33
  28. package/dist/types/components/BaseItem/BaseItem.vue.d.ts +1 -1
  29. package/dist/types/components/BaseItem/index.d.ts +24 -24
  30. package/dist/types/components/DetailSubTitle/index.d.ts +1 -0
  31. package/dist/types/components/DiyDataTable/DiyDataTable.vue.d.ts +32 -6
  32. package/dist/types/components/DiyDataTable/index.d.ts +96 -18
  33. package/dist/types/components/DiyDataTable/type.d.ts +1 -1
  34. package/dist/types/components/Grid/Grid.vue.d.ts +1 -1
  35. package/dist/types/components/Grid/index.d.ts +15 -15
  36. package/dist/types/components/Input/Input.vue.d.ts +6 -6
  37. package/dist/types/components/Input/index.d.ts +9 -9
  38. package/dist/types/components/Map/Map.vue.d.ts +9 -1
  39. package/dist/types/components/Map/function/drawPolygon.d.ts +1 -1
  40. package/dist/types/components/Map/function/event.d.ts +2 -1
  41. package/dist/types/components/Map/function/map.d.ts +2 -0
  42. package/dist/types/components/Map/function/renderPolygon.d.ts +24 -0
  43. package/dist/types/components/Map/function/ship/index.d.ts +1 -1
  44. package/dist/types/components/Map/function/ship/style.d.ts +5 -3
  45. package/dist/types/components/Map/index.d.ts +27 -3
  46. package/dist/types/components/Map/meta/index.d.ts +2 -1
  47. package/dist/types/components/MoneyInput/MoneyInput.vue.d.ts +4 -4
  48. package/dist/types/components/MoneyInput/index.d.ts +6 -6
  49. package/dist/types/components/Table/types.d.ts +2 -2
  50. package/dist/umd/index.css +1 -1
  51. package/dist/umd/index.umd.cjs +57 -58
  52. package/package.json +1 -1
  53. package/dist/es/BaseInfo-ehtLJvVF.js +0 -53
  54. package/dist/es/BaseItem-6LMSv4Je.js +0 -130
  55. package/dist/es/CascaderLoadMore-DKTvm00E.js +0 -287
  56. package/dist/es/Map-CmcmvvxF.js +0 -2363
@@ -1,2363 +0,0 @@
1
- import { defineComponent as nt, openBlock as rt, createElementBlock as lt, createElementVNode as et, ref as fe, computed as Be, h as me, createVNode as tt, render as At, reactive as Zt, onMounted as Wt, onUnmounted as Gt } from "vue";
2
- import { S as Ht, M as ft, T as Re, X as $e, t as ae, V as Yt, u as Bt, D as st, v as Xt, j as bt, w as it, x as qt, y as Ve, F as ce, z as ee, O as xe, P as ie, A as Ae, B as kt, L as qe, G as jt, H as ht, I as ue, J as be, K as ye, N as Ee, Q as Ke, R as Pe, U as Kt, W as _t, Y as Qt, Z as Jt, _ as je, $ as ot, a0 as mt, a1 as Ut, a2 as It, a3 as eo } from "./vendor-DkGhDRdQ.js";
3
- import { _ as ct } from "./Button-DlEYWX3X.js";
4
- import { w as to } from "./utils-B-n1yx0L.js";
5
- const oo = { id: "scale-line-container" }, no = /* @__PURE__ */ nt({
6
- __name: "scaleLine",
7
- setup(e, { expose: r }) {
8
- return r({
9
- setScaleLine: (l, d) => {
10
- d || (d = "metric");
11
- const c = new Ht({
12
- units: d
13
- }), s = document.getElementById("scale-line-container");
14
- s && (c.setTarget(s), l.addControl(c));
15
- }
16
- }), (l, d) => (rt(), lt("div", oo));
17
- }
18
- }), ro = /* @__PURE__ */ ct(no, [["__scopeId", "data-v-2bc5dee8"]]), lo = { class: "zoom" }, so = /* @__PURE__ */ nt({
19
- __name: "zoomControl",
20
- props: {
21
- mapInstance: {
22
- type: Object,
23
- default: () => null
24
- }
25
- },
26
- setup(e) {
27
- const r = e;
28
- console.log("props", r);
29
- const o = () => {
30
- console.log("props");
31
- const { setZoom: d, getZoom: c, getInstall: s } = r.mapInstance.methods;
32
- if (!s()) return;
33
- const k = c();
34
- k && d(k + 1);
35
- }, l = () => {
36
- const { setZoom: d, getZoom: c, getInstall: s } = r.mapInstance.methods;
37
- if (!s()) return;
38
- const k = c();
39
- k && d(k - 1);
40
- };
41
- return (d, c) => (rt(), lt("div", lo, [
42
- et("div", {
43
- class: "button big-button",
44
- onClick: o
45
- }, " + "),
46
- et("div", {
47
- class: "button small-button",
48
- onClick: l
49
- }, " - ")
50
- ]));
51
- }
52
- }), io = /* @__PURE__ */ ct(so, [["__scopeId", "data-v-78a81741"]]), Xe = "a6e8f78974f2581f2ca00485b40c948f", de = {
53
- // 地图默认层级
54
- default: 13,
55
- // 地图缩放最小层级
56
- min: 3,
57
- // 地图缩放最大层级
58
- max: 18,
59
- // 船形图标最小渲染层级
60
- shipModelMin: 13,
61
- // 船形图标最小渲染层级
62
- shipTriggleMin: 16,
63
- // 船形图标最大渲染层级
64
- shipModelMax: 18,
65
- //根据原系统canvas图片转换svg长宽比例计算缩放值
66
- scaleNum: 0.555
67
- }, le = {
68
- // 经纬度 源数据 地理坐标 WGS84
69
- data: "EPSG:4326",
70
- // 墨卡托投影坐标 渲染坐标
71
- mercator: "EPSG:3857"
72
- }, co = [114.84, 30.52], pt = "https://static.zhihaoscm.cn/", _e = 2003750834e-2;
73
- var Me = ((e) => (e.vectorTile = `https://t0.tianditu.gov.cn/vec_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&TILEMATRIXSET=w&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=${Xe}`, e.vectorTileMark = `https://t0.tianditu.gov.cn/cva_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&TILEMATRIXSET=w&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=${Xe}`, e.satelliteImgTile = `https://t0.tianditu.gov.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&TILEMATRIXSET=w&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=${Xe}`, e.satelliteImgTileMark = `https://t0.tianditu.gov.cn/cia_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cia&TILEMATRIXSET=w&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=${Xe}`, e.greenTile = `${pt}/map/tile/{z}/{x}/{y}.png`, e))(Me || {}), ze = /* @__PURE__ */ ((e) => (e[e.M = 1] = "M", e[e.KM = 2] = "KM", e[e.NM = 3] = "NM", e))(ze || {}), re = /* @__PURE__ */ ((e) => (e.PORT = "port", e.SHIP = "ship", e.TRACK = "track", e))(re || {});
74
- function ao() {
75
- const e = fe(), r = () => e.value, o = () => r().getView(), l = () => {
76
- var f;
77
- return (f = o()) == null ? void 0 : f.getZoom();
78
- }, d = (f) => {
79
- var M;
80
- (M = o()) == null || M.setZoom(f);
81
- }, c = (f, M) => {
82
- var $;
83
- ($ = o()) == null || $.setCenter(ae([f, M]));
84
- }, s = () => {
85
- var M;
86
- const f = (M = o()) == null ? void 0 : M.getCenter();
87
- return Xt(f);
88
- }, w = () => {
89
- var f;
90
- return (f = r()) == null ? void 0 : f.getSize();
91
- }, k = () => {
92
- const f = window.navigator.userAgent, M = /iPad|iPhone|iPod/.test(f), $ = /Safari/.test(f) && !/CriOS/.test(f), V = /(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/i.test(f);
93
- return M && ($ || V);
94
- }, x = new ft(), t = (f, M) => {
95
- n(M);
96
- const $ = {
97
- zoom: M.zoom,
98
- center: ae(M.center),
99
- minZoom: de.min,
100
- maxZoom: de.max,
101
- constrainResolution: !0,
102
- enableRotation: !1,
103
- multiWorld: !0
104
- };
105
- let V = {
106
- target: f,
107
- controls: Bt({
108
- zoom: !1
109
- }),
110
- layers: [
111
- x.get("vectorTile"),
112
- x.get("vectorTileMark"),
113
- x.get("satelliteImgTile"),
114
- x.get("satelliteImgTileMark")
115
- ],
116
- view: new Yt($)
117
- };
118
- const i = new ft(V);
119
- if (k()) {
120
- console.log("IOS Browser");
121
- const g = new st({
122
- handleEvent: function(p) {
123
- if (p.type === "dblclick") {
124
- console.log("IOS Browser---dblclick"), p.originalEvent.preventDefault();
125
- const h = i.getView(), C = h.getZoom();
126
- return h.setZoom(C + 1), !1;
127
- }
128
- return !0;
129
- }
130
- });
131
- i.addInteraction(g);
132
- }
133
- e.value = i;
134
- }, n = (f) => {
135
- x.set("vectorTile", new Re({
136
- source: new $e({ url: Me.vectorTile }),
137
- visible: f.layerType === "vector",
138
- zIndex: 0,
139
- preload: 1,
140
- className: "vector"
141
- })), x.set("vectorTileMark", new Re({
142
- source: new $e({ url: Me.vectorTileMark }),
143
- visible: f.layerType === "vector",
144
- zIndex: 1,
145
- preload: 1,
146
- className: "vector"
147
- })), x.set("satelliteImgTile", new Re({
148
- source: new $e({ url: Me.satelliteImgTile }),
149
- visible: f.layerType === "satellite",
150
- zIndex: 0,
151
- preload: 1,
152
- className: "satellite"
153
- })), x.set("satelliteImgTileMark", new Re({
154
- source: new $e({ url: Me.satelliteImgTileMark }),
155
- visible: f.layerType === "satellite",
156
- zIndex: 1,
157
- preload: 1,
158
- className: "satellite"
159
- })), x.set("greenMark", new Re({
160
- source: new $e({ url: Me.greenTile }),
161
- visible: f.showGreenLayer,
162
- zIndex: 2,
163
- className: "greenTile"
164
- }));
165
- };
166
- return {
167
- getInstall: r,
168
- getView: o,
169
- getZoom: l,
170
- setZoom: d,
171
- setCenter: c,
172
- getCenter: s,
173
- getSize: w,
174
- initMap: t,
175
- setBaseLayerMap: n
176
- };
177
- }
178
- const at = function(e, r) {
179
- const o = Number(r) / 6e5;
180
- return [Number(e) / 6e5, o];
181
- }, uo = (e, r) => {
182
- const o = ae(e), l = r * 1e3, d = [
183
- o[0] - l,
184
- o[1] - l,
185
- o[0] + l,
186
- o[1] + l
187
- ], c = qt(d, le.mercator, le.data);
188
- return {
189
- leftTopPoint: { lng: c[0], lat: c[3] },
190
- rightTopPoint: { lng: c[2], lat: c[3] },
191
- rightBottomPoint: { lng: c[2], lat: c[1] },
192
- leftBottomPoint: { lng: c[0], lat: c[1] }
193
- };
194
- }, go = function(e, r) {
195
- const l = it(e);
196
- let d = "";
197
- switch (console.log(r, ze), r) {
198
- case ze.M:
199
- d = Math.round(l * 100) / 100 + " m";
200
- break;
201
- case ze.KM:
202
- d = Math.round(l / 1e3 * 100) / 100 + " km";
203
- break;
204
- case ze.NM:
205
- d = (Math.round(l / 1e3 * 100) / 100 / 1.852).toFixed(2) + " nm";
206
- break;
207
- }
208
- return d;
209
- };
210
- function fo(e) {
211
- const r = e[0] * _e / 180;
212
- let o = Math.log(Math.tan((90 + e[1]) * Math.PI / 360)) / (Math.PI / 180);
213
- return o = o * _e / 180, [r, o];
214
- }
215
- function Te(e = "") {
216
- let r = e.replace(/&?/g, "&");
217
- return r = r.replace(/&#x([0-9a-fA-F]+);?/g, (o, l) => {
218
- const d = parseInt(l, 16);
219
- return String.fromCodePoint(d);
220
- }), r;
221
- }
222
- const vt = (e) => {
223
- const r = new Ve({
224
- font: "Normal 14px map-iconfont",
225
- text: Te(e),
226
- fill: new ce({ color: "#fff" }),
227
- offsetY: -14
228
- });
229
- return new ee({
230
- text: r,
231
- zIndex: 100
232
- });
233
- }, yt = (e, r = "lonlat") => {
234
- const o = { lon: 0, lat: 0 }, l = e[0] / _e * 180;
235
- let d = e[1] / _e * 180;
236
- return d = 180 / Math.PI * (2 * Math.atan(Math.exp(d * Math.PI / 180)) - Math.PI / 2), o.lon = l, o.lat = d, r === "lonlat" ? o : [l, d];
237
- }, ho = (e) => {
238
- const r = bt.duration(e, "minutes"), o = Math.floor(r.asDays()), l = r.hours(), d = r.minutes();
239
- let c = `${String(d).padStart(2, "0")}分`;
240
- return l !== 0 && (c = `${String(l).padStart(2, "0")}时${c}`), o !== 0 && (c = `${String(o).padStart(2, "0")}天${c}`), c;
241
- }, mo = (e, r) => {
242
- let o = null;
243
- const l = async (t) => {
244
- if (!e || (console.log("vehicleInfo", t), !(t != null && t.lon && (t != null && t.lat)))) return;
245
- const n = Math.abs(Number(t.lon)) > 180 ? at(t.lon, t.lat) : [t.lon, t.lat];
246
- d(t, ae(n));
247
- const f = e == null ? void 0 : e.getView(), M = new ie(n);
248
- f.setCenter(Ae(M.getCoordinates(), le.data, le.mercator));
249
- }, d = (t, n) => {
250
- const f = `${pt}map/car-icon.gif`;
251
- o || (o = new xe({
252
- element: document.createElement("div"),
253
- positioning: "center-center",
254
- stopEvent: !1
255
- // 允许交互事件穿透
256
- }), e.addOverlay(o));
257
- const M = o.getElement();
258
- M.style.backgroundImage = `url(${f})`, M.style.width = "80px", M.style.height = "80px";
259
- const $ = (t == null ? void 0 : t.drc) || "";
260
- M.style.transform = `rotate(${$}deg)`, M.style.backgroundSize = "cover", o == null || o.setPosition(n);
261
- };
262
- return {
263
- location: l,
264
- remove: () => {
265
- const t = o == null ? void 0 : o.getElement();
266
- t && (t.innerHTML = "");
267
- },
268
- renderTrack: (t, n, f) => {
269
- r.render(t, n, f, "truck", 1e3);
270
- },
271
- setCenter: (t) => {
272
- r.setCenter(t);
273
- },
274
- closeTrack: () => {
275
- r.close();
276
- },
277
- playTrack: (t, n) => {
278
- r.play(t, n);
279
- }
280
- };
281
- };
282
- var Ct = /* @__PURE__ */ ((e) => (e[e.发动机使用中 = 0] = "发动机使用中", e[e.锚泊 = 1] = "锚泊", e[e.未操作 = 2] = "未操作", e[e.操纵能力受限 = 3] = "操纵能力受限", e[e.吃水受限 = 4] = "吃水受限", e[e.系泊 = 5] = "系泊", e[e.搁浅 = 6] = "搁浅", e[e.从事捕捞 = 7] = "从事捕捞", e[e.航行中 = 8] = "航行中", e[e.留作将来修正导航状态 = 9] = "留作将来修正导航状态", e[e.高速船留用 = 10] = "高速船留用", e[e.机动船尾推作业 = 11] = "机动船尾推作业", e[e.机动船顶推或侧推作业 = 12] = "机动船顶推或侧推作业", e[e.飞翼船留用 = 13] = "飞翼船留用", e[e.现行的 = 14] = "现行的", e[e.未定义 = 15] = "未定义", e))(Ct || {}), ge = /* @__PURE__ */ ((e) => (e.left = "left", e.right = "right", e.front = "front", e.up = "up", e.down = "down", e.back = "back", e))(ge || {});
283
- const vo = (e) => {
284
- const r = /* @__PURE__ */ new Map(), o = {};
285
- let l = null;
286
- const d = "--";
287
- let c = null;
288
- const s = document.createElement("div"), w = new xe({
289
- element: s,
290
- positioning: "top-left",
291
- className: "track-label-popup"
292
- });
293
- let k, x, t, n, f, M = !1, $ = Date.now(), V, i = 0, g = null, p = 20;
294
- const h = 8, C = [], q = (a) => {
295
- var m;
296
- for (C.unshift(a); C.length > h; ) {
297
- const v = C.pop(), b = r.get(v);
298
- b && ((m = b.getSource()) == null || m.clear(), e == null || e.removeLayer(b), r.delete(v), delete o[v]);
299
- }
300
- };
301
- let A = "";
302
- const K = ["#ff0000", "#00ff00", "#0079ff", "#ffa500", "#800080", "#008080", "#ffc0cb", "#800000", "#000080", "#808000"], I = kt(async () => {
303
- if (l && o[l] && r.get(l).getVisible()) {
304
- console.log("reRenderTrackLine------------"), await Qe(l);
305
- const a = L(l, o[l]);
306
- J(l, a);
307
- }
308
- }, 100), T = () => l && o[l] && r.get(l).getVisible(), L = (a, m) => {
309
- let v = [];
310
- const b = Math.max(1, Math.floor(m.length / p));
311
- return v = m.filter((N, F) => F % b === 0).map((N, F) => {
312
- if (Number(N.lon) > 180 || Number(N.lat) > 180) {
313
- const [O, B] = at(N.lon, N.lat);
314
- N.lon = O, N.lat = B;
315
- }
316
- return N.center = [N.lon, N.lat], N.centerPoint = fo(N.center), N.time = bt(N.createdAt).format("YYYY-MM-DD HH:mm:ss"), N.id = a, N.index = F, N;
317
- }), v.filter(
318
- (N, F, O) => F === O.findIndex(
319
- (B) => Math.abs(B.lon - N.lon) < 1e-6 && Math.abs(B.lat - N.lat) < 1e-6
320
- )
321
- );
322
- }, R = async (a, m, v, b = "ship", y = 200) => {
323
- if (!e || JSON.stringify(o[a]) === JSON.stringify(m) && l === a || (m = m == null ? void 0 : m.reverse(), w && b === "ship" && (e != null && e.getOverlays().getArray().includes(w) || e.addOverlay(w)), (m == null ? void 0 : m.length) < 2))
324
- return;
325
- q(a), l = a, o[a] = m, p = y;
326
- const z = Object.keys(o).findIndex((N) => N === a) || 0;
327
- A = v || K[z > 10 ? 10 : z], await W(), await dt(l);
328
- }, X = (a) => {
329
- const m = new ye();
330
- return new be({
331
- source: m,
332
- visible: !1,
333
- // 默认隐藏
334
- className: `track-layer-${a}`,
335
- renderBuffer: 1024,
336
- properties: { layerType: re.TRACK },
337
- zIndex: 10
338
- });
339
- }, Z = (a) => {
340
- r.forEach((m, v) => {
341
- var y;
342
- const b = v === a;
343
- m.getVisible() !== b && (m.setVisible(b), e.getLayers().getArray().includes(m) || e.addLayer(m), b || (y = m.getSource()) == null || y.clear());
344
- }), l = a;
345
- }, W = async () => {
346
- const a = l;
347
- if (!r.has(a)) {
348
- const z = X(a);
349
- r.set(a, z);
350
- }
351
- await Z(a);
352
- const m = A || "", v = o[a] || [];
353
- if (!(v && v.length > 1)) return [];
354
- let b = [];
355
- b = L(a, v);
356
- const y = b.map((z) => z.centerPoint);
357
- b.length >= 2 && await G(a, y, m);
358
- }, G = (a, m, v) => {
359
- const b = new qe(m), y = r.get(a).getSource(), z = y.getFeatureById(a);
360
- if (z)
361
- z.setGeometry(b), z.setId(a), z.setStyle(_(v)), g = z;
362
- else {
363
- const N = new ue({ geometry: b });
364
- N.setId(a), N.set("type", "line"), N.setStyle(_(v)), y.addFeature(N), g = N;
365
- }
366
- return g;
367
- }, _ = (a) => new ee({
368
- stroke: new Ee({
369
- color: a,
370
- width: 2
371
- })
372
- }), u = (a, m, v) => {
373
- try {
374
- const b = a == null ? void 0 : a.get("data");
375
- if (a && b && m === "hover") {
376
- e.getTargetElement().style.cursor = b ? "pointer" : "";
377
- const y = E(b), z = v == null ? void 0 : v.coordinate;
378
- z && (s.querySelector(".popup-content"), s.innerHTML = y, w == null || w.setPosition(z));
379
- } else
380
- w && w.setPosition(void 0);
381
- } catch (b) {
382
- console.error("handleTrackMapEvent", b);
383
- }
384
- }, E = (a) => {
385
- if (!(a != null && a.time)) return;
386
- let m = "";
387
- return a != null && a.stayTime && (m = `
388
- <div class="item w-100">
389
- <div class="item-label">停泊时间约</div>
390
- <div class="item-item">${ho(Number(a.stayTime))}</div>
391
- </div>
392
- `), `
393
- <div class="track-point-popup">
394
- <div class="item">
395
- <div class="item-label">状态</div>
396
- <div class="item-item">${a != null && a.sailStatus ? Ct[a.sailStatus] : d}</div>
397
- </div>
398
- <div class="item">
399
- <div class="item-label">航速</div>
400
- <div class="item-item">${a.speed || d}</div>
401
- </div>
402
- <div class="item">
403
- <div class="item-label">艏向</div>
404
- <div class="item-item">${a.hdg || d}</div>
405
- </div>
406
- <div class="item">
407
- <div class="item-label">航向</div>
408
- <div class="item-item">${a.cog || d}</div>
409
- </div>
410
- <div class="item">
411
- <div class="item-label">经度</div>
412
- <div class="item-item">${a.lon || d}</div>
413
- </div>
414
- <div class="item">
415
- <div class="item-label">纬度</div>
416
- <div class="item-item">${a.lat || d}</div>
417
- </div>
418
- <div class="item w-100">
419
- <div class="item-label">时间</div>
420
- <div class="item-item">${a.time}</div>
421
- </div>
422
- ${m ?? m}
423
- </div>`;
424
- }, D = (a) => {
425
- const v = a.map((F) => {
426
- const O = e.getPixelFromCoordinate(ae(F.center));
427
- return {
428
- ...F,
429
- original: F,
430
- pixel: O,
431
- distance: 0
432
- // 先初始化,后续计算
433
- };
434
- });
435
- let b = 0;
436
- v[0].distance = 0;
437
- for (let F = 1; F < v.length; F++) {
438
- const O = v[F - 1].pixel, B = v[F].pixel, ne = B[0] - O[0], P = B[1] - O[1];
439
- b += Math.sqrt(ne * ne + P * P), v[F].distance = b;
440
- }
441
- const y = v.filter(
442
- (F, O) => O === 0 || O === v.length - 1
443
- ), z = [];
444
- for (let F = 0; F < y.length; F++) {
445
- const O = y[F];
446
- if (z.push(O), F < y.length - 1) {
447
- const B = y[F + 1], ne = B.distance - O.distance, P = Math.floor(ne / 100);
448
- for (let j = 1; j <= P; j++) {
449
- const Q = O.distance + j * 100;
450
- if (Q >= B.distance) break;
451
- const oe = H(
452
- v,
453
- Q
454
- );
455
- oe && z.push(oe);
456
- }
457
- }
458
- }
459
- return Array.from(
460
- new Map(z.map((F) => [F.distance.toFixed(2), F])).values()
461
- ).map((F) => ({
462
- ...F.original,
463
- // 优先保留原始数据
464
- ...F,
465
- // 覆盖坐标等计算属性
466
- coord: F.coord,
467
- // 确保使用插值后的坐标
468
- pixel: F.pixel,
469
- distance: F.distance
470
- }));
471
- };
472
- function H(a, m) {
473
- for (let v = 1; v < a.length; v++) {
474
- const b = a[v - 1], y = a[v];
475
- if (m >= b.distance && m <= y.distance) {
476
- const z = (m - b.distance) / (y.distance - b.distance), N = b.pixel[0] + z * (y.pixel[0] - b.pixel[0]), F = b.pixel[1] + z * (y.pixel[1] - b.pixel[1]), O = e == null ? void 0 : e.getCoordinateFromPixel([N, F]);
477
- return {
478
- ...b,
479
- // 继承前一个点的属性(可调整)
480
- coord: O,
481
- pixel: [N, F],
482
- distance: m,
483
- original: void 0
484
- // 明确标记为插值生成点
485
- };
486
- }
487
- }
488
- return null;
489
- }
490
- const J = async (a, m) => {
491
- const v = D(m);
492
- console.log("simplifiedPoints", v.length, "list", m.length);
493
- const b = v.map((F) => U(F)), y = v.map((F) => ve(F, A)), z = Pt(a, v, m, A);
494
- r.get(a).getSource().addFeatures([...b, ...y, ...z]);
495
- }, U = (a) => {
496
- const m = new ue({
497
- geometry: new ie(a.centerPoint),
498
- data: a
499
- });
500
- m.set("type", "track_point"), m.set("trackId", a.id), m.set("data", a);
501
- let v = [
502
- ...Ze(a, A)
503
- ];
504
- return (a.index === 0 || a.index === o[a.id].length - 1) && (v = [...Ft(a)], m.set("type", "track_begin")), a.state !== void 0 && a.state !== null && (v = [...We(a)], m.set("type", "track_icon")), m.setStyle(v), m;
505
- }, te = window.devicePixelRatio || 1, Y = /* @__PURE__ */ new Map();
506
- let S = null, se = null;
507
- function he(a, m) {
508
- const v = `${a}`;
509
- if (Y.has(v))
510
- return Y.get(v);
511
- if (!S) {
512
- S = document.createElement("canvas");
513
- try {
514
- se = S.getContext("2d", {
515
- willReadFrequently: !0
516
- });
517
- } catch (gt) {
518
- console.log("e", gt), se = S.getContext("2d");
519
- }
520
- }
521
- const b = S, y = se;
522
- if (!y) return "";
523
- b.width = 0, b.height = 0;
524
- const z = 2, N = 8, F = 16, O = window.devicePixelRatio || 1, B = "500 12px Arial";
525
- y.font = B;
526
- const P = y.measureText(a).width, j = N + P + N, Q = z + 14 + z;
527
- let oe = 0, we = 0, pe = 0, Ce = 0, Oe = 0, Fe = 0, Le = 0, Se = 0;
528
- oe = F + j, we = F + Q, pe = j, Ce = Q, Oe = j + F, Fe = 0, Le = 0, Se = F, b.width = Math.round(oe * O), b.height = Math.round(we * O), y.scale(O, O), y.clearRect(0, 0, oe, we), y.beginPath(), y.moveTo(pe, Ce), y.lineTo(Oe, Fe), y.strokeStyle = m || "#FFF", y.lineWidth = 1, y.stroke(), y.fillStyle = "#FFF", y.fillRect(Le, Se, j, Q), y.strokeStyle = m || "#FFF", y.lineWidth = 1, y.strokeRect(Le, Se, j, Q), y.font = B, y.textBaseline = "middle";
529
- const He = Se + z / 2 + Q / 2;
530
- y.strokeStyle = "#ffffff", y.lineWidth = 1, y.strokeText(a, Le + N, He), y.fillStyle = "#000000", y.fillText(a, Le + N, He);
531
- const Ye = b.toDataURL("image/png");
532
- return Y.set(v, Ye), Ye;
533
- }
534
- const ve = (a, m) => {
535
- const v = he(a.time, m), b = new ue({
536
- geometry: new ie(a.centerPoint),
537
- data: a
538
- });
539
- b.set("type", "track_point_label");
540
- const y = new ee({
541
- image: new Pe({
542
- src: v,
543
- anchor: [1, 0],
544
- displacement: [0, 0],
545
- scale: 1 / te,
546
- anchorXUnits: "fraction",
547
- anchorYUnits: "fraction"
548
- }),
549
- zIndex: 100
550
- });
551
- return b.setStyle(y), b;
552
- }, Qe = (a) => {
553
- const m = r.get(a).getSource();
554
- m.forEachFeature((v) => {
555
- v.get("type") !== "line" && m.removeFeature(v);
556
- });
557
- }, Ze = (a, m) => [
558
- new ee({
559
- // 扩大交互热区
560
- image: new Ke({
561
- stroke: new Ee({ color: "rgba(0, 0, 0, 0.01)", width: 20 }),
562
- radius: 3
563
- })
564
- }),
565
- // 轨迹点样式
566
- new ee({
567
- image: new Ke({
568
- fill: new ce({ color: m }),
569
- stroke: new Ee({ color: "#fff", width: 2 }),
570
- radius: 3
571
- })
572
- })
573
- // textStyle,
574
- ], We = (a) => {
575
- const m = "#E31818", v = "#1890FF", b = "&#xe6d2", y = new ee({
576
- text: new Ve({
577
- font: "Normal 22px map-iconfont",
578
- text: Te(b),
579
- offsetY: -10,
580
- fill: new ce({
581
- color: Number(a.state) === 0 ? m : Number(a.state) === 1 ? v : ""
582
- })
583
- }),
584
- zIndex: 99
585
- }), N = vt("&#xe6e2;"), O = vt("&#xe703;"), B = [];
586
- return Number(a.state) === 0 ? B.push(N) : Number(a.state) === 1 && B.push(O), B.push(y), B;
587
- }, Pt = (a, m, v, b) => {
588
- const y = m || [], z = m.length;
589
- z || (y.push(v[0]), y.push(v[v.length - 1]));
590
- const N = new Set(m.map((O) => `${O.centerPoint[0]},${O.centerPoint[1]}`)), F = [];
591
- for (let O = 0; O < z - 1; O++) {
592
- let B;
593
- const ne = m[O], P = (m[O + 1].index + ne.index) / 2;
594
- if (P % 2 === 0)
595
- B = v[P].centerPoint;
596
- else {
597
- const j = v[Math.floor(P)], Q = v[Math.ceil(P)];
598
- if (j && Q) {
599
- const [oe, we] = j.centerPoint, [pe, Ce] = Q.centerPoint;
600
- B = [(oe + pe) / 2, (we + Ce) / 2];
601
- }
602
- }
603
- if (B) {
604
- const j = `${B[0]},${B[1]}`;
605
- if (!N.has(j)) {
606
- const Q = new ue({
607
- geometry: new ie(B)
608
- });
609
- Q.set("type", "track_arrow"), Q.setStyle(
610
- new ee({
611
- text: new Ve({
612
- font: "700 12px map-iconfont",
613
- text: Te("&#xe6bc;"),
614
- fill: new ce({ color: b }),
615
- rotation: ut(
616
- m[O].center,
617
- m[O + 1].center
618
- ) * (Math.PI / 180)
619
- })
620
- })
621
- ), F.push(Q), N.add(j);
622
- }
623
- }
624
- }
625
- return F;
626
- }, dt = (a) => {
627
- var z, N;
628
- const m = e.getView(), v = (z = r == null ? void 0 : r.get(a)) == null ? void 0 : z.getSource(), b = g || (a ? v == null ? void 0 : v.getFeatureById(a) : null);
629
- if (!b) return;
630
- const y = (N = b == null ? void 0 : b.getGeometry()) == null ? void 0 : N.getExtent();
631
- if (!y || y[0] === y[2] || y[1] === y[3]) {
632
- console.warn("Invalid track extent");
633
- return;
634
- }
635
- try {
636
- const F = y[2] - y[0], O = y[3] - y[1], B = 1e-4;
637
- if (F < B || O < B) {
638
- const P = [(y[0] + y[2]) / 2, (y[1] + y[3]) / 2];
639
- m.setCenter(P);
640
- return;
641
- }
642
- const ne = jt(y, Math.max(F, O) * 0.1);
643
- m.fit(ne, {
644
- maxZoom: de.max,
645
- padding: [30, 30, 30, 30]
646
- // 添加边距
647
- });
648
- } catch (F) {
649
- console.error("setTrackViewCenter error:", F);
650
- }
651
- }, Ft = (a) => {
652
- const m = "&#xe69b;", y = a.index === 0 ? "#fcdc3f" : "#ff0000";
653
- return [new ee({
654
- text: new Ve({
655
- font: "Normal 14px map-iconfont",
656
- text: Te(m),
657
- fill: new ce({ color: y })
658
- }),
659
- zIndex: 101
660
- })];
661
- }, St = () => {
662
- console.log("清除所有的轨迹-----"), Ge(), r.forEach((m) => {
663
- var v;
664
- (v = m.getSource()) == null || v.clear(), e == null || e.removeLayer(m);
665
- }), Object.keys(o).forEach((m) => {
666
- r.delete(m), delete o[m];
667
- });
668
- }, Nt = (a) => {
669
- const m = r.get(a || l);
670
- m == null || m.setVisible(!1);
671
- const v = e.getOverlays().getArray();
672
- for (let b = 0; b < v.length; ) {
673
- const y = v[b];
674
- y.get("class") === "track-label-overlay" ? (y.setPosition(void 0), y.dispose()) : b++;
675
- }
676
- Ge();
677
- }, Rt = (a, m = ze.NM) => {
678
- const v = {
679
- id: a,
680
- length: "--"
681
- }, y = (o[a] || []).map(
682
- (N) => Ae([N.lon, N.lat], le.data, le.mercator)
683
- ), z = new qe(y);
684
- return v.length = go(z, m) || "--", v;
685
- }, $t = (a, m) => {
686
- Vt(String(a), m);
687
- }, Vt = (a, m) => {
688
- const v = o[String(a)], b = v == null ? void 0 : v.map((y) => [y.lon, y.lat]);
689
- b && Dt(b, m);
690
- }, Je = new ee({
691
- text: new Ve({
692
- font: "700 20px map-iconfont",
693
- text: Te("&#xe657;"),
694
- fill: new ce({ color: "#ff0000" }),
695
- rotation: 0
696
- // 初始旋转角度
697
- })
698
- }), zt = (a, m) => {
699
- var P, j;
700
- const v = Number(50 * m), b = ((P = a.frameState) == null ? void 0 : P.time) ?? Date.now(), y = b - $;
701
- if (i = (i + v * y / 1e6) % 2, $ = b, i >= 1) {
702
- Ge();
703
- return;
704
- }
705
- const z = x.getCoordinateAt(
706
- i > 1 ? 2 - i : i
707
- ), N = x.getCoordinateAt(
708
- i > 1 ? i - 0.01 : i
709
- ), F = x.getCoordinateAt(
710
- i > 1 ? 2 - i : i + 0.01
711
- ), B = ut(
712
- yt(N, "array"),
713
- yt(F, "array")
714
- ) * Math.PI / 180;
715
- (j = Je.getText()) == null || j.setRotation(B), n.setCoordinates(z);
716
- const ne = Kt(a);
717
- ne.setStyle(Je), ne.drawGeometry(n), e == null || e.render();
718
- }, Ot = () => {
719
- var a;
720
- M = !0, $ = Date.now(), i = 0, n = ((a = t.getGeometry()) == null ? void 0 : a.clone()) || new ie([0, 0]), c && (V == null || V.on("postrender", c)), f == null || f.setGeometry(void 0);
721
- }, Ge = () => {
722
- M && (M = !1, f == null || f.setGeometry(void 0), c && V && V.un("postrender", c), V && (e == null || e.removeLayer(V)), V = null, f = null);
723
- }, Dt = (a, m) => {
724
- M && Ge(), k = new ht({
725
- factor: 1e6
726
- }).writeGeometry(new qe(a)), x = new ht({
727
- factor: 1e6
728
- }).readGeometry(k, {
729
- dataProjection: le.data,
730
- featureProjection: le.mercator
731
- }), t = new ue({
732
- type: "icon",
733
- geometry: new ie(x.getFirstCoordinate())
734
- });
735
- const v = t.getGeometry();
736
- n = v ? v.clone() : new ie([0, 0]), f = new ue({
737
- type: "geoMarker",
738
- style: Je,
739
- geometry: n
740
- }), V = new be({
741
- source: new ye({
742
- features: [f]
743
- })
744
- }), e == null || e.addLayer(V), c = (b) => zt(b, m), Ot();
745
- }, ut = (a, m, v) => {
746
- function b(P) {
747
- return 180 * (P % (2 * Math.PI)) / Math.PI;
748
- }
749
- function y(P) {
750
- return P % 360 * Math.PI / 180;
751
- }
752
- function z(P) {
753
- var j;
754
- if (!P) throw new Error("Coordinate is required");
755
- if (!Array.isArray(P)) {
756
- if ((P == null ? void 0 : P.type) === "Feature" && (P == null ? void 0 : P.geometry) !== null && ((j = P == null ? void 0 : P.geometry) == null ? void 0 : j.type) === "Point")
757
- return P == null ? void 0 : P.geometry.coordinates;
758
- if (P.type === "Point") return (P == null ? void 0 : P.coordinates) || [];
759
- }
760
- if (Array.isArray(P) && P.length >= 2 && !Array.isArray(P[0]) && !Array.isArray(P[1]))
761
- return P;
762
- throw new Error(
763
- "Coordinate must be GeoJSON Point or an Array of numbers"
764
- );
765
- }
766
- function N(P, j, Q = {}) {
767
- if (Q.final)
768
- return function(He, Ye) {
769
- return (N(Ye, He) + 180) % 360;
770
- }(P, j);
771
- const oe = z(P), we = z(j), pe = y(oe[0]), Ce = y(we[0]), Oe = y(oe[1]), Fe = y(we[1]), Le = Math.sin(Ce - pe) * Math.cos(Fe), Se = Math.cos(Oe) * Math.sin(Fe) - Math.sin(Oe) * Math.cos(Fe) * Math.cos(Ce - pe);
772
- return b(Math.atan2(Le, Se));
773
- }
774
- function F(P) {
775
- return !isNaN(P) && P !== null && !Array.isArray(P);
776
- }
777
- function O(P, j = {}, Q = {}) {
778
- return P || console.log("Coordinates are required"), Array.isArray(P) || console.log("Coordinates must be an Array"), P.length < 2 && console.log("Coordinates must be at least 2 numbers long"), (!F(P[0]) || !F(P[1])) && console.log("Coordinates must contain numbers"), B({ type: "Point", coordinates: P }, j, Q);
779
- }
780
- function B(P, j = {}, Q = {}) {
781
- const oe = {
782
- type: "Feature",
783
- id: "",
784
- properties: {},
785
- bbox: {},
786
- geometry: {}
787
- };
788
- return Q.id !== void 0 && (oe.id = Q.id), Q.bbox && (oe.bbox = Q.bbox), oe.properties = j, oe.geometry = P, oe;
789
- }
790
- const ne = N(O(a), O(m), v);
791
- return ne < 0 ? 360 + ne : ne;
792
- };
793
- return {
794
- render: R,
795
- remove: St,
796
- play: $t,
797
- setCenter: dt,
798
- close: Nt,
799
- getLength: Rt,
800
- handleTrackMapEvent: u,
801
- reRenderTrackLine: I,
802
- getTrackStatus: T
803
- };
804
- };
805
- function yo(e) {
806
- console.log("useShipOverlay", e);
807
- const r = fe(null), o = Be(() => ({
808
- "--overlay-color": "#FFF",
809
- "--bg-color1": e.colors && e.colors[0] ? e.colors[0] : "#ffffff",
810
- // 默认第一个颜色
811
- "--bg-color2": e.colors && e.colors[1] ? e.colors[1] : "#ffffff",
812
- "--bg-color": "#ffffff",
813
- position: "relative",
814
- "pointer-events": "none"
815
- })), l = Be(() => {
816
- var s;
817
- return {
818
- position: "relative",
819
- "border-radius": "1px",
820
- "background-color": "var(--content-bg)",
821
- color: "#000",
822
- padding: "2px 5px 2px 0px",
823
- font: "500 Normal 12px",
824
- "font-size": "12px",
825
- "box-shadow": "0 2px 10px rgba(0, 0, 0, 0.2)",
826
- "white-space": "nowrap",
827
- border: "1px solid #FFF",
828
- "pointer-events": "auto",
829
- // 'transition': 'background-color 0.5s ease, border 0.5s ease',
830
- "z-index": "1",
831
- display: "flex",
832
- "align-items": "center",
833
- animation: e.selected ? e.colors && ((s = e.colors) == null ? void 0 : s.length) >= 2 ? "blink-dual 2s ease-in-out infinite" : "blink-single 1.5s ease-in-out infinite" : "none"
834
- // "animation": props.selected ? 'blink 1.5s ease-in-out infinite' : 'none', // 动画开关
835
- };
836
- }), d = Be(() => ({
837
- width: "14px",
838
- height: "14px",
839
- margin: "1px 5px 1px 1px",
840
- "background-color": "var(--attention-bg)"
841
- })), c = Be(() => ({
842
- position: "absolute",
843
- top: "0px",
844
- color: "var(--overlay-color)",
845
- "pointer-events": "none",
846
- transform: "translateY(-1px)",
847
- "z-index": "0",
848
- width: "20px",
849
- height: "20px",
850
- overflow: "visible",
851
- left: "-20px"
852
- }));
853
- return () => me("div", {
854
- ref: r,
855
- class: "ship-overlay-container",
856
- style: o.value
857
- }, [
858
- me(
859
- "div",
860
- {
861
- class: "ship-overlay-content",
862
- style: l.value
863
- },
864
- [
865
- me("div", {
866
- style: e.selected ? d.value : {}
867
- }, ""),
868
- me("div", {
869
- class: "text",
870
- style: {
871
- fontSize: "12px",
872
- fontWeight: 500,
873
- fontFamily: "Arial"
874
- }
875
- }, e.name || "未命名船舶"),
876
- me("div", {
877
- class: "icons",
878
- style: {
879
- color: "#3370ff"
880
- }
881
- }, [
882
- e.existDevice ? me("i", {
883
- class: "map-iconfont icon-camera",
884
- style: {
885
- fontSize: "12px"
886
- }
887
- }) : "",
888
- e.existMobile ? me("i", {
889
- class: "map-iconfont icon-tele",
890
- style: {
891
- fontSize: "12px"
892
- }
893
- }) : "",
894
- e.existWaterGauge ? me("i", {
895
- class: "map-iconfont icon-ruler",
896
- style: {
897
- fontSize: "12px"
898
- }
899
- }) : ""
900
- ])
901
- ]
902
- ),
903
- me("svg", {
904
- class: "ship-overlay-line",
905
- style: c.value,
906
- viewBox: "0 0 20 20",
907
- xmlns: "http://www.w3.org/2000/svg"
908
- }, [
909
- me("line", {
910
- x1: "0",
911
- y1: "20",
912
- x2: "20",
913
- y2: "4",
914
- stroke: "white",
915
- "stroke-width": "1"
916
- })
917
- ])
918
- ]);
919
- }
920
- const wo = (e) => {
921
- const { spd: r, hdg: o, cog: l } = e;
922
- return r ? o !== null && +o != 511 && l !== null ? l - +o >= 3 ? ge.right : l - +o <= -3 ? ge.left : ge.front : ge.front : "";
923
- }, Ne = (e, r) => {
924
- const { shipData: o } = r.getProperties(), l = Lt(e), d = Mt(e, o, l);
925
- return xo(r, d, l);
926
- }, Lt = (e) => {
927
- const r = e == null ? void 0 : e.getView().getZoom();
928
- return r && r <= de.shipModelMax && r >= de.shipTriggleMin ? "ship" : "triangle";
929
- }, Mt = (e, r, o) => {
930
- if (o === "ship") {
931
- const { len: l, wid: d } = r, c = 97, s = 20, k = 1 / (e == null ? void 0 : e.getView().getResolution()), x = l * k / c, t = d * k / s, n = Math.min(x, t);
932
- return n < 0.2 ? 0.2 : n > 2 ? 2 : n;
933
- }
934
- return de.scaleNum;
935
- }, xo = (e, r, o) => {
936
- const { color: l, direct: d, isHighlight: c, shipData: s } = e.getProperties(), w = ((s == null ? void 0 : s.cog) - 90 + 360) % 360;
937
- return new ee({
938
- image: new Pe({
939
- src: k(),
940
- scale: r || de.scaleNum,
941
- anchor: [0.5, 0.5],
942
- rotation: w * Math.PI / 180,
943
- rotateWithView: !1
944
- })
945
- });
946
- function k() {
947
- return `data:image/svg+xml;utf8,${encodeURIComponent(x())}`;
948
- }
949
- function x() {
950
- switch (o) {
951
- case "triangle":
952
- return `<svg width="41" height="24" viewBox="0 0 41 24" fill="none" xmlns="http://www.w3.org/2000/svg">
953
- <path d="M30.8843 12.6777L2.21343 21.7067C1.75559 21.8509 1.28947 21.509 1.28947 21.029L1.28947 2.97103C1.28947 2.49102 1.75558 2.14913 2.21342 2.29331L30.8843 11.3223C31.5471 11.531 31.5471 12.469 30.8843 12.6777Z"
954
- fill="${l}" stroke="${c ? "#FF2424" : "black"}" stroke-width="${c ? "2" : "0.578947"}" />
955
- <!--path船航向左边或者向前-->
956
- ${d === ge.left && `<path d="M30 12L40 12L40 8" stroke="${c ? "#FF2424" : "black"}" stroke-width="2"/>`}
957
- <!--path船航向右边-->
958
- ${d === ge.right && `<path d="M30 12L40 12L40 16" stroke="${c ? "#FF2424" : "black"}" stroke-width="2"/>`}
959
- <!--path黑线无左右-->
960
- ${d === ge.front && `<path d="M30 12L40 12" stroke="${c ? "#FF2424" : "black"}" stroke-width="1.5"/>`}
961
- </svg>
962
- `;
963
- case "ship":
964
- return `<svg width="97" height="20" viewBox="0 0 97 20" fill="none" xmlns="http://www.w3.org/2000/svg">
965
- <path d="M0.289474 17.3433L0.289474 2.65655C0.289474 2.28572 0.574654 1.97725 0.944343 1.9482L22.0544 0.289473L67.5204 0.289473C67.6295 0.289473 67.7372 0.314613 67.835 0.362943L86.0565 9.3629C86.5844 9.6236 86.5844 10.3763 86.0565 10.637L67.835 19.6371C67.7372 19.6854 67.6295 19.7105 67.5203 19.7105L22.0544 19.7105L0.944343 18.0517C0.574653 18.0226 0.289474 17.7142 0.289474 17.3433Z"
966
- fill="${l}" stroke="${c ? "#FF2424" : "black"}" stroke-width="${c ? "4" : "0.578947"}"/>
967
- ${d === ge.left && `<path d="M86 10L96 10L96 6" stroke="${c ? "#FF2424" : "black"}" stroke-width="1.5"/>`}
968
- ${d === ge.right && `<path d="M86 10L96 10L96 14" stroke="${c ? "#FF2424" : "black"}" stroke-width="1.5"/>`}
969
- ${d === ge.front && `<path d="M86 10L96 10" stroke="${c ? "#FF2424" : "black"}" stroke-width="1.5"/>`}
970
- </svg>
971
- `;
972
- default:
973
- return "";
974
- }
975
- }
976
- }, bo = (e, r) => {
977
- const o = Lt(e), l = Mt(e, r, o), d = o === "ship" ? 109 : 49, c = `
978
- <svg xmlns="http://www.w3.org/2000/svg" width="${d}" height="${d}" viewBox="0 0 49 49" fill="none">
979
- <path d="M1.99982 46.9998L1.99982 1.99982L46.9998 1.99982L46.9998 46.9998L1.99982 46.9998Z" fill="#FF2424" fill-opacity="0.2"/>
980
- <path fill-rule="evenodd" clip-rule="evenodd" d="M19.9998 0.5V3.5L3.49976 3.5V20H0.499756V0.500002L19.9998 0.5ZM45.4998 3.5H28.9998V0.5H48.4998V20H45.4998V3.5ZM48.4998 29L48.4998 48.5H28.9998V45.5H45.4998L45.4998 29H48.4998ZM3.49976 45.5L3.49976 29H0.499756L0.499758 48.5L19.9998 48.5V45.5L3.49976 45.5Z" fill="#FF2424"/>
981
- </svg>
982
- `;
983
- return new ee({
984
- image: new Pe({
985
- src: `data:image/svg+xml;utf8,${encodeURIComponent(c)}`,
986
- scale: l,
987
- anchorXUnits: "fraction",
988
- anchorYUnits: "fraction"
989
- })
990
- });
991
- };
992
- function ko(e, r, o, l) {
993
- if (r) {
994
- const d = new xe({
995
- element: o,
996
- positioning: "top-left",
997
- id: "label-" + (l == null ? void 0 : l.id),
998
- offset: [20, -20],
999
- autoPan: !1,
1000
- position: r,
1001
- className: l != null && l.blinking ? "ship-label-overlay-blinking" : "ship-label-overlay"
1002
- });
1003
- d.set("class", "zh-map-ship-overlay"), e.addOverlay(d);
1004
- }
1005
- }
1006
- const po = (e, r) => {
1007
- const { lon: o, lat: l, blinking: d } = r, c = Tt(r);
1008
- o && l && ko(e, ae([o, l]), c, { ...r, blinking: d });
1009
- }, Tt = (e) => {
1010
- const r = document.createElement("div");
1011
- r.className = "ship-overlay-box", r.style.position = "relative";
1012
- const { lon: o, lat: l, blinking: d, blinkingColors: c, name: s } = e, w = tt({
1013
- setup() {
1014
- return yo({
1015
- position: [o + 2e-3, l + 2e-3],
1016
- selected: d,
1017
- name: s,
1018
- colors: c || [],
1019
- existDevice: e == null ? void 0 : e.existDevice,
1020
- existMobile: e == null ? void 0 : e.existMobile,
1021
- existWaterGauge: e == null ? void 0 : e.existWaterGauge
1022
- });
1023
- }
1024
- });
1025
- return At(w, r), r;
1026
- }, wt = (e) => {
1027
- const r = [];
1028
- return e.existDevice && r.push("&#xe687;"), e.existMobile && r.push("&#xe688;"), e.existWaterGauge && r.push("&#xe686;"), r;
1029
- };
1030
- function Co() {
1031
- const e = [
1032
- "left-top",
1033
- "left-middle",
1034
- "left-bottom",
1035
- "right-top",
1036
- "right-middle",
1037
- "right-bottom"
1038
- ];
1039
- return e[Math.floor(Math.random() * e.length)];
1040
- }
1041
- const Lo = window.devicePixelRatio || 1, Ue = /* @__PURE__ */ new Map();
1042
- let De = null, Ie = null;
1043
- function Mo(e, r, o = "left-bottom", l = 10) {
1044
- const d = `${e}-${r.join(",")}-${o}-${l}`;
1045
- if (Ue.has(d))
1046
- return Ue.get(d);
1047
- if (!De) {
1048
- De = document.createElement("canvas");
1049
- try {
1050
- Ie = De.getContext("2d", {
1051
- willReadFrequently: !0
1052
- });
1053
- } catch (_) {
1054
- console.log("e", _), Ie = De.getContext("2d");
1055
- }
1056
- }
1057
- const c = De, s = Ie;
1058
- if (!s) return "";
1059
- c.width = 0, c.height = 0;
1060
- const w = 2, k = 4, x = 16, t = window.devicePixelRatio || 1, n = "500 12px Arial", f = "12px map-iconfont";
1061
- s.font = n;
1062
- const $ = s.measureText(e).width;
1063
- s.font = f;
1064
- const V = r.map((_) => ({ width: s.measureText(Te(_)).width, height: 14 })), i = V.reduce((_, u) => _ + u.width, 0), g = r.length * l, p = k + $ + i + g + k, h = w + 14 + w * 2;
1065
- let C, q, A = 0, K = 0, I = 0, T = 0, L = 0, R = 0;
1066
- switch (C = x + p, o) {
1067
- case "right-top":
1068
- q = x + h, A = 0, K = x + h, I = x, T = 0, L = x, R = 0;
1069
- break;
1070
- case "right-middle":
1071
- q = h, A = 0, K = h / 2, I = x, T = h / 2, L = x, R = 0;
1072
- break;
1073
- case "right-bottom":
1074
- q = x + h, A = 0, K = 0, I = x, T = x, L = x, R = x;
1075
- break;
1076
- case "left-top":
1077
- q = x + h, A = p, K = x, I = p + x, T = h + x, L = 0, R = 0;
1078
- break;
1079
- case "left-middle":
1080
- q = h, A = p, K = h / 2, I = p + x, T = h / 2, L = 0, R = 0;
1081
- break;
1082
- case "left-bottom":
1083
- q = x + h, A = p, K = h, I = p + x, T = 0, L = 0, R = x;
1084
- break;
1085
- }
1086
- q = q + w, c.width = Math.round(C * t), c.height = Math.round(q * t), s.scale(t, t), s.clearRect(0, 0, C, q), s.beginPath(), s.moveTo(A, K), s.lineTo(I, T), s.strokeStyle = "#FFF", s.lineWidth = 1, s.stroke(), s.fillStyle = "#FFF", s.fillRect(L, R, p, h), s.font = n, s.textBaseline = "middle";
1087
- const X = R + w / 2 + h / 2;
1088
- s.strokeStyle = "#ffffff", s.lineWidth = 1, s.strokeText(e, L + k, X), s.fillStyle = "#000000", s.fillText(e, L + k, X), s.font = f, s.fillStyle = "#3370ff";
1089
- let Z = L + k + $ + l;
1090
- const W = R + h / 2;
1091
- r.length > 0 && r.forEach((_, u) => {
1092
- s.fillText(Te(_), Z, W), Z += V[u].width + l;
1093
- });
1094
- const G = c.toDataURL("image/png");
1095
- return Ue.set(d, G), G;
1096
- }
1097
- const xt = (e, r) => {
1098
- const { name: o, rightIcons: l, selected: d } = e.getProperties(), c = r !== 1 ? Co() : "right-top", s = Mo(o, l, c);
1099
- let w = [0, 0];
1100
- switch (c) {
1101
- case "right-top":
1102
- w = [0, 1];
1103
- break;
1104
- case "right-middle":
1105
- w = [0, 0.5];
1106
- break;
1107
- case "right-bottom":
1108
- w = [0, 0];
1109
- break;
1110
- case "left-top":
1111
- w = [1, 1];
1112
- break;
1113
- case "left-middle":
1114
- w = [1, 0.5];
1115
- break;
1116
- case "left-bottom":
1117
- w = [1, 0];
1118
- break;
1119
- }
1120
- return new ee({
1121
- image: new Pe({
1122
- src: s,
1123
- anchor: w,
1124
- displacement: [0, 0],
1125
- scale: 1 / Lo,
1126
- anchorXUnits: "fraction",
1127
- anchorYUnits: "fraction"
1128
- }),
1129
- zIndex: d ? 100 : 10
1130
- });
1131
- }, To = (e) => {
1132
- let r = null, o = null;
1133
- const l = new ye(), d = new _t({
1134
- source: l,
1135
- className: "zh-map--ship-layer",
1136
- renderBuffer: 300,
1137
- zIndex: 101,
1138
- properties: { layerType: re.SHIP }
1139
- }), c = new ye(), s = new be({
1140
- source: c,
1141
- className: "zh-map--ship-label-layer",
1142
- zIndex: 102,
1143
- updateWhileInteracting: !1,
1144
- updateWhileAnimating: !1,
1145
- properties: { layerType: re.SHIP },
1146
- declutter: !0
1147
- }), w = new ye(), k = new be({
1148
- source: w,
1149
- className: "zh-map--ship-selected-layer",
1150
- zIndex: 999
1151
- });
1152
- e == null || e.addLayer(d), e == null || e.addLayer(s), e == null || e.addLayer(k);
1153
- let x = null, t = null, n = null, f = null, M = "", $ = {}, V = {};
1154
- const i = (u) => {
1155
- if (!u || !e) return;
1156
- const E = (o == null ? void 0 : o.id) || (r == null ? void 0 : r.get("id"));
1157
- if (o) {
1158
- const D = u.filter((H) => H.id === E);
1159
- D.length === 0 ? u.push(o) : o = D[0];
1160
- }
1161
- C(), W(u), p();
1162
- }, g = (u) => {
1163
- var S;
1164
- const E = (o == null ? void 0 : o.id) || (r == null ? void 0 : r.get("id")), D = ae([u == null ? void 0 : u.lon, u == null ? void 0 : u.lat]), H = ((S = V[u.id]) == null ? void 0 : S.blinkColors) || [], U = H[H.length - 1] || u.fill || "#04C900", te = wo(u), Y = new ue({
1165
- geometry: new ie(D),
1166
- // 船舶数据
1167
- shipData: u,
1168
- id: u.id,
1169
- name: u.cnname || u.enname || u.name || u.id || "未命名船舶",
1170
- selected: u.id === E,
1171
- // 图标
1172
- rightIcons: wt(u),
1173
- // 船舶颜色
1174
- color: U,
1175
- // 船艏向的方向
1176
- direct: te,
1177
- // 高亮
1178
- isHighlight: !1
1179
- });
1180
- return Y.set("clickGeometry", new Jt(D)), Y;
1181
- }, p = () => {
1182
- if (o && e && o) {
1183
- w.getFeatures().length > 0 && w.clear();
1184
- const u = ae([o == null ? void 0 : o.lon, o == null ? void 0 : o.lat]), E = new ue({
1185
- geometry: new ie(u),
1186
- id: o.id
1187
- });
1188
- setTimeout(() => {
1189
- E.setStyle(bo(e, o)), w.addFeature(E);
1190
- }, 300);
1191
- }
1192
- }, h = (u) => {
1193
- if (u === "start") {
1194
- const E = () => {
1195
- const D = w.getFeatures();
1196
- l.getFeatures().forEach((H) => {
1197
- var U, te;
1198
- const J = Ne(e, H);
1199
- if (H.setStyle(J), H.get("id") === (o == null ? void 0 : o.id) && D && D[0]) {
1200
- const Y = D[0], S = Y == null ? void 0 : Y.getStyle();
1201
- if (S && (S != null && S.getImage())) {
1202
- const se = (U = J.getImage()) == null ? void 0 : U.getScale();
1203
- se && ((te = S.getImage()) == null || te.setScale(se));
1204
- }
1205
- }
1206
- }), f = requestAnimationFrame(E);
1207
- };
1208
- E();
1209
- }
1210
- u === "end" && f && (cancelAnimationFrame(f), f = null);
1211
- }, C = () => {
1212
- e && l && (q(), l.clear(), c.clear(), w.clear(), h("end"));
1213
- }, q = () => {
1214
- const u = e.getOverlays().getArray().filter((E) => E.get("class") == "zh-map-ship-overlay");
1215
- if (u && u.length > 0)
1216
- for (let E = 0; E < u.length; E++) {
1217
- const D = u[E];
1218
- D.setPosition(void 0), e.removeOverlay(D), D.dispose();
1219
- }
1220
- }, A = (u, E) => {
1221
- $ = u, V = E;
1222
- const D = e.getOverlays().getArray(), H = l.getFeatures();
1223
- for (const J in $) {
1224
- const U = $[J], te = D.find((S) => (S == null ? void 0 : S.getId()) === "label-" + J), Y = H.find((S) => J === S.get("id"));
1225
- if (te && Y) {
1226
- const S = E[J].blinkColors || [], { shipData: se, name: he, color: ve } = Y.getProperties();
1227
- Y.set("blinking", U), S[(S == null ? void 0 : S.length) - 1] && ve !== S[(S == null ? void 0 : S.length) - 1] && (Y.set("color", S[(S == null ? void 0 : S.length) - 1] || ""), Y.setStyle(Ne(e, Y)));
1228
- const Qe = {
1229
- ...se,
1230
- blinking: U,
1231
- blinkingColors: S || [],
1232
- name: he + "(" + E[J].shipState + ")"
1233
- }, Ze = te.getElement(), We = Tt(Qe);
1234
- Ze && Ze !== We && te.setElement(We);
1235
- }
1236
- }
1237
- }, K = (u) => {
1238
- if (!e) return;
1239
- const E = l.getFeatures(), D = c.getFeatures(), H = r ? r.get("id") : "", J = E.filter((S) => S.get("id") !== H), U = D == null ? void 0 : D.filter((S) => S.get("id") !== H), te = /* @__PURE__ */ new Map();
1240
- u.forEach((S) => {
1241
- te.set(S.id, !0);
1242
- });
1243
- const Y = e.getOverlays().getArray();
1244
- J.forEach((S) => {
1245
- const se = S.get("id");
1246
- if (!te.has(se))
1247
- S.setStyle([]);
1248
- else {
1249
- const ve = S.getStyle();
1250
- (ve == null ? void 0 : ve.length) == 0 && S.setStyle(Ne(e, S));
1251
- }
1252
- const he = Y.find((ve) => ve.getId() === "label-" + se);
1253
- he && he.setPosition(void 0);
1254
- }), U.forEach((S) => {
1255
- const se = S.get("id");
1256
- if (!te.has(se))
1257
- S.setStyle([]);
1258
- else {
1259
- const he = S.getStyle();
1260
- (he == null ? void 0 : he.length) == 0 && S.setStyle(xt(S, u.length));
1261
- }
1262
- });
1263
- }, I = (u) => {
1264
- if (u) {
1265
- console.log("选中", u);
1266
- const E = l.getFeatures().find((H) => H.get("id") === u.id), D = c.getFeatures().find((H) => H.get("id") === u.id);
1267
- E && (r = E), D && D.set("selected", !0), o = u, p();
1268
- } else
1269
- console.log("取消选中"), o = null, r = null, X();
1270
- }, T = (u, E, D) => {
1271
- t = u, n = E, x = D, console.log("setShipLabelStatus", x, t, n);
1272
- }, L = Qt((u, E, D) => {
1273
- try {
1274
- if (u) {
1275
- const H = u.get("shipData"), J = u.get("id");
1276
- if (E === "click" && (I(H), D && D(J)), E === "hover") {
1277
- M && M !== J && R(), M = J;
1278
- const U = l.getFeatures().find((te) => te.get("id") === M);
1279
- U == null || U.set("isHighlight", !0), U == null || U.setStyle(Ne(e, U));
1280
- }
1281
- } else
1282
- R();
1283
- } catch (H) {
1284
- console.log("handleShipMapEvent", H);
1285
- }
1286
- }, 10), R = () => {
1287
- const u = M ? l.getFeatures().find((E) => E.get("id") === M) : null;
1288
- M = null, u == null || u.set("isHighlight", !1), u == null || u.setStyle(Ne(e, u));
1289
- }, X = () => {
1290
- try {
1291
- w.clear();
1292
- } catch (u) {
1293
- console.log(u);
1294
- }
1295
- }, Z = (u, E) => {
1296
- const D = ae([u == null ? void 0 : u.lon, u == null ? void 0 : u.lat]), H = new ue({
1297
- geometry: new ie(D),
1298
- name: u.cnname || u.enname || u.name || u.id || "未命名船舶",
1299
- // 图标
1300
- rightIcons: wt(u),
1301
- selected: (u == null ? void 0 : u.id) === (o == null ? void 0 : o.id),
1302
- shipData: u
1303
- });
1304
- H.set("id", u.id);
1305
- const J = xt(H, E);
1306
- return H.setStyle(J), H;
1307
- }, W = (u) => {
1308
- const E = e.getView().getZoom(), D = [], H = [];
1309
- u.forEach((Y) => {
1310
- const S = g(Y);
1311
- S.setStyle(Ne(e, S)), l.addFeature(S), $[Y.id] && D.push(Y), (o == null ? void 0 : o.id) == Y.id && (o = Y), !$[Y.id] && (o == null ? void 0 : o.id) !== Y.id && H.push(Y);
1312
- }), (n !== null ? n : (o == null ? void 0 : o.id) && $[o == null ? void 0 : o.id] || E && E >= de.shipModelMin) && D.map((Y) => {
1313
- _(Y);
1314
- }), o && (x !== null ? x : !0) && !$[o == null ? void 0 : o.id] && G(o, u), (t !== null ? t : E && E >= de.shipModelMin) && H.map((Y) => {
1315
- G(Y, u);
1316
- });
1317
- }, G = (u, E) => {
1318
- const D = Z(u, E.length);
1319
- c.addFeature(D);
1320
- }, _ = (u) => {
1321
- if (u.id && V[u == null ? void 0 : u.id]) {
1322
- const E = V[u == null ? void 0 : u.id] || {}, D = (E == null ? void 0 : E.blinkColors) || [], H = (E == null ? void 0 : E.shipState) || "", J = (u.cnname || u.enname || u.name || u.id || "未命名船舶") + "(" + H + ")", U = {
1323
- ...u,
1324
- name: J,
1325
- blinking: $[u.id],
1326
- blinkingColors: D || []
1327
- };
1328
- po(e, U);
1329
- }
1330
- };
1331
- return {
1332
- render: i,
1333
- selected: I,
1334
- filter: K,
1335
- blinking: A,
1336
- clear: C,
1337
- setLableStatus: T,
1338
- handleShipMapEvent: L,
1339
- changeShipScale: h
1340
- };
1341
- }, Eo = (e) => {
1342
- const r = () => e == null ? void 0 : e.getLayers(), o = fe("vector"), l = () => o.value, d = (k) => {
1343
- o.value = k;
1344
- const x = r();
1345
- x && (x == null || x.getArray().forEach((t) => {
1346
- (t.className_ === "vector" || t.className_ === "satellite") && t.setVisible(t.className_ === k);
1347
- }));
1348
- }, c = fe(!1);
1349
- return {
1350
- getLayers: r,
1351
- getGreenTileVisible: () => c.value,
1352
- setGreenTileVisible: (k) => {
1353
- if (k !== c.value) {
1354
- if (k) {
1355
- const x = r();
1356
- if (!x.getArray().find((n) => n.className_ === "greenTile")) {
1357
- const n = new Re({
1358
- source: new $e({ url: Me.greenTile }),
1359
- visible: k,
1360
- zIndex: 2,
1361
- className: "greenTile"
1362
- });
1363
- x.push(n);
1364
- }
1365
- } else {
1366
- const x = r(), t = x.getArray().find((n) => n.className_ === "greenTile");
1367
- t && x.remove(t);
1368
- }
1369
- c.value = k;
1370
- }
1371
- },
1372
- getShowLayerType: l,
1373
- setShowLayerType: d
1374
- };
1375
- }, Po = () => {
1376
- const e = fe();
1377
- return {
1378
- setProps: (l) => {
1379
- e.value = l;
1380
- },
1381
- getProps: () => e.value
1382
- };
1383
- }, Fo = (e) => {
1384
- const r = "zh-map-location-layer";
1385
- let o;
1386
- const l = new ye();
1387
- let d = null, c = null;
1388
- const s = (i) => {
1389
- if (!(!i || i.length === 0)) {
1390
- if (l.clear(), c) {
1391
- const g = i.find((p) => p.id === (c == null ? void 0 : c.id));
1392
- g ? c = g : i.push(c);
1393
- }
1394
- i.forEach((g) => {
1395
- w(g);
1396
- }), o || (o = new be({
1397
- className: r,
1398
- source: l,
1399
- zIndex: 100
1400
- }), e == null || e.addLayer(o));
1401
- }
1402
- }, w = (i) => {
1403
- const g = e == null ? void 0 : e.getView().getZoom(), [p, h] = i.latLon.split(","), C = new ue({
1404
- geometry: new ie(ae([Number(p), Number(h)]))
1405
- });
1406
- C.setStyle(k(i, g, i.id === (c == null ? void 0 : c.id))), C.set("loactionData", i), l.addFeature(C);
1407
- }, k = (i, g, p) => {
1408
- let h = {
1409
- src: p && i.selectedPath || i.defaultPath
1410
- };
1411
- i != null && i.width && (i != null && i.height) ? h = {
1412
- ...h,
1413
- width: i.width,
1414
- height: i.height
1415
- } : h = {
1416
- ...h,
1417
- scale: 0.5 * g / 10
1418
- };
1419
- let C = {
1420
- image: new Pe(h)
1421
- };
1422
- return i.name && (C = {
1423
- ...C,
1424
- text: new Ve({
1425
- text: i.name,
1426
- font: "12px sans-serif",
1427
- fill: new ce({
1428
- color: "#000000"
1429
- }),
1430
- backgroundFill: new ce({
1431
- color: "#FFFFFF"
1432
- }),
1433
- offsetY: 30
1434
- })
1435
- }), new ee(C);
1436
- }, x = () => {
1437
- if (d) {
1438
- const i = d.get("loactionData").id;
1439
- l.getFeatures().forEach((g) => {
1440
- g.get("loactionData").id !== i && l.removeFeature(g);
1441
- });
1442
- } else
1443
- l.clear();
1444
- }, t = () => {
1445
- var h;
1446
- const i = d == null ? void 0 : d.get("loactionData"), g = (h = e == null ? void 0 : e.getView()) == null ? void 0 : h.getZoom();
1447
- l.getFeatures().forEach((C) => {
1448
- C.get("loactionData").id === i.id && (C == null || C.setStyle(k(i, g, !1)));
1449
- }), c = null, d = null;
1450
- }, n = (i) => {
1451
- i ? (f(), M(i)) : t();
1452
- }, f = () => {
1453
- var i;
1454
- if (d) {
1455
- const g = d.get("loactionData"), p = (i = e == null ? void 0 : e.getView()) == null ? void 0 : i.getZoom();
1456
- d.setStyle(k(g, p, !1));
1457
- }
1458
- }, M = (i) => {
1459
- const g = l.getFeatures();
1460
- c = i, d = g.find((p) => p.get("loactionData").id === i.id);
1461
- };
1462
- return {
1463
- render: s,
1464
- renderHtml: (i, g, p, h) => {
1465
- const C = document.createElement("div");
1466
- C.innerHTML = p;
1467
- let q = {
1468
- element: C,
1469
- // 覆盖层的DOM元素
1470
- positioning: "top-center",
1471
- // 相对于位置点的定位
1472
- stopEvent: !1,
1473
- // 是否阻止事件传播
1474
- offset: [0, -20],
1475
- id: "position-" + i
1476
- };
1477
- h && (q = {
1478
- ...q,
1479
- ...h
1480
- });
1481
- const A = new xe(q);
1482
- A.setPosition(ae(g)), e.addOverlay(A);
1483
- },
1484
- removeHtml: (i) => {
1485
- const g = e.getOverlays().getArray().find((p) => p.getId() === "position-" + i);
1486
- g && (g.setPosition(void 0), e.removeOverlay(g));
1487
- },
1488
- selected: n,
1489
- clearSelected: t,
1490
- clear: x
1491
- };
1492
- }, So = (e) => {
1493
- e.getInteractions().forEach((r) => {
1494
- r instanceof st && r.setActive(!1);
1495
- });
1496
- }, No = (e) => {
1497
- e.getInteractions().forEach((r) => {
1498
- r instanceof st && r.setActive(!0);
1499
- });
1500
- }, ke = (e, r) => {
1501
- const o = e.getViewport();
1502
- o && (o.style.cursor = r);
1503
- }, Ro = (e, r) => {
1504
- const o = fe([]), l = fe("km"), d = (T) => {
1505
- l.value = T;
1506
- };
1507
- let c, s = "close";
1508
- const w = () => {
1509
- ke(e, "crosshair"), t(), So(e), e.on("pointermove", M), e.getViewport().addEventListener("mouseout", () => {
1510
- c && c.classList.add("hidden");
1511
- }), V(), s = "open";
1512
- };
1513
- let k, x;
1514
- const t = () => {
1515
- k = new ye(), x = new be({
1516
- source: k,
1517
- zIndex: 1e3,
1518
- style: {
1519
- "fill-color": "rgba(255, 255, 255, 0.2)",
1520
- "stroke-color": "#ffcc33",
1521
- "stroke-width": 2,
1522
- "circle-radius": 7,
1523
- "circle-fill-color": "#ffcc33"
1524
- }
1525
- }), e == null || e.addLayer(x);
1526
- };
1527
- let n, f;
1528
- const M = (T) => {
1529
- if (T.dragging)
1530
- return;
1531
- let L = "点击选择起点";
1532
- n && (L = "单击继续,双击结束"), c && (c.innerHTML = L, f.setPosition(T.coordinate), c.classList.remove("hidden"));
1533
- };
1534
- let $;
1535
- const V = () => {
1536
- $ = new je({
1537
- source: k,
1538
- type: "LineString",
1539
- style: new ee({
1540
- fill: new ce({
1541
- color: "rgba(255, 255, 255, 0.2)"
1542
- }),
1543
- stroke: new Ee({
1544
- color: "rgba(255,204,51)",
1545
- lineDash: [10, 10],
1546
- width: 2
1547
- }),
1548
- image: new Ke({
1549
- radius: 5,
1550
- stroke: new Ee({
1551
- color: "rgba(0, 0, 0, 0.7)"
1552
- }),
1553
- fill: new ce({
1554
- color: "rgba(255, 255, 255, 0.2)"
1555
- })
1556
- })
1557
- }),
1558
- // 添加条件函数,判断是否应该出发点绘制
1559
- condition: (L) => L.originalEvent.target.tagName !== "DIV"
1560
- }), e == null || e.addInteraction($), h(), C();
1561
- let T;
1562
- $.on("drawstart", function(L) {
1563
- var X;
1564
- n = L.feature, n.set("randomId", i());
1565
- let R;
1566
- T = (X = n.getGeometry()) == null ? void 0 : X.on("change", function(Z) {
1567
- const W = Z.target, G = Et(W, l.value);
1568
- R = W.getLastCoordinate(), g && G && (g.innerHTML = G), p.setPosition(R);
1569
- });
1570
- }), $.on("drawend", function() {
1571
- var L, R, X;
1572
- if (g && (g.className = "ol-tooltip ol-tooltip-static ol-tooltip-measure"), g != null && g.innerHTML) {
1573
- const Z = (n == null ? void 0 : n.get("randomId")) || i();
1574
- o.value.push({ id: Z, value: g == null ? void 0 : g.innerHTML }), g.innerHTML = `${g.innerHTML}<div class="ol-tooltip-delete-button" data-id="${Z}"><i class="map-iconfont icon-delete"></i></div>`;
1575
- }
1576
- (L = document.querySelector(".ol-selectable:has(.ol-tooltip-delete-button):last-child .ol-tooltip-delete-button")) == null || L.addEventListener("click", (Z) => {
1577
- var G;
1578
- Z.preventDefault(), Z.stopPropagation();
1579
- const W = (G = Z.target) == null ? void 0 : G.getAttribute("data-id");
1580
- W && A(W);
1581
- }), p.setOffset([0, -7]), n = null, g = null, h(), T && ot(T), (X = (R = r.getProps()) == null ? void 0 : R.lineDrawEnd) == null || X.call(R, o.value);
1582
- });
1583
- }, i = () => Math.random().toString(36).substring(2, 9);
1584
- let g, p;
1585
- const h = () => {
1586
- g != null && g.parentNode && g.parentNode.removeChild(g), g = document.createElement("div"), g.className = "ol-tooltip ol-tooltip-measure", p = new xe({
1587
- element: g,
1588
- offset: [0, -15],
1589
- positioning: "bottom-center",
1590
- stopEvent: !1,
1591
- insertFirst: !1
1592
- }), e == null || e.addOverlay(p);
1593
- }, C = () => {
1594
- c != null && c.parentNode && c.parentNode.removeChild(c), c = document.createElement("div"), c.className = "ol-tooltip hidden", c.addEventListener("click", (T) => {
1595
- T.preventDefault(), T.stopPropagation();
1596
- }), f = new xe({
1597
- element: c,
1598
- offset: [15, 0],
1599
- positioning: "center-left"
1600
- }), e == null || e.addOverlay(f);
1601
- }, q = () => {
1602
- o.value.forEach((T, L) => {
1603
- var Z, W;
1604
- const R = document.querySelectorAll(".ol-tooltip.ol-tooltip-static.ol-tooltip-measure");
1605
- R[L] && ((W = (Z = R[L]) == null ? void 0 : Z.parentNode) == null || W.removeChild(R[L]));
1606
- const X = k.getFeatures();
1607
- X[L] && k.removeFeature(X[L]);
1608
- }), K(), No(e), s = "close", ke(e, "grab");
1609
- }, A = (T) => {
1610
- var R, X, Z, W;
1611
- const L = o.value.findIndex((G) => G.id === T);
1612
- if (L !== -1) {
1613
- o.value.splice(L, 1);
1614
- const G = document.querySelectorAll(".ol-tooltip.ol-tooltip-static.ol-tooltip-measure");
1615
- G[L] && ((X = (R = G[L]) == null ? void 0 : R.parentNode) == null || X.removeChild(G[L]));
1616
- const _ = k.getFeatures();
1617
- _[L] && k.removeFeature(_[L]);
1618
- }
1619
- (W = (Z = r.getProps()) == null ? void 0 : Z.lineDrawEnd) == null || W.call(Z, o.value);
1620
- }, K = () => {
1621
- if (o.value = [], document.querySelectorAll(".ol-tooltip.ol-tooltip-static").forEach((T) => {
1622
- var L;
1623
- (L = T == null ? void 0 : T.parentNode) == null || L.removeChild(T);
1624
- }), k == null || k.clear(), $) {
1625
- const T = e.getInteractions().getArray().find((L) => mt(L) === mt($));
1626
- T && e.removeInteraction(T);
1627
- }
1628
- e.removeLayer(x), c != null && c.parentNode && c.parentNode.removeChild(c), g != null && g.parentNode && g.parentNode.removeChild(g);
1629
- };
1630
- return {
1631
- open: w,
1632
- close: q,
1633
- deleteLine: A,
1634
- setUnit: d,
1635
- getState: () => s
1636
- };
1637
- }, Et = (e, r) => {
1638
- const l = it(e);
1639
- let d = "";
1640
- switch (r) {
1641
- case "m":
1642
- d = `${Math.round(l * 100) / 100} m`;
1643
- break;
1644
- case "km":
1645
- d = `${Math.round(l / 1e3 * 100) / 100} km`;
1646
- break;
1647
- case "nm":
1648
- d = (Math.round(l / 1e3 * 100) / 100 / 1.852).toFixed(2) + " nm";
1649
- break;
1650
- }
1651
- return d;
1652
- }, $o = (e, r) => {
1653
- let o, l, d = "close";
1654
- const c = () => {
1655
- K(), d = "open", s(), ke(e, "crosshair");
1656
- }, s = () => {
1657
- x(), p(), q(), $();
1658
- };
1659
- let w = null, k = null;
1660
- const x = () => {
1661
- if (w && k) return;
1662
- const T = new ye(), L = new be({
1663
- source: T,
1664
- style: new ee({
1665
- stroke: new Ee({
1666
- color: "#fbcc33",
1667
- width: 2
1668
- })
1669
- }),
1670
- zIndex: 1e3
1671
- });
1672
- w = L, k = T, e.on("pointermove", n), e.addLayer(L), e.on(["dblclick"], function(R) {
1673
- f && (R.stopPropagation(), R.preventDefault());
1674
- });
1675
- };
1676
- let t;
1677
- const n = (T) => {
1678
- if (T.dragging) return;
1679
- const L = t ? "单击继续,双击结束" : "点击选择起点";
1680
- h && (h.innerHTML = L, C.setPosition(T.coordinate));
1681
- };
1682
- let f, M = !1;
1683
- const $ = () => {
1684
- if (o) {
1685
- h != null && h.parentNode && h.parentNode.removeChild(h);
1686
- const T = o.getGeometry();
1687
- if (!T) return;
1688
- const L = V(T, "nm");
1689
- i && (i.innerHTML = `
1690
- <span class="text">面积:${L}${M ? '<span class="error pl-12">超出可以绘画的距离</span>' : ""}</span>
1691
- `), i && (i.innerHTML += '<span class="delete-icon" ><i class="map-iconfont icon-delete" /></div>');
1692
- const R = T.getCoordinates(), X = R[0][R[0].length - 2];
1693
- if (g.setPosition(X), w) {
1694
- const W = w.getSource();
1695
- W && o && (W.clear(), W.addFeature(o));
1696
- }
1697
- setTimeout(() => {
1698
- var W;
1699
- (W = document.querySelector(".delete-icon")) == null || W.addEventListener("click", () => {
1700
- var G, _;
1701
- console.log("delete"), A(), (_ = (G = r.getProps()) == null ? void 0 : G.areaDrawEnd) == null || _.call(G, []);
1702
- });
1703
- }, 0);
1704
- const Z = It(o.getGeometry().getExtent());
1705
- e == null || e.getView().setCenter(Z);
1706
- return;
1707
- }
1708
- f = new je({
1709
- type: "Polygon",
1710
- source: k,
1711
- trace: !0,
1712
- style: [new ee({
1713
- stroke: new Ee({
1714
- color: "rgba(255, 255, 255, 1)",
1715
- width: 1.5,
1716
- lineDash: [10, 10]
1717
- }),
1718
- fill: new ce({
1719
- color: "rgba(255, 255, 255, 0.25)"
1720
- })
1721
- }), new ee({
1722
- image: new Ke({
1723
- radius: 5,
1724
- fill: new ce({
1725
- color: "rgb(51,112,255, 1)"
1726
- })
1727
- }),
1728
- geometry: function(T) {
1729
- const L = T.getGeometry().getCoordinates();
1730
- return new eo(L);
1731
- }
1732
- })]
1733
- }), e == null || e.addInteraction(f), f.on("drawstart", (T) => {
1734
- var L;
1735
- t = T.feature, l = (L = t.getGeometry()) == null ? void 0 : L.on("change", (R) => {
1736
- const X = R.target, Z = V(X, "nm"), G = X.getCoordinates()[0], _ = new qe([G[G.length - 2], G[G.length - 1]]), u = Et(_, "nm");
1737
- if (M = Number(it(_) / 1e3) > 150, !Z) return;
1738
- const E = '<span class="error pl-4">超出可以绘画的距离</span>';
1739
- i && (i.innerHTML = `
1740
- <div class="text">
1741
- 面积:${Z}
1742
- ${M ? E : ""}
1743
- </div>
1744
- `), h && (h.innerHTML = `
1745
- <div class="text">
1746
- 面积:${Z}
1747
- </div>
1748
- <div class="text ${M ? "error" : ""}">
1749
- 线段 ${G.length - 2}: ${u}
1750
- ${M ? E : ""}
1751
-
1752
- </div>
1753
- <div>
1754
- <span class="text">单击继续,双击结束</span>
1755
- </div>
1756
- `);
1757
- });
1758
- }), f.on("drawend", (T) => {
1759
- var Z, W, G, _;
1760
- if (!T.feature.getGeometry()) return;
1761
- i && !o && (i.innerHTML += '<span class="delete-icon"><i class="map-iconfont icon-delete" /></div>'), o = T.feature, g.setOffset([10, 0]);
1762
- const R = T.feature.getGeometry().getCoordinates(), X = R[0][R[0].length - 2];
1763
- if (g.setPosition(X), h != null && h.parentNode && h.parentNode.removeChild(h), (Z = r.getProps()) != null && Z.areaDrawEnd) {
1764
- const u = R[0].map((E) => Ae(E, le.mercator, le.data));
1765
- (G = (W = r.getProps()) == null ? void 0 : W.areaDrawEnd) == null || G.call(W, u);
1766
- }
1767
- f && (f.setActive(!1), e == null || e.removeInteraction(f), (e == null ? void 0 : e.getInteractions()).forEach((E) => {
1768
- E instanceof je && (E.setActive(!1), e == null || e.removeInteraction(E));
1769
- })), l && ot(l), (_ = document.querySelector(".delete-icon")) == null || _.addEventListener("click", () => {
1770
- var u, E;
1771
- A(), (E = (u = r.getProps()) == null ? void 0 : u.areaDrawEnd) == null || E.call(u, []);
1772
- });
1773
- });
1774
- }, V = (T, L) => {
1775
- const R = Ut(T);
1776
- switch (L) {
1777
- case "km":
1778
- return R > 1e4 ? Math.round(R / 1e6 * 100) / 100 + " km<sup>2</sup>" : Math.round(R * 100) / 100 + " m<sup>2</sup>";
1779
- case "nm":
1780
- return R > 1e4 ? Math.round(R / 1e6 / Math.pow(1.852, 2) * 100) / 100 + " nm<sup>2</sup>" : Math.round(R * 100) / 100 + " m<sup>2</sup>";
1781
- }
1782
- };
1783
- let i, g;
1784
- const p = () => {
1785
- i != null && i.parentNode && i.parentNode.removeChild(i), i = document.createElement("div"), i.style.display = "flex", i.className = "ol-tooltip ol-tooltip-draw-polygon", g = new xe({
1786
- element: i,
1787
- offset: [0, -15],
1788
- positioning: "bottom-center",
1789
- stopEvent: !1,
1790
- insertFirst: !1
1791
- }), e == null || e.addOverlay(g);
1792
- };
1793
- let h, C;
1794
- const q = () => {
1795
- h != null && h.parentNode && h.parentNode.removeChild(h), h = document.createElement("div"), h.className = "ol-tooltip ol-help-tooltip", h.addEventListener("click", (T) => {
1796
- T.preventDefault(), T.stopPropagation();
1797
- }), C = new xe({
1798
- element: h,
1799
- offset: [15, 0],
1800
- positioning: "center-left"
1801
- }), e == null || e.addOverlay(C);
1802
- }, A = () => {
1803
- o = null, c();
1804
- }, K = () => {
1805
- d = "close", e.un("pointermove", n), t = null, f && (f.abortDrawing(), console.log("abortDrawing"), f.setActive(!1), (e == null ? void 0 : e.getInteractions()).forEach((L) => {
1806
- L instanceof je && (L.setActive(!1), e == null || e.removeInteraction(L));
1807
- }), f = null), l && ot(l), l = void 0, k == null || k.clear(), k = null, w && e.getAllLayers().includes(w) && (e.removeLayer(w), w = null), h != null && h.parentElement && (h.innerHTML = "", h.parentElement.removeChild(h), h = null), i != null && i.parentElement && (i.innerHTML = "", i.parentElement.removeChild(i), i = null), C && e.removeOverlay(C), g && e.removeOverlay(g), ke(e, "grab");
1808
- };
1809
- return {
1810
- open: c,
1811
- close: K,
1812
- reset: A,
1813
- getState: () => d
1814
- };
1815
- }, Vo = "zh-map-port-layer", zo = (e) => {
1816
- const r = new ye(), o = new be({
1817
- className: Vo,
1818
- source: r,
1819
- zIndex: 100,
1820
- updateWhileInteracting: !0,
1821
- updateWhileAnimating: !0,
1822
- properties: { layerType: re.PORT }
1823
- });
1824
- e == null || e.addLayer(o);
1825
- let l = null, d = null;
1826
- const c = (i, g = !0) => {
1827
- if (!i || i.length === 0) return;
1828
- if (r.clear(), d) {
1829
- const h = i.find((C) => C.id === (d == null ? void 0 : d.id));
1830
- h ? d = h : i.push(d);
1831
- }
1832
- const p = [];
1833
- i.forEach((h) => {
1834
- const [C, q] = h.latLon.split(","), A = new ue({
1835
- geometry: new ie(ae([Number(C), Number(q)])),
1836
- portData: h,
1837
- id: h.id,
1838
- select: h.id === (d == null ? void 0 : d.id),
1839
- showTitle: h.id === (d == null ? void 0 : d.id) || g
1840
- }), K = t(A);
1841
- A.setStyle(K), p.push(A);
1842
- }), r.addFeatures(p);
1843
- };
1844
- let s = null, w = null;
1845
- const k = /* @__PURE__ */ new Map(), x = (i, g) => {
1846
- s || (s = document.createElement("canvas"), w = s.getContext("2d", {
1847
- willReadFrequently: !0
1848
- }));
1849
- const p = `${i}-${g}`;
1850
- if (k.has(p))
1851
- return k.get(p);
1852
- const h = s, C = w;
1853
- if (!C) return "";
1854
- h.width = 0, h.height = 0;
1855
- const q = 2, A = 8, K = window.devicePixelRatio || 1, I = "12px sans-serif";
1856
- C.font = I;
1857
- const L = C.measureText(i).width, R = A + L + A, X = q + 12 + q * 2;
1858
- h.width = Math.round(R * K), h.height = Math.round(X * K), C.scale(K, K), C.clearRect(0, 0, R, X), C.fillStyle = g ? "#F32D2D" : "#FFF", C.beginPath(), C.roundRect(0, 0, R, X, 4), C.fill(), C.font = I, C.textBaseline = "middle";
1859
- const Z = X / 2;
1860
- C.strokeStyle = g ? "#000" : "#ffffff", C.lineWidth = 1, C.strokeText(i, A, Z), C.fillStyle = g ? "#FFF" : "#000000", C.fillText(i, A, Z);
1861
- const W = h.toDataURL("image/png");
1862
- return k.set(p, W), W;
1863
- }, t = (i) => {
1864
- const { select: g, showTitle: p } = i.getProperties(), h = (L) => `<svg width="46" height="46" viewBox="0 0 46 46" fill="none" xmlns="http://www.w3.org/2000/svg">
1865
- <path fill-rule="evenodd" clip-rule="evenodd" d="M22.6563 44.9304C22.5453 44.8844 22.4445 44.817 22.3595 44.7321C22.3595 44.7321 9.36986 31.7424 9.32952 31.6913C7.09059 29.0791 5.64794 25.8802 5.17255 22.4736C4.69716 19.0671 5.20896 15.5957 6.64728 12.471C8.08561 9.34625 10.3902 6.69909 13.2878 4.84325C16.1855 2.98741 19.5548 2.00068 22.9965 2C26.4381 1.99932 29.8078 2.98473 32.7062 4.83943C35.6046 6.69414 37.9102 9.34039 39.3498 12.4646C40.7893 15.5888 41.3025 19.0599 40.8284 22.4666C40.3544 25.8734 38.913 29.0729 36.6751 31.686C36.6401 31.737 23.6531 44.7321 23.6531 44.7321C23.5682 44.817 23.4674 44.8844 23.3564 44.9304C23.2454 44.9763 23.1265 45 23.0063 45C22.8862 45 22.7673 44.9763 22.6563 44.9304Z" fill="${L}"/>
1866
- <g clip-path="url(#clip0_10059_122082)">
1867
- <path d="M34.8624 22.8687L32.5874 25.6313L33.4812 25.7125C33.4812 25.7125 30.5562 28.0687 27.9562 28.2312C25.3562 28.3937 24.1374 24.9 24.1374 24.9V19.1312H27.6312V17.425H24.2999V15.15C25.7624 14.6625 26.7374 13.2812 26.7374 11.6562C26.7374 9.625 25.1124 8 23.0812 8H22.9999C20.9687 8 19.3437 9.625 19.3437 11.6562C19.3437 13.2812 20.3999 14.6625 21.7812 15.15V17.425H18.4499V19.1312H21.9437V24.9C21.9437 24.9 20.6437 28.3125 18.0437 28.2312C15.4437 28.0687 12.5187 25.7125 12.5187 25.7125L13.4124 25.6313L11.0562 22.8687L10.2437 26.2812L11.2187 26.0375C11.2187 26.0375 13.1687 29.5313 16.1749 30.8313C19.1812 32.2125 22.1874 33.9187 22.8374 34C23.4874 33.9187 26.4937 32.2125 29.4187 30.8313C32.3437 29.45 34.3749 26.0375 34.3749 26.0375L35.3499 26.2812L34.8624 22.8687ZM23.0812 13.6875C21.9437 13.6875 21.0499 12.7937 21.0499 11.6562C21.0499 10.6 21.9437 9.70625 22.9999 9.70625H23.0812C24.1374 9.70625 25.0312 10.6 25.0312 11.6562C25.1124 12.7937 24.1374 13.6875 23.0812 13.6875Z" fill="white"/>
1868
- </g>
1869
- <defs>
1870
- <clipPath id="clip0_10059_122082">
1871
- <rect width="26" height="26" fill="white" transform="translate(10 8)"/>
1872
- </clipPath>
1873
- </defs>
1874
- </svg>
1875
- `, C = () => `data:image/svg+xml;utf8,${encodeURIComponent(h(g ? "#F32D2D" : "#3370FF"))}`, q = e.getView().getZoom(), A = i.get("portData"), K = window.devicePixelRatio || 1, I = new ee({
1876
- image: new Pe({
1877
- src: C(),
1878
- scale: 0.5 * q / 10
1879
- }),
1880
- zIndex: g ? 110 : 100
1881
- }), T = new ee({
1882
- image: new Pe({
1883
- src: x(A.shortName, g),
1884
- anchor: [0.5, 0.5],
1885
- displacement: [0, -30],
1886
- scale: 1 / K,
1887
- anchorXUnits: "fraction",
1888
- anchorYUnits: "fraction"
1889
- }),
1890
- zIndex: g ? 110 : 100
1891
- // text: new Text({
1892
- // text: port.shortName,
1893
- // font: '12px sans-serif',
1894
- // fill: new Fill({
1895
- // color: select ? "#ffffff" : "#000000"
1896
- // }),
1897
- // backgroundFill: new Fill({
1898
- // color: "#FFF",
1899
- // }),
1900
- // offsetY: 30,
1901
- // }),
1902
- });
1903
- return !p && !g ? I : [I, T];
1904
- }, n = () => {
1905
- if (r)
1906
- if (l) {
1907
- console.log("清除非选中的港口");
1908
- const i = l.get("portData").id;
1909
- r.getFeatures().forEach((g) => {
1910
- g.get("portData").id !== i && r.removeFeature(g);
1911
- });
1912
- } else
1913
- console.log("清除所有港口", r), r == null || r.clear();
1914
- }, f = (i) => {
1915
- if (r) {
1916
- if (!i)
1917
- return M();
1918
- (l == null ? void 0 : l.get("portData").id) !== i.id && (M(), $(i));
1919
- }
1920
- }, M = () => {
1921
- var i;
1922
- if (l) {
1923
- const g = l == null ? void 0 : l.get("portData"), p = (i = r.getFeatures()) == null ? void 0 : i.find((h) => h.get("portData").id === g.id);
1924
- p && (p.set("select", !1), p.setStyle(t(p)), l = null, d = null);
1925
- }
1926
- }, $ = (i) => {
1927
- if (!r) return;
1928
- const g = r.getFeatures();
1929
- d = i, l = g.find((p) => p.get("portData").id === i.id), l && (l.set("select", !0), l.setStyle(t(l)));
1930
- };
1931
- return {
1932
- render: c,
1933
- clear: n,
1934
- selected: f,
1935
- handlePortHover: (i) => {
1936
- i && i.get("portData") ? ke(e, "pointer") : ke(e, "grab");
1937
- }
1938
- };
1939
- }, Oo = (e, r, o, l, d, c, s) => {
1940
- const w = e.getInstall();
1941
- w.on("moveend", () => {
1942
- var n, f;
1943
- try {
1944
- const M = e.getZoom();
1945
- (f = (n = r.getProps()).mapMoveEnd) == null || f.call(n, M), M >= de.min && M <= de.max && o.reRenderTrackLine(), l.changeShipScale("end");
1946
- } catch (M) {
1947
- console.log("moveend---catch", M);
1948
- }
1949
- });
1950
- const k = {
1951
- [re.PORT]: null,
1952
- [re.SHIP]: null,
1953
- [re.TRACK]: null
1954
- }, x = (n, f, M) => {
1955
- switch (n) {
1956
- case re.SHIP:
1957
- l == null || l.handleShipMapEvent(f, "hover");
1958
- break;
1959
- case re.PORT:
1960
- break;
1961
- case re.TRACK:
1962
- o == null || o.handleTrackMapEvent(f, "hover", M);
1963
- break;
1964
- }
1965
- }, t = (n) => {
1966
- switch (n) {
1967
- case re.PORT:
1968
- break;
1969
- case re.SHIP:
1970
- l == null || l.handleShipMapEvent(null, "hover");
1971
- break;
1972
- case re.TRACK:
1973
- o == null || o.handleTrackMapEvent(null, "hover");
1974
- break;
1975
- }
1976
- };
1977
- w.on("pointermove", (n) => {
1978
- if (s.getState() !== "open" && c.getState() !== "open" && !w.getView().getAnimating())
1979
- try {
1980
- let f = !1, M = !1;
1981
- const $ = w.getLayers().getArray().filter((V) => V.get("layerType"));
1982
- $ && $.length > 0 && $.forEach((V) => {
1983
- if (M) return;
1984
- const i = w == null ? void 0 : w.getEventPixel(n.originalEvent), g = V == null ? void 0 : V.get("layerType"), p = w == null ? void 0 : w.forEachFeatureAtPixel(i, (h) => h, {
1985
- layerFilter: (h) => h === V,
1986
- // 严格图层过滤
1987
- hitTolerance: 5
1988
- });
1989
- p !== k[g] && (k[g] && t(g, k[g]), k[g] = p, p && (x(g, p, n), M = !0)), p && (f = !0);
1990
- }), f ? ke(w, "pointer") : ke(w, "grab");
1991
- } catch (f) {
1992
- console.log("pointermove----", f);
1993
- }
1994
- }), w.on("movestart", () => {
1995
- try {
1996
- l.changeShipScale("start");
1997
- } catch (n) {
1998
- console.log("movestart---catch", n);
1999
- }
2000
- }), w.on("click", kt((n) => {
2001
- if (s.getState() !== "open" && c.getState() !== "open" && !w.getView().getAnimating())
2002
- try {
2003
- let f = !1;
2004
- const M = w.getLayers().getArray().filter(($) => $.get("layerType"));
2005
- M && M.length > 0 && M.forEach(($) => {
2006
- var g, p, h;
2007
- if (f) return;
2008
- const V = w == null ? void 0 : w.getEventPixel(n.originalEvent), i = w == null ? void 0 : w.forEachFeatureAtPixel(V, (C) => {
2009
- if (C.get("shipData") || C.get("portData"))
2010
- return C;
2011
- }, {
2012
- layerFilter: (C) => C === $,
2013
- // 严格图层过滤
2014
- hitTolerance: 10
2015
- });
2016
- if (i) {
2017
- if (i != null && i.get("shipData"))
2018
- console.log("trackManager.getTrackStatus()---", o.getTrackStatus()), o.getTrackStatus() || l.handleShipMapEvent(i, "click", (g = r.getProps()) == null ? void 0 : g.selectShip);
2019
- else if (i != null && i.get("portData")) {
2020
- const C = i == null ? void 0 : i.get("portData");
2021
- d.selected(C), (h = (p = r.getProps()) == null ? void 0 : p.selectPort) == null || h.call(p, C);
2022
- }
2023
- f = !0, n.preventDefault(), n.stopPropagation();
2024
- }
2025
- });
2026
- } catch (f) {
2027
- console.log("pointermove----", f);
2028
- }
2029
- }, 150));
2030
- }, Do = () => {
2031
- const e = Zt([]);
2032
- return {
2033
- createInstance: (l, d) => {
2034
- const c = ao();
2035
- c.initMap(l, d);
2036
- const s = c.getInstall(), w = Eo(s), k = Po();
2037
- k.setProps(d), w.setShowLayerType(d.layerType), w.setGreenTileVisible(d.showGreenLayer);
2038
- const x = vo(s), t = mo(s, x), n = To(s), f = Fo(s), M = Ro(s, k), $ = $o(s, k), V = zo(s);
2039
- Oo(c, k, x, n, V, M, $);
2040
- const i = () => {
2041
- const p = s.getView().calculateExtent(c.getSize()), h = Ae([p[0], p[1]], le.mercator, le.data), C = Ae([p[2], p[3]], le.mercator, le.data);
2042
- return [h[0], h[1], C[0], C[1]];
2043
- }, g = {
2044
- id: Symbol("map-instance"),
2045
- innerMap: null,
2046
- map: c.getInstall(),
2047
- destroy: () => {
2048
- e.splice(e.indexOf(g), 1);
2049
- },
2050
- methods: {
2051
- ...c,
2052
- layer: w,
2053
- ship: n,
2054
- track: x,
2055
- carTrack: t,
2056
- port: {
2057
- render: V.render,
2058
- clear: V.clear,
2059
- selected: V.selected
2060
- },
2061
- position: f,
2062
- drawLine: M,
2063
- drawPolygon: $,
2064
- // 子模块
2065
- utils: {
2066
- getCalculateExtent: i,
2067
- convertSixHundredThousandToLatLng: at,
2068
- calculateCirclePoints: uo
2069
- }
2070
- }
2071
- };
2072
- return e.push(g), g;
2073
- },
2074
- destroyInstance: (l) => {
2075
- const d = e.findIndex((c) => c.id === l);
2076
- d > -1 && (e[d].destroy(), e.splice(d, 1));
2077
- },
2078
- destroyAll: () => {
2079
- e.forEach((l) => l.destroy()), e.splice(0, e.length);
2080
- },
2081
- getAllInstances: () => [...e]
2082
- };
2083
- }, Ao = { class: "zh-map-box" }, Zo = /* @__PURE__ */ nt({
2084
- __name: "Map",
2085
- props: {
2086
- zoom: { default: de.default },
2087
- center: { default: co },
2088
- layerType: { default: "vector" },
2089
- showGreenLayer: { type: Boolean, default: !1 },
2090
- showScale: { type: Boolean, default: !0 },
2091
- scaleLineUnit: { default: "metric" },
2092
- mapMoveEnd: { type: Function, default: () => {
2093
- } },
2094
- lineDrawEnd: {},
2095
- areaDrawEnd: { type: Function, default: () => {
2096
- } },
2097
- selectShip: { type: Function, default: () => {
2098
- } },
2099
- selectPort: { type: Function, default: () => {
2100
- } }
2101
- },
2102
- setup(e, { expose: r }) {
2103
- function o() {
2104
- return new Promise((t) => {
2105
- document.fonts ? document.fonts.load("12px map-iconfont").then(t) : setTimeout(t, 300);
2106
- });
2107
- }
2108
- o();
2109
- const l = fe(), d = fe(), c = Do(), s = fe(), w = e, k = fe({
2110
- getInstall() {
2111
- }
2112
- });
2113
- Wt(() => {
2114
- var t;
2115
- s.value = c.createInstance(l.value, w), k.value = s.value.methods, (t = d.value) == null || t.setScaleLine(s.value.map, w.scaleLineUnit), window.addEventListener("nativeDoubleTap", function() {
2116
- x();
2117
- });
2118
- });
2119
- function x() {
2120
- var n, f;
2121
- let t = (n = s.value) == null ? void 0 : n.methods.getZoom();
2122
- (f = s.value) == null || f.methods.setZoom(t + 1);
2123
- }
2124
- return Gt(() => {
2125
- var t, n;
2126
- c.destroyInstance((t = s == null ? void 0 : s.value) == null ? void 0 : t.id), (n = s.value) == null || n.destroy();
2127
- }), r({
2128
- getZoom: () => {
2129
- var t;
2130
- return (t = s.value) == null ? void 0 : t.methods.getZoom();
2131
- },
2132
- setZoom: (t) => {
2133
- var n;
2134
- return (n = s.value) == null ? void 0 : n.methods.setZoom(t);
2135
- },
2136
- getInstall: () => {
2137
- var t;
2138
- return (t = s.value) == null ? void 0 : t.methods.getInstall();
2139
- },
2140
- getView: () => {
2141
- var t;
2142
- return (t = s.value) == null ? void 0 : t.methods.getView();
2143
- },
2144
- setCenter: (t, n) => {
2145
- var f;
2146
- return (f = s.value) == null ? void 0 : f.methods.setCenter(t, n);
2147
- },
2148
- getSize: () => {
2149
- var t;
2150
- return (t = s.value) == null ? void 0 : t.methods.getSize();
2151
- },
2152
- getCenter: (t, n) => {
2153
- var f;
2154
- return (f = s.value) == null ? void 0 : f.methods.getCenter();
2155
- },
2156
- layer: {
2157
- setGreenTileVisible: (t) => {
2158
- var n;
2159
- return (n = s.value) == null ? void 0 : n.methods.layer.setGreenTileVisible(t);
2160
- },
2161
- getGreenTileVisible: () => {
2162
- var t;
2163
- return (t = s.value) == null ? void 0 : t.methods.layer.getGreenTileVisible();
2164
- },
2165
- getShowLayerType: () => {
2166
- var t;
2167
- return (t = s.value) == null ? void 0 : t.methods.layer.getShowLayerType();
2168
- },
2169
- setShowLayerType: (t) => {
2170
- var n;
2171
- return (n = s.value) == null ? void 0 : n.methods.layer.setShowLayerType(t);
2172
- }
2173
- },
2174
- ship: {
2175
- render: (...t) => {
2176
- var n;
2177
- return (n = s.value) == null ? void 0 : n.methods.ship.render(...t);
2178
- },
2179
- selected: (...t) => {
2180
- var n;
2181
- return (n = s.value) == null ? void 0 : n.methods.ship.selected(...t);
2182
- },
2183
- filter: (...t) => {
2184
- var n;
2185
- return (n = s.value) == null ? void 0 : n.methods.ship.filter(...t);
2186
- },
2187
- blinking: (...t) => {
2188
- var n;
2189
- return (n = s.value) == null ? void 0 : n.methods.ship.blinking(...t);
2190
- },
2191
- clear: () => {
2192
- var t;
2193
- return (t = s.value) == null ? void 0 : t.methods.ship.clear();
2194
- },
2195
- setLableStatus: (...t) => {
2196
- var n;
2197
- return (n = s.value) == null ? void 0 : n.methods.ship.setLableStatus(...t);
2198
- }
2199
- },
2200
- track: {
2201
- render: (...t) => {
2202
- var n;
2203
- return (n = s.value) == null ? void 0 : n.methods.track.render(...t);
2204
- },
2205
- remove: (...t) => {
2206
- var n;
2207
- return (n = s.value) == null ? void 0 : n.methods.track.remove(...t);
2208
- },
2209
- play: (...t) => {
2210
- var n;
2211
- return (n = s.value) == null ? void 0 : n.methods.track.play(...t);
2212
- },
2213
- setCenter: (...t) => {
2214
- var n;
2215
- return (n = s.value) == null ? void 0 : n.methods.track.setCenter(...t);
2216
- },
2217
- close: (...t) => {
2218
- var n;
2219
- return (n = s.value) == null ? void 0 : n.methods.track.close(...t);
2220
- },
2221
- getLength: (...t) => {
2222
- var n;
2223
- return (n = s.value) == null ? void 0 : n.methods.track.getLength(...t);
2224
- }
2225
- },
2226
- carTrack: {
2227
- location: (...t) => {
2228
- var n;
2229
- return (n = s.value) == null ? void 0 : n.methods.carTrack.location(...t);
2230
- },
2231
- remove: (...t) => {
2232
- var n;
2233
- return (n = s.value) == null ? void 0 : n.methods.carTrack.remove(...t);
2234
- },
2235
- renderTrack: (...t) => {
2236
- var n;
2237
- return (n = s.value) == null ? void 0 : n.methods.carTrack.renderTrack(...t);
2238
- },
2239
- setCenter: (...t) => {
2240
- var n;
2241
- return (n = s.value) == null ? void 0 : n.methods.carTrack.setCenter(...t);
2242
- },
2243
- closeTrack: () => {
2244
- var t;
2245
- return (t = s.value) == null ? void 0 : t.methods.carTrack.closeTrack();
2246
- },
2247
- playTrack: (...t) => {
2248
- var n;
2249
- return (n = s.value) == null ? void 0 : n.methods.carTrack.playTrack(...t);
2250
- }
2251
- },
2252
- port: {
2253
- render: (t, n) => {
2254
- var f;
2255
- return (f = s.value) == null ? void 0 : f.methods.port.render(t, n);
2256
- },
2257
- clear: () => {
2258
- var t;
2259
- return (t = s.value) == null ? void 0 : t.methods.port.clear();
2260
- },
2261
- selected: (t) => {
2262
- var n;
2263
- return (n = s.value) == null ? void 0 : n.methods.port.selected(t);
2264
- }
2265
- },
2266
- position: {
2267
- render: (...t) => {
2268
- var n;
2269
- return (n = s.value) == null ? void 0 : n.methods.position.render(...t);
2270
- },
2271
- selected: (...t) => {
2272
- var n;
2273
- return (n = s.value) == null ? void 0 : n.methods.position.selected(...t);
2274
- },
2275
- clearSelected: (...t) => {
2276
- var n;
2277
- return (n = s.value) == null ? void 0 : n.methods.position.clearSelected(...t);
2278
- },
2279
- clear: () => {
2280
- var t;
2281
- return (t = s.value) == null ? void 0 : t.methods.position.clear();
2282
- },
2283
- renderHtml: (...t) => {
2284
- var n;
2285
- return (n = s.value) == null ? void 0 : n.methods.position.renderHtml(...t);
2286
- },
2287
- removeHtml: (...t) => {
2288
- var n;
2289
- return (n = s.value) == null ? void 0 : n.methods.position.removeHtml(...t);
2290
- }
2291
- },
2292
- drawLine: {
2293
- open: () => {
2294
- var t;
2295
- return (t = s.value) == null ? void 0 : t.methods.drawLine.open();
2296
- },
2297
- close: () => {
2298
- var t;
2299
- return (t = s.value) == null ? void 0 : t.methods.drawLine.close();
2300
- },
2301
- deleteLine: (t) => {
2302
- var n;
2303
- return (n = s.value) == null ? void 0 : n.methods.drawLine.deleteLine(t);
2304
- },
2305
- setUnit: (t) => {
2306
- var n;
2307
- return (n = s.value) == null ? void 0 : n.methods.drawLine.setUnit(t);
2308
- },
2309
- getState: () => {
2310
- var t;
2311
- return (t = s.value) == null ? void 0 : t.methods.drawLine.getState();
2312
- }
2313
- },
2314
- drawPolygon: {
2315
- open: () => {
2316
- var t;
2317
- return (t = s.value) == null ? void 0 : t.methods.drawPolygon.open();
2318
- },
2319
- close: () => {
2320
- var t;
2321
- return (t = s.value) == null ? void 0 : t.methods.drawPolygon.close();
2322
- },
2323
- reset: () => {
2324
- var t;
2325
- return (t = s.value) == null ? void 0 : t.methods.drawPolygon.reset();
2326
- }
2327
- },
2328
- // 子模块
2329
- utils: {
2330
- getCalculateExtent: (...t) => {
2331
- var n;
2332
- return (n = s.value) == null ? void 0 : n.methods.utils.getCalculateExtent(...t);
2333
- },
2334
- convertSixHundredThousandToLatLng: (...t) => {
2335
- var n;
2336
- return (n = s.value) == null ? void 0 : n.methods.utils.convertSixHundredThousandToLatLng(...t);
2337
- },
2338
- calculateCirclePoints: (t, n) => {
2339
- var f;
2340
- return (f = s.value) == null ? void 0 : f.methods.utils.calculateCirclePoints(t, n);
2341
- }
2342
- }
2343
- }), (t, n) => (rt(), lt("div", Ao, [
2344
- et("div", {
2345
- id: "map",
2346
- ref_key: "zhMapRef",
2347
- ref: l,
2348
- class: "zh-map"
2349
- }, null, 512),
2350
- tt(ro, {
2351
- ref_key: "scaleLineRef",
2352
- ref: d
2353
- }, null, 512),
2354
- tt(io, {
2355
- ref: "zoomControlRef",
2356
- "map-instance": s.value
2357
- }, null, 8, ["map-instance"])
2358
- ]));
2359
- }
2360
- }), Wo = /* @__PURE__ */ ct(Zo, [["__scopeId", "data-v-ec9700a3"]]), Xo = to(Wo);
2361
- export {
2362
- Xo as Z
2363
- };