zhihao-ui 1.3.63 → 1.3.64

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