zhihao-ui 1.3.45 → 1.3.47

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