zhihao-ui 1.3.53 → 1.3.55

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