zhihao-ui 1.3.36 → 1.3.37
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/es/{Map-bFoPIK8W.js → Map-bHoT3xdF.js} +584 -578
- package/dist/es/index.js +1 -1
- package/dist/umd/index.umd.cjs +28 -28
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { defineComponent as Ye, openBlock as Be, createElementBlock as qe, createElementVNode as
|
|
2
|
-
import { S as $t, M as Ue, T as me, X as we, p as ee, V as zt, q as Ot, t as Rt, h as lt, r as He, s as Zt, u as ge, F as
|
|
1
|
+
import { defineComponent as Ye, openBlock as Be, createElementBlock as qe, createElementVNode as De, ref as I, computed as Te, h as ne, createVNode as Ae, render as Pt, reactive as St, onMounted as Nt, onUnmounted as Vt } from "vue";
|
|
2
|
+
import { S as $t, M as Ue, T as me, X as we, p as ee, V as zt, q as Ot, t as Rt, h as lt, r as He, s as Zt, u as ge, F as j, v as X, O as ce, P as le, w as ke, x as Ne, L as Pe, y as Gt, z as Ie, A as ie, B as ye, C as de, D as ve, i as Dt, G as Ve, H as At, I as Oe, J as Wt, K as Yt, N as st, Q as Se, R as We, U as et, W as Bt, Y as qt, Z as Ht } from "./vendor-D2mv9LHk.js";
|
|
3
3
|
import { _ as Xe } from "./Button-CGndQwez.js";
|
|
4
4
|
import { w as Xt } from "./utils-D2wHR1YB.js";
|
|
5
5
|
const jt = { id: "scale-line-container" }, Qt = /* @__PURE__ */ Ye({
|
|
@@ -39,11 +39,11 @@ const jt = { id: "scale-line-container" }, Qt = /* @__PURE__ */ Ye({
|
|
|
39
39
|
t && i(t - 1);
|
|
40
40
|
};
|
|
41
41
|
return (i, o) => (Be(), qe("div", Kt, [
|
|
42
|
-
|
|
42
|
+
De("div", {
|
|
43
43
|
class: "button big-button",
|
|
44
44
|
onClick: l
|
|
45
45
|
}, " + "),
|
|
46
|
-
|
|
46
|
+
De("div", {
|
|
47
47
|
class: "button small-button",
|
|
48
48
|
onClick: s
|
|
49
49
|
}, " - ")
|
|
@@ -73,34 +73,34 @@ const jt = { id: "scale-line-container" }, Qt = /* @__PURE__ */ Ye({
|
|
|
73
73
|
var ue = ((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=${Fe}`, 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=${Fe}`, 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=${Fe}`, 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=${Fe}`, e.greenTile = `${it}/map/tile/{z}/{x}/{y}.png`, e))(ue || {}), xe = /* @__PURE__ */ ((e) => (e[e.M = 1] = "M", e[e.KM = 2] = "KM", e[e.NM = 3] = "NM", e))(xe || {});
|
|
74
74
|
function eo() {
|
|
75
75
|
const e = I(), r = () => e.value, l = () => r().getView(), s = () => {
|
|
76
|
-
var
|
|
77
|
-
return (
|
|
78
|
-
}, i = (
|
|
79
|
-
var
|
|
80
|
-
(
|
|
81
|
-
}, o = (
|
|
82
|
-
var
|
|
83
|
-
(
|
|
76
|
+
var y;
|
|
77
|
+
return (y = l()) == null ? void 0 : y.getZoom();
|
|
78
|
+
}, i = (y) => {
|
|
79
|
+
var k;
|
|
80
|
+
(k = l()) == null || k.setZoom(y);
|
|
81
|
+
}, o = (y, k) => {
|
|
82
|
+
var P;
|
|
83
|
+
(P = l()) == null || P.setCenter(ee([y, k]));
|
|
84
84
|
}, u = () => {
|
|
85
|
-
var
|
|
86
|
-
const
|
|
87
|
-
return Rt(
|
|
85
|
+
var k;
|
|
86
|
+
const y = (k = l()) == null ? void 0 : k.getCenter();
|
|
87
|
+
return Rt(y);
|
|
88
88
|
}, h = () => {
|
|
89
|
-
var
|
|
90
|
-
return (
|
|
91
|
-
}, t = new Ue(), n = (
|
|
92
|
-
m(
|
|
93
|
-
const
|
|
94
|
-
zoom:
|
|
95
|
-
center: ee(
|
|
89
|
+
var y;
|
|
90
|
+
return (y = r()) == null ? void 0 : y.getSize();
|
|
91
|
+
}, t = new Ue(), n = (y, k) => {
|
|
92
|
+
m(k);
|
|
93
|
+
const P = {
|
|
94
|
+
zoom: k.zoom,
|
|
95
|
+
center: ee(k.center),
|
|
96
96
|
minZoom: te.min,
|
|
97
97
|
maxZoom: te.max,
|
|
98
98
|
constrainResolution: !0,
|
|
99
99
|
enableRotation: !1,
|
|
100
100
|
multiWorld: !0
|
|
101
101
|
};
|
|
102
|
-
let
|
|
103
|
-
target:
|
|
102
|
+
let w = {
|
|
103
|
+
target: y,
|
|
104
104
|
controls: Ot({
|
|
105
105
|
zoom: !1
|
|
106
106
|
}),
|
|
@@ -110,38 +110,38 @@ function eo() {
|
|
|
110
110
|
t.get("satelliteImgTile"),
|
|
111
111
|
t.get("satelliteImgTileMark")
|
|
112
112
|
],
|
|
113
|
-
view: new zt(
|
|
113
|
+
view: new zt(P)
|
|
114
114
|
};
|
|
115
|
-
const
|
|
116
|
-
e.value =
|
|
117
|
-
}, m = (
|
|
115
|
+
const g = new Ue(w);
|
|
116
|
+
e.value = g;
|
|
117
|
+
}, m = (y) => {
|
|
118
118
|
t.set("vectorTile", new me({
|
|
119
119
|
source: new we({ url: ue.vectorTile }),
|
|
120
|
-
visible:
|
|
120
|
+
visible: y.layerType === "vector",
|
|
121
121
|
zIndex: 0,
|
|
122
122
|
preload: 1,
|
|
123
123
|
className: "vector"
|
|
124
124
|
})), t.set("vectorTileMark", new me({
|
|
125
125
|
source: new we({ url: ue.vectorTileMark }),
|
|
126
|
-
visible:
|
|
126
|
+
visible: y.layerType === "vector",
|
|
127
127
|
zIndex: 1,
|
|
128
128
|
preload: 1,
|
|
129
129
|
className: "vector"
|
|
130
130
|
})), t.set("satelliteImgTile", new me({
|
|
131
131
|
source: new we({ url: ue.satelliteImgTile }),
|
|
132
|
-
visible:
|
|
132
|
+
visible: y.layerType === "satellite",
|
|
133
133
|
zIndex: 0,
|
|
134
134
|
preload: 1,
|
|
135
135
|
className: "satellite"
|
|
136
136
|
})), t.set("satelliteImgTileMark", new me({
|
|
137
137
|
source: new we({ url: ue.satelliteImgTileMark }),
|
|
138
|
-
visible:
|
|
138
|
+
visible: y.layerType === "satellite",
|
|
139
139
|
zIndex: 1,
|
|
140
140
|
preload: 1,
|
|
141
141
|
className: "satellite"
|
|
142
142
|
})), t.set("greenMark", new me({
|
|
143
143
|
source: new we({ url: ue.greenTile }),
|
|
144
|
-
visible:
|
|
144
|
+
visible: y.showGreenLayer,
|
|
145
145
|
zIndex: 2,
|
|
146
146
|
className: "greenTile"
|
|
147
147
|
}));
|
|
@@ -206,7 +206,7 @@ const tt = (e) => {
|
|
|
206
206
|
const r = new ge({
|
|
207
207
|
font: "Normal 14px map-iconfont",
|
|
208
208
|
text: fe(e),
|
|
209
|
-
fill: new
|
|
209
|
+
fill: new j({ color: "#fff" }),
|
|
210
210
|
offsetY: -14
|
|
211
211
|
});
|
|
212
212
|
return new X({
|
|
@@ -225,22 +225,22 @@ const tt = (e) => {
|
|
|
225
225
|
let l = null;
|
|
226
226
|
const s = async (m) => {
|
|
227
227
|
if (!e || (console.log("vehicleInfo", m), !(m != null && m.lon && (m != null && m.lat)))) return;
|
|
228
|
-
const
|
|
229
|
-
i(m, ee(
|
|
230
|
-
const
|
|
231
|
-
|
|
232
|
-
}, i = (m,
|
|
233
|
-
const
|
|
228
|
+
const y = Math.abs(Number(m.lon)) > 180 ? je(m.lon, m.lat) : [m.lon, m.lat];
|
|
229
|
+
i(m, ee(y));
|
|
230
|
+
const k = e == null ? void 0 : e.getView(), P = new le(y);
|
|
231
|
+
k.setCenter(ke(P.getCoordinates(), K.data, K.mercator));
|
|
232
|
+
}, i = (m, y) => {
|
|
233
|
+
const k = `${it}map/car-icon.gif`;
|
|
234
234
|
l || (l = new ce({
|
|
235
235
|
element: document.createElement("div"),
|
|
236
236
|
positioning: "center-center",
|
|
237
237
|
stopEvent: !1
|
|
238
238
|
// 允许交互事件穿透
|
|
239
239
|
}), e.addOverlay(l));
|
|
240
|
-
const
|
|
241
|
-
|
|
242
|
-
const
|
|
243
|
-
|
|
240
|
+
const P = l.getElement();
|
|
241
|
+
P.style.backgroundImage = `url(${k})`, P.style.width = "80px", P.style.height = "80px";
|
|
242
|
+
const w = (m == null ? void 0 : m.drc) || "";
|
|
243
|
+
P.style.transform = `rotate(${w}deg)`, P.style.backgroundSize = "cover", l == null || l.setPosition(y);
|
|
244
244
|
};
|
|
245
245
|
return {
|
|
246
246
|
location: s,
|
|
@@ -248,8 +248,8 @@ const tt = (e) => {
|
|
|
248
248
|
const m = l == null ? void 0 : l.getElement();
|
|
249
249
|
m && (m.innerHTML = "");
|
|
250
250
|
},
|
|
251
|
-
renderTrack: (m,
|
|
252
|
-
r.render(m,
|
|
251
|
+
renderTrack: (m, y, k) => {
|
|
252
|
+
r.render(m, y, k, "truck", 1e3);
|
|
253
253
|
},
|
|
254
254
|
setCenter: (m) => {
|
|
255
255
|
r.setCenter(m);
|
|
@@ -257,8 +257,8 @@ const tt = (e) => {
|
|
|
257
257
|
closeTrack: () => {
|
|
258
258
|
r.close();
|
|
259
259
|
},
|
|
260
|
-
playTrack: (m,
|
|
261
|
-
r.play(m,
|
|
260
|
+
playTrack: (m, y) => {
|
|
261
|
+
r.play(m, y);
|
|
262
262
|
}
|
|
263
263
|
};
|
|
264
264
|
};
|
|
@@ -273,40 +273,40 @@ const so = (e) => {
|
|
|
273
273
|
positioning: "top-left",
|
|
274
274
|
className: "track-label-popup"
|
|
275
275
|
});
|
|
276
|
-
let t, n, m,
|
|
277
|
-
const
|
|
276
|
+
let t, n, m, y, k, P = !1, w = Date.now(), g, S = 0, C = null, b = 20;
|
|
277
|
+
const W = 8, A = [], q = (c) => {
|
|
278
278
|
var d;
|
|
279
|
-
for (
|
|
280
|
-
const
|
|
281
|
-
|
|
279
|
+
for (A.unshift(c); A.length > W; ) {
|
|
280
|
+
const v = A.pop(), M = r.get(v);
|
|
281
|
+
M && ((d = M.getSource()) == null || d.clear(), e == null || e.removeLayer(M), r.delete(v), delete l[v]);
|
|
282
282
|
}
|
|
283
283
|
};
|
|
284
|
-
let
|
|
284
|
+
let B = "";
|
|
285
285
|
const R = ["#ff0000", "#00ff00", "#0079ff", "#ffa500", "#800080", "#008080", "#ffc0cb", "#800000", "#000080", "#808000"], Z = Ne(() => {
|
|
286
286
|
if (s && l[s] && r.get(s).getVisible()) {
|
|
287
287
|
console.log("reRenderTrackLine------------");
|
|
288
|
-
const c =
|
|
288
|
+
const c = Dt(N(s, l[s]));
|
|
289
289
|
re(s, c);
|
|
290
290
|
}
|
|
291
|
-
}, 300),
|
|
292
|
-
let
|
|
293
|
-
const
|
|
294
|
-
return
|
|
295
|
-
if (Number(
|
|
296
|
-
const [$,
|
|
297
|
-
|
|
291
|
+
}, 300), N = (c, d) => {
|
|
292
|
+
let v = [];
|
|
293
|
+
const M = Math.max(1, Math.floor(d.length / b));
|
|
294
|
+
return v = d.filter((E, O) => O % M === 0).map((E, O) => {
|
|
295
|
+
if (Number(E.lon) > 180 || Number(E.lat) > 180) {
|
|
296
|
+
const [$, D] = je(E.lon, E.lat);
|
|
297
|
+
E.lon = $, E.lat = D;
|
|
298
298
|
}
|
|
299
|
-
return
|
|
300
|
-
}),
|
|
301
|
-
}, a = async (c, d,
|
|
302
|
-
if (!e || JSON.stringify(l[c]) === JSON.stringify(d) && s === c || (d = d == null ? void 0 : d.reverse(), h &&
|
|
299
|
+
return E.center = [E.lon, E.lat], E.centerPoint = ro(E.center), E.time = lt(E.createdAt).format("YYYY-MM-DD HH:mm:ss"), E.id = c, E.index = O, E;
|
|
300
|
+
}), v;
|
|
301
|
+
}, a = async (c, d, v, M = "ship", L = 200) => {
|
|
302
|
+
if (!e || JSON.stringify(l[c]) === JSON.stringify(d) && s === c || (d = d == null ? void 0 : d.reverse(), h && M === "ship" && (e != null && e.getOverlays().getArray().includes(h) || e.addOverlay(h)), (d == null ? void 0 : d.length) < 2))
|
|
303
303
|
return;
|
|
304
|
-
q(c), s = c, l[c] = d, b =
|
|
305
|
-
const
|
|
306
|
-
|
|
304
|
+
q(c), s = c, l[c] = d, b = L;
|
|
305
|
+
const E = Object.keys(l).findIndex((O) => O === c) || 0;
|
|
306
|
+
B = v || R[E > 10 ? 10 : E], await p(), await Je(s);
|
|
307
307
|
}, x = (c) => {
|
|
308
308
|
const d = new de();
|
|
309
|
-
return new
|
|
309
|
+
return new ye({
|
|
310
310
|
source: d,
|
|
311
311
|
visible: !1,
|
|
312
312
|
// 默认隐藏
|
|
@@ -314,32 +314,32 @@ const so = (e) => {
|
|
|
314
314
|
renderBuffer: 1024
|
|
315
315
|
// 增大渲染缓冲区
|
|
316
316
|
});
|
|
317
|
-
},
|
|
318
|
-
r.forEach((d,
|
|
319
|
-
var
|
|
320
|
-
const
|
|
321
|
-
d.getVisible() !==
|
|
317
|
+
}, f = (c) => {
|
|
318
|
+
r.forEach((d, v) => {
|
|
319
|
+
var L;
|
|
320
|
+
const M = v === c;
|
|
321
|
+
d.getVisible() !== M && (d.setVisible(M), e.getLayers().getArray().includes(d) || e.addLayer(d), M || (L = d.getSource()) == null || L.clear());
|
|
322
322
|
}), s = c;
|
|
323
|
-
},
|
|
323
|
+
}, p = async () => {
|
|
324
324
|
const c = s;
|
|
325
325
|
if (!r.has(c)) {
|
|
326
|
-
const
|
|
327
|
-
r.set(c,
|
|
326
|
+
const E = x(c);
|
|
327
|
+
r.set(c, E);
|
|
328
328
|
}
|
|
329
|
-
await
|
|
330
|
-
const d =
|
|
331
|
-
if (!(
|
|
332
|
-
let
|
|
333
|
-
|
|
334
|
-
const
|
|
335
|
-
|
|
336
|
-
},
|
|
337
|
-
const
|
|
338
|
-
if (
|
|
339
|
-
|
|
329
|
+
await f(c);
|
|
330
|
+
const d = B || "", v = l[c] || [];
|
|
331
|
+
if (!(v && v.length > 1)) return [];
|
|
332
|
+
let M = [];
|
|
333
|
+
M = N(c, v);
|
|
334
|
+
const L = M.map((E) => E.centerPoint);
|
|
335
|
+
M.length >= 2 && await T(c, L, d);
|
|
336
|
+
}, T = (c, d, v) => {
|
|
337
|
+
const M = new Pe(d), L = r.get(c).getSource(), E = L.getFeatureById(c);
|
|
338
|
+
if (E)
|
|
339
|
+
E.setGeometry(M), E.setId(c), E.setStyle(V(v)), C = E;
|
|
340
340
|
else {
|
|
341
|
-
const O = new ie({ geometry:
|
|
342
|
-
O.setId(c), O.set("type", "line"), O.setStyle(V(
|
|
341
|
+
const O = new ie({ geometry: M });
|
|
342
|
+
O.setId(c), O.set("type", "line"), O.setStyle(V(v)), L.addFeature(O), C = O;
|
|
343
343
|
}
|
|
344
344
|
return C;
|
|
345
345
|
}, V = (c) => new X({
|
|
@@ -347,15 +347,15 @@ const so = (e) => {
|
|
|
347
347
|
color: c,
|
|
348
348
|
width: 2
|
|
349
349
|
})
|
|
350
|
-
}),
|
|
351
|
-
const
|
|
352
|
-
if (c &&
|
|
353
|
-
e.getTargetElement().style.cursor =
|
|
354
|
-
const
|
|
355
|
-
O && (u.querySelector(".popup-content"), u.innerHTML =
|
|
350
|
+
}), G = (c, d, v) => {
|
|
351
|
+
const M = c == null ? void 0 : c.get("trackId");
|
|
352
|
+
if (c && M && d === "hover") {
|
|
353
|
+
e.getTargetElement().style.cursor = M ? "pointer" : "";
|
|
354
|
+
const L = c.get("data"), E = Q(L), O = v == null ? void 0 : v.coordinate;
|
|
355
|
+
O && (u.querySelector(".popup-content"), u.innerHTML = E, h == null || h.setPosition(O));
|
|
356
356
|
} else
|
|
357
357
|
h && h.setPosition(void 0);
|
|
358
|
-
},
|
|
358
|
+
}, Q = (c) => {
|
|
359
359
|
if (!(c != null && c.time)) return;
|
|
360
360
|
let d = "";
|
|
361
361
|
return c != null && c.stayTime && (d = `
|
|
@@ -396,42 +396,42 @@ const so = (e) => {
|
|
|
396
396
|
${d ?? d}
|
|
397
397
|
</div>`;
|
|
398
398
|
}, z = (c) => {
|
|
399
|
-
const
|
|
400
|
-
const
|
|
399
|
+
const v = c.map(($) => {
|
|
400
|
+
const D = e.getPixelFromCoordinate(ee($.center));
|
|
401
401
|
return {
|
|
402
402
|
...$,
|
|
403
403
|
original: $,
|
|
404
|
-
pixel:
|
|
404
|
+
pixel: D,
|
|
405
405
|
distance: 0
|
|
406
406
|
// 先初始化,后续计算
|
|
407
407
|
};
|
|
408
408
|
});
|
|
409
|
-
let
|
|
410
|
-
|
|
411
|
-
for (let $ = 1; $ <
|
|
412
|
-
const
|
|
413
|
-
|
|
409
|
+
let M = 0;
|
|
410
|
+
v[0].distance = 0;
|
|
411
|
+
for (let $ = 1; $ < v.length; $++) {
|
|
412
|
+
const D = v[$ - 1].pixel, H = v[$].pixel, _ = H[0] - D[0], F = H[1] - D[1];
|
|
413
|
+
M += Math.sqrt(_ * _ + F * F), v[$].distance = M;
|
|
414
414
|
}
|
|
415
|
-
const
|
|
416
|
-
($,
|
|
417
|
-
),
|
|
418
|
-
for (let $ = 0; $ <
|
|
419
|
-
const
|
|
420
|
-
if (
|
|
421
|
-
const H =
|
|
422
|
-
for (let
|
|
423
|
-
const J =
|
|
415
|
+
const L = v.filter(
|
|
416
|
+
($, D) => D === 0 || D === v.length - 1
|
|
417
|
+
), E = [];
|
|
418
|
+
for (let $ = 0; $ < L.length; $++) {
|
|
419
|
+
const D = L[$];
|
|
420
|
+
if (E.push(D), $ < L.length - 1) {
|
|
421
|
+
const H = L[$ + 1], _ = H.distance - D.distance, F = Math.floor(_ / 100);
|
|
422
|
+
for (let Y = 1; Y <= F; Y++) {
|
|
423
|
+
const J = D.distance + Y * 100;
|
|
424
424
|
if (J >= H.distance) break;
|
|
425
425
|
const U = ae(
|
|
426
|
-
|
|
426
|
+
v,
|
|
427
427
|
J
|
|
428
428
|
);
|
|
429
|
-
U &&
|
|
429
|
+
U && E.push(U);
|
|
430
430
|
}
|
|
431
431
|
}
|
|
432
432
|
}
|
|
433
433
|
return Array.from(
|
|
434
|
-
new Map(
|
|
434
|
+
new Map(E.map(($) => [$.distance.toFixed(2), $])).values()
|
|
435
435
|
).map(($) => ({
|
|
436
436
|
...$.original,
|
|
437
437
|
// 优先保留原始数据
|
|
@@ -444,14 +444,14 @@ const so = (e) => {
|
|
|
444
444
|
}));
|
|
445
445
|
};
|
|
446
446
|
function ae(c, d) {
|
|
447
|
-
for (let
|
|
448
|
-
const
|
|
449
|
-
if (d >=
|
|
450
|
-
const
|
|
447
|
+
for (let v = 1; v < c.length; v++) {
|
|
448
|
+
const M = c[v - 1], L = c[v];
|
|
449
|
+
if (d >= M.distance && d <= L.distance) {
|
|
450
|
+
const E = (d - M.distance) / (L.distance - M.distance), O = M.pixel[0] + E * (L.pixel[0] - M.pixel[0]), $ = M.pixel[1] + E * (L.pixel[1] - M.pixel[1]), D = e == null ? void 0 : e.getCoordinateFromPixel([O, $]);
|
|
451
451
|
return {
|
|
452
|
-
...
|
|
452
|
+
...M,
|
|
453
453
|
// 继承前一个点的属性(可调整)
|
|
454
|
-
coord:
|
|
454
|
+
coord: D,
|
|
455
455
|
pixel: [O, $],
|
|
456
456
|
distance: d,
|
|
457
457
|
original: void 0
|
|
@@ -463,9 +463,9 @@ const so = (e) => {
|
|
|
463
463
|
}
|
|
464
464
|
const re = async (c, d) => {
|
|
465
465
|
await be(), await pe(c);
|
|
466
|
-
const
|
|
467
|
-
r.get(c).getSource().addFeatures(
|
|
468
|
-
const O = Re(c,
|
|
466
|
+
const v = z(d), M = v.map((E) => se(E));
|
|
467
|
+
r.get(c).getSource().addFeatures(M), yt(c, v, d, B), v.forEach((E) => {
|
|
468
|
+
const O = Re(c, B, E);
|
|
469
469
|
e.addOverlay(O);
|
|
470
470
|
});
|
|
471
471
|
}, se = (c) => {
|
|
@@ -474,14 +474,14 @@ const so = (e) => {
|
|
|
474
474
|
data: c
|
|
475
475
|
});
|
|
476
476
|
d.set("type", "track_point"), d.set("trackId", c.id), d.set("data", c);
|
|
477
|
-
let
|
|
478
|
-
...ft(c,
|
|
477
|
+
let v = [
|
|
478
|
+
...ft(c, B)
|
|
479
479
|
];
|
|
480
|
-
return (c.index === 0 || c.index === l[c.id].length - 1) && (
|
|
481
|
-
}, Re = (c, d,
|
|
482
|
-
const
|
|
483
|
-
|
|
484
|
-
<span>${
|
|
480
|
+
return (c.index === 0 || c.index === l[c.id].length - 1) && (v = [...ht(c)], d.set("type", "track_begin")), c.state !== void 0 && c.state !== null && (v = [...vt(c)], d.set("type", "track_icon")), d.setStyle(v), d;
|
|
481
|
+
}, Re = (c, d, v) => {
|
|
482
|
+
const M = document.createElement("div");
|
|
483
|
+
M.className = "track-overlay-label", M.style.position = "relative", M.style.backgroundColor = "rgba(255,255,255,0.8)", M.style.border = `1px solid ${d}`, M.style.fontSize = "12px", M.innerHTML = `
|
|
484
|
+
<span>${v.time}</span>
|
|
485
485
|
<svg
|
|
486
486
|
style="position: absolute;right: -20px;top: 0;"
|
|
487
487
|
viewBox="0 0 20 20"
|
|
@@ -493,24 +493,24 @@ const so = (e) => {
|
|
|
493
493
|
stroke="${d}"
|
|
494
494
|
stroke-width="1" />
|
|
495
495
|
`;
|
|
496
|
-
const
|
|
497
|
-
element:
|
|
498
|
-
position: ee(
|
|
496
|
+
const L = new ce({
|
|
497
|
+
element: M,
|
|
498
|
+
position: ee(v.center),
|
|
499
499
|
positioning: "top-right",
|
|
500
500
|
offset: [-20, -20],
|
|
501
501
|
stopEvent: !1,
|
|
502
502
|
className: "track-label-time-overlay"
|
|
503
503
|
});
|
|
504
|
-
return
|
|
504
|
+
return L.set("class", "track-label-overlay"), L.set("trackId", c), L;
|
|
505
505
|
}, be = () => {
|
|
506
|
-
const c = e == null ? void 0 : e.getOverlays().getArray(), d = c == null ? void 0 : c.filter((
|
|
507
|
-
d && d.length > 0 && d.forEach((
|
|
508
|
-
|
|
506
|
+
const c = e == null ? void 0 : e.getOverlays().getArray(), d = c == null ? void 0 : c.filter((v) => v.get("class") === "track-label-overlay");
|
|
507
|
+
d && d.length > 0 && d.forEach((v) => {
|
|
508
|
+
v.setPosition(void 0), v.dispose();
|
|
509
509
|
});
|
|
510
510
|
}, pe = (c) => {
|
|
511
511
|
const d = r.get(c).getSource();
|
|
512
|
-
d.forEachFeature((
|
|
513
|
-
|
|
512
|
+
d.forEachFeature((v) => {
|
|
513
|
+
v.get("type") !== "line" && d.removeFeature(v);
|
|
514
514
|
});
|
|
515
515
|
}, ft = (c, d) => (`${c.time}`, [
|
|
516
516
|
new X({
|
|
@@ -523,149 +523,149 @@ const so = (e) => {
|
|
|
523
523
|
// 轨迹点样式
|
|
524
524
|
new X({
|
|
525
525
|
image: new Ve({
|
|
526
|
-
fill: new
|
|
526
|
+
fill: new j({ color: d }),
|
|
527
527
|
stroke: new ve({ color: "#fff", width: 2 }),
|
|
528
528
|
radius: 3
|
|
529
529
|
})
|
|
530
530
|
})
|
|
531
531
|
// textStyle,
|
|
532
532
|
]), vt = (c) => {
|
|
533
|
-
const d = "#E31818",
|
|
533
|
+
const d = "#E31818", v = "#1890FF", M = "", L = new X({
|
|
534
534
|
text: new ge({
|
|
535
535
|
font: "Normal 22px map-iconfont",
|
|
536
|
-
text: fe(
|
|
536
|
+
text: fe(M),
|
|
537
537
|
offsetY: -10,
|
|
538
|
-
fill: new
|
|
539
|
-
color: Number(c.state) === 0 ? d : Number(c.state) === 1 ?
|
|
538
|
+
fill: new j({
|
|
539
|
+
color: Number(c.state) === 0 ? d : Number(c.state) === 1 ? v : ""
|
|
540
540
|
})
|
|
541
541
|
}),
|
|
542
542
|
zIndex: 99
|
|
543
|
-
}), O = tt(""),
|
|
544
|
-
return Number(c.state) === 0 ? H.push(O) : Number(c.state) === 1 && H.push(
|
|
545
|
-
},
|
|
546
|
-
const
|
|
547
|
-
|
|
543
|
+
}), O = tt(""), D = tt(""), H = [];
|
|
544
|
+
return Number(c.state) === 0 ? H.push(O) : Number(c.state) === 1 && H.push(D), H.push(L), H;
|
|
545
|
+
}, yt = (c, d, v, M) => {
|
|
546
|
+
const L = d || [], E = d.length;
|
|
547
|
+
E || (L.push(v[0]), L.push(v[v.length - 1]));
|
|
548
548
|
const O = [];
|
|
549
|
-
for (let
|
|
549
|
+
for (let D = 0; D < E - 1; D++) {
|
|
550
550
|
let H;
|
|
551
|
-
const _ = d[
|
|
552
|
-
if (
|
|
553
|
-
H =
|
|
551
|
+
const _ = d[D], F = (d[D + 1].index + _.index) / 2;
|
|
552
|
+
if (F % 2 === 0)
|
|
553
|
+
H = v[F].centerPoint;
|
|
554
554
|
else {
|
|
555
|
-
const
|
|
556
|
-
if (
|
|
557
|
-
const [U, Ce] =
|
|
555
|
+
const Y = v[Math.floor(F)], J = v[Math.ceil(F)];
|
|
556
|
+
if (Y && J) {
|
|
557
|
+
const [U, Ce] = Y.centerPoint, [Le, Ee] = J.centerPoint;
|
|
558
558
|
H = [(U + Le) / 2, (Ce + Ee) / 2];
|
|
559
559
|
}
|
|
560
560
|
}
|
|
561
561
|
if (H) {
|
|
562
|
-
const
|
|
562
|
+
const Y = new ie({
|
|
563
563
|
geometry: new le(H)
|
|
564
564
|
});
|
|
565
|
-
|
|
565
|
+
Y.set("type", "track_arrow"), Y.setStyle(
|
|
566
566
|
new X({
|
|
567
567
|
text: new ge({
|
|
568
568
|
font: "700 12px map-iconfont",
|
|
569
569
|
text: fe(""),
|
|
570
|
-
fill: new
|
|
570
|
+
fill: new j({ color: M }),
|
|
571
571
|
// 设置箭头旋转 角度转为弧度
|
|
572
572
|
rotation: Ke(
|
|
573
|
-
d[
|
|
574
|
-
d[
|
|
573
|
+
d[D].center,
|
|
574
|
+
d[D + 1].center
|
|
575
575
|
) * (Math.PI / 180)
|
|
576
576
|
})
|
|
577
577
|
})
|
|
578
|
-
), O.push(
|
|
578
|
+
), O.push(Y);
|
|
579
579
|
}
|
|
580
580
|
}
|
|
581
581
|
const $ = r.get(c).getSource();
|
|
582
582
|
$ == null || $.addFeatures(O);
|
|
583
583
|
}, Je = (c) => {
|
|
584
|
-
var
|
|
585
|
-
const d = e.getView(),
|
|
586
|
-
if (!
|
|
587
|
-
const
|
|
588
|
-
if (
|
|
584
|
+
var E, O;
|
|
585
|
+
const d = e.getView(), v = (E = r == null ? void 0 : r.get(c)) == null ? void 0 : E.getSource(), M = C || (c ? v == null ? void 0 : v.getFeatureById(c) : null);
|
|
586
|
+
if (!M) return;
|
|
587
|
+
const L = (O = M == null ? void 0 : M.getGeometry()) == null ? void 0 : O.getExtent();
|
|
588
|
+
if (L != null && L.length)
|
|
589
589
|
try {
|
|
590
|
-
const $ =
|
|
590
|
+
const $ = Gt(L, Math.max(L[2] - L[0], L[3] - L[1]) * 0.02);
|
|
591
591
|
d.fit($);
|
|
592
592
|
} catch ($) {
|
|
593
593
|
console.log($);
|
|
594
594
|
}
|
|
595
|
-
},
|
|
596
|
-
const d = "",
|
|
595
|
+
}, ht = (c) => {
|
|
596
|
+
const d = "", L = c.index === 0 ? "#fcdc3f" : "#ff0000";
|
|
597
597
|
return [new X({
|
|
598
598
|
text: new ge({
|
|
599
599
|
font: "Normal 14px map-iconfont",
|
|
600
600
|
text: fe(d),
|
|
601
|
-
fill: new
|
|
601
|
+
fill: new j({ color: L })
|
|
602
602
|
}),
|
|
603
603
|
zIndex: 101
|
|
604
604
|
})];
|
|
605
605
|
}, mt = () => {
|
|
606
606
|
console.log("清除所有的轨迹-----"), Me(), r.forEach((d) => {
|
|
607
|
-
var
|
|
608
|
-
(
|
|
607
|
+
var v;
|
|
608
|
+
(v = d.getSource()) == null || v.clear(), e == null || e.removeLayer(d);
|
|
609
609
|
}), Object.keys(l).forEach((d) => {
|
|
610
610
|
r.delete(d), delete l[d];
|
|
611
611
|
}), isRender = !1, be();
|
|
612
612
|
}, wt = (c) => {
|
|
613
613
|
const d = r.get(c || s);
|
|
614
614
|
d == null || d.setVisible(!1);
|
|
615
|
-
const
|
|
616
|
-
for (let
|
|
617
|
-
const
|
|
618
|
-
|
|
615
|
+
const v = e.getOverlays().getArray();
|
|
616
|
+
for (let M = 0; M < v.length; ) {
|
|
617
|
+
const L = v[M];
|
|
618
|
+
L.get("class") === "track-label-overlay" ? (L.setPosition(void 0), e.removeOverlay(L)) : M++;
|
|
619
619
|
}
|
|
620
620
|
Me();
|
|
621
621
|
}, xt = (c, d = xe.NM) => {
|
|
622
|
-
const
|
|
622
|
+
const v = {
|
|
623
623
|
id: c,
|
|
624
624
|
length: "--"
|
|
625
|
-
},
|
|
625
|
+
}, L = (l[c] || []).map(
|
|
626
626
|
(O) => ke([O.lon, O.lat], K.data, K.mercator)
|
|
627
|
-
),
|
|
628
|
-
return
|
|
627
|
+
), E = new Pe(L);
|
|
628
|
+
return v.length = oo(E, d) || "--", v;
|
|
629
629
|
}, bt = (c, d) => {
|
|
630
630
|
kt(String(c), d);
|
|
631
631
|
}, kt = (c, d) => {
|
|
632
|
-
const
|
|
633
|
-
|
|
632
|
+
const v = l[String(c)], M = v == null ? void 0 : v.map((L) => [L.lon, L.lat]);
|
|
633
|
+
M && Ct(M, d);
|
|
634
634
|
}, Ze = new X({
|
|
635
635
|
text: new ge({
|
|
636
636
|
font: "700 20px map-iconfont",
|
|
637
637
|
text: fe(""),
|
|
638
|
-
fill: new
|
|
638
|
+
fill: new j({ color: "#ff0000" }),
|
|
639
639
|
rotation: 0
|
|
640
640
|
// 初始旋转角度
|
|
641
641
|
})
|
|
642
642
|
}), pt = (c, d) => {
|
|
643
|
-
var
|
|
644
|
-
const
|
|
645
|
-
if (
|
|
643
|
+
var F, Y;
|
|
644
|
+
const v = Number(50 * d), M = ((F = c.frameState) == null ? void 0 : F.time) ?? Date.now(), L = M - w;
|
|
645
|
+
if (S = (S + v * L / 1e6) % 2, w = M, S >= 1) {
|
|
646
646
|
Me();
|
|
647
647
|
return;
|
|
648
648
|
}
|
|
649
|
-
const
|
|
650
|
-
|
|
649
|
+
const E = n.getCoordinateAt(
|
|
650
|
+
S > 1 ? 2 - S : S
|
|
651
651
|
), O = n.getCoordinateAt(
|
|
652
|
-
|
|
652
|
+
S > 1 ? S - 0.01 : S
|
|
653
653
|
), $ = n.getCoordinateAt(
|
|
654
|
-
|
|
654
|
+
S > 1 ? 2 - S : S + 0.01
|
|
655
655
|
), H = Ke(
|
|
656
656
|
ot(O, "array"),
|
|
657
657
|
ot($, "array")
|
|
658
658
|
) * Math.PI / 180;
|
|
659
|
-
(
|
|
659
|
+
(Y = Ze.getText()) == null || Y.setRotation(H), y.setCoordinates(E);
|
|
660
660
|
const _ = At(c);
|
|
661
|
-
_.setStyle(Ze), _.drawGeometry(
|
|
661
|
+
_.setStyle(Ze), _.drawGeometry(y), e == null || e.render();
|
|
662
662
|
}, Mt = () => {
|
|
663
663
|
var c;
|
|
664
|
-
|
|
664
|
+
P = !0, w = Date.now(), S = 0, y = ((c = m.getGeometry()) == null ? void 0 : c.clone()) || new le([0, 0]), o && (g == null || g.on("postrender", o)), k == null || k.setGeometry(void 0);
|
|
665
665
|
}, Me = () => {
|
|
666
|
-
|
|
666
|
+
P && (P = !1, k == null || k.setGeometry(void 0), o && g && g.un("postrender", o), g && (e == null || e.removeLayer(g)), g = null, k = null);
|
|
667
667
|
}, Ct = (c, d) => {
|
|
668
|
-
|
|
668
|
+
P && Me(), t = new Ie({
|
|
669
669
|
factor: 1e6
|
|
670
670
|
}).writeGeometry(new Pe(c)), n = new Ie({
|
|
671
671
|
factor: 1e6
|
|
@@ -676,52 +676,52 @@ const so = (e) => {
|
|
|
676
676
|
type: "icon",
|
|
677
677
|
geometry: new le(n.getFirstCoordinate())
|
|
678
678
|
});
|
|
679
|
-
const
|
|
680
|
-
|
|
679
|
+
const v = m.getGeometry();
|
|
680
|
+
y = v ? v.clone() : new le([0, 0]), k = new ie({
|
|
681
681
|
type: "geoMarker",
|
|
682
682
|
style: Ze,
|
|
683
|
-
geometry:
|
|
684
|
-
}),
|
|
683
|
+
geometry: y
|
|
684
|
+
}), g = new ye({
|
|
685
685
|
source: new de({
|
|
686
|
-
features: [
|
|
686
|
+
features: [k]
|
|
687
687
|
})
|
|
688
|
-
}), e == null || e.addLayer(
|
|
689
|
-
}, Ke = (c, d,
|
|
690
|
-
function
|
|
691
|
-
return 180 * (
|
|
688
|
+
}), e == null || e.addLayer(g), o = (M) => pt(M, d), Mt();
|
|
689
|
+
}, Ke = (c, d, v) => {
|
|
690
|
+
function M(F) {
|
|
691
|
+
return 180 * (F % (2 * Math.PI)) / Math.PI;
|
|
692
692
|
}
|
|
693
|
-
function
|
|
694
|
-
return
|
|
693
|
+
function L(F) {
|
|
694
|
+
return F % 360 * Math.PI / 180;
|
|
695
695
|
}
|
|
696
|
-
function
|
|
697
|
-
var
|
|
698
|
-
if (!
|
|
699
|
-
if (!Array.isArray(
|
|
700
|
-
if ((
|
|
701
|
-
return
|
|
702
|
-
if (
|
|
696
|
+
function E(F) {
|
|
697
|
+
var Y;
|
|
698
|
+
if (!F) throw new Error("Coordinate is required");
|
|
699
|
+
if (!Array.isArray(F)) {
|
|
700
|
+
if ((F == null ? void 0 : F.type) === "Feature" && (F == null ? void 0 : F.geometry) !== null && ((Y = F == null ? void 0 : F.geometry) == null ? void 0 : Y.type) === "Point")
|
|
701
|
+
return F == null ? void 0 : F.geometry.coordinates;
|
|
702
|
+
if (F.type === "Point") return (F == null ? void 0 : F.coordinates) || [];
|
|
703
703
|
}
|
|
704
|
-
if (Array.isArray(
|
|
705
|
-
return
|
|
704
|
+
if (Array.isArray(F) && F.length >= 2 && !Array.isArray(F[0]) && !Array.isArray(F[1]))
|
|
705
|
+
return F;
|
|
706
706
|
throw new Error(
|
|
707
707
|
"Coordinate must be GeoJSON Point or an Array of numbers"
|
|
708
708
|
);
|
|
709
709
|
}
|
|
710
|
-
function O(
|
|
710
|
+
function O(F, Y, J = {}) {
|
|
711
711
|
if (J.final)
|
|
712
712
|
return function(Tt, Ft) {
|
|
713
713
|
return (O(Ft, Tt) + 180) % 360;
|
|
714
|
-
}(
|
|
715
|
-
const U =
|
|
716
|
-
return
|
|
714
|
+
}(F, Y);
|
|
715
|
+
const U = E(F), Ce = E(Y), Le = L(U[0]), Ee = L(Ce[0]), _e = L(U[1]), Ge = L(Ce[1]), Lt = Math.sin(Ee - Le) * Math.cos(Ge), Et = Math.cos(_e) * Math.sin(Ge) - Math.sin(_e) * Math.cos(Ge) * Math.cos(Ee - Le);
|
|
716
|
+
return M(Math.atan2(Lt, Et));
|
|
717
717
|
}
|
|
718
|
-
function $(
|
|
719
|
-
return !isNaN(
|
|
718
|
+
function $(F) {
|
|
719
|
+
return !isNaN(F) && F !== null && !Array.isArray(F);
|
|
720
720
|
}
|
|
721
|
-
function
|
|
722
|
-
return
|
|
721
|
+
function D(F, Y = {}, J = {}) {
|
|
722
|
+
return F || console.log("Coordinates are required"), Array.isArray(F) || console.log("Coordinates must be an Array"), F.length < 2 && console.log("Coordinates must be at least 2 numbers long"), (!$(F[0]) || !$(F[1])) && console.log("Coordinates must contain numbers"), H({ type: "Point", coordinates: F }, Y, J);
|
|
723
723
|
}
|
|
724
|
-
function H(
|
|
724
|
+
function H(F, Y = {}, J = {}) {
|
|
725
725
|
const U = {
|
|
726
726
|
type: "Feature",
|
|
727
727
|
id: "",
|
|
@@ -729,9 +729,9 @@ const so = (e) => {
|
|
|
729
729
|
bbox: {},
|
|
730
730
|
geometry: {}
|
|
731
731
|
};
|
|
732
|
-
return J.id !== void 0 && (U.id = J.id), J.bbox && (U.bbox = J.bbox), U.properties =
|
|
732
|
+
return J.id !== void 0 && (U.id = J.id), J.bbox && (U.bbox = J.bbox), U.properties = Y, U.geometry = F, U;
|
|
733
733
|
}
|
|
734
|
-
const _ = O(
|
|
734
|
+
const _ = O(D(c), D(d), v);
|
|
735
735
|
return _ < 0 ? 360 + _ : _;
|
|
736
736
|
};
|
|
737
737
|
return {
|
|
@@ -741,7 +741,7 @@ const so = (e) => {
|
|
|
741
741
|
setCenter: Je,
|
|
742
742
|
close: wt,
|
|
743
743
|
getLength: xt,
|
|
744
|
-
handleTrackMapEvent:
|
|
744
|
+
handleTrackMapEvent: G,
|
|
745
745
|
reRenderTrackLine: Z
|
|
746
746
|
};
|
|
747
747
|
};
|
|
@@ -878,7 +878,7 @@ function co(e, r, l, s) {
|
|
|
878
878
|
const ao = (e) => {
|
|
879
879
|
const { spd: r, hdg: l, cog: s } = e;
|
|
880
880
|
return r ? l !== null && +l != 511 && s !== null ? s - +l >= 3 ? oe.right : s - +l <= -3 ? oe.left : oe.front : oe.front : "";
|
|
881
|
-
},
|
|
881
|
+
}, he = (e, r) => {
|
|
882
882
|
const { shipData: l } = r.getProperties(), s = at(e), i = Qe(e, l, s);
|
|
883
883
|
return uo(r, i, s);
|
|
884
884
|
}, at = (e) => {
|
|
@@ -886,8 +886,8 @@ const ao = (e) => {
|
|
|
886
886
|
return r <= te.shipModelMax && r >= te.shipTriggleMin ? "ship" : "triangle";
|
|
887
887
|
}, Qe = (e, r, l) => {
|
|
888
888
|
if (l === "ship") {
|
|
889
|
-
const { len: s, wid: i } = r, o = 97, u = 20, t = 1 / (e == null ? void 0 : e.getView().getResolution()), n = s * t / o, m = i * t / u,
|
|
890
|
-
return
|
|
889
|
+
const { len: s, wid: i } = r, o = 97, u = 20, t = 1 / (e == null ? void 0 : e.getView().getResolution()), n = s * t / o, m = i * t / u, y = Math.min(n, m);
|
|
890
|
+
return y < 0.2 ? 0.2 : y > 2 ? 2 : y;
|
|
891
891
|
}
|
|
892
892
|
return te.scaleNum;
|
|
893
893
|
}, uo = (e, r, l) => {
|
|
@@ -984,47 +984,47 @@ function vo() {
|
|
|
984
984
|
];
|
|
985
985
|
return e[Math.floor(Math.random() * e.length)];
|
|
986
986
|
}
|
|
987
|
-
const
|
|
988
|
-
function
|
|
987
|
+
const yo = window.devicePixelRatio || 1;
|
|
988
|
+
function ho(e, r, l = "left-bottom", s = 2) {
|
|
989
989
|
const i = document.createElement("canvas"), o = i.getContext("2d");
|
|
990
990
|
if (!o) return "";
|
|
991
|
-
const u = 2, h = 8, t = 16, n = window.devicePixelRatio || 1, m = "500 12px Arial",
|
|
991
|
+
const u = 2, h = 8, t = 16, n = window.devicePixelRatio || 1, m = "500 12px Arial", y = "14px map-iconfont";
|
|
992
992
|
o.font = m;
|
|
993
|
-
const
|
|
994
|
-
o.font =
|
|
995
|
-
const
|
|
996
|
-
let
|
|
997
|
-
switch (
|
|
993
|
+
const P = o.measureText(e).width;
|
|
994
|
+
o.font = y;
|
|
995
|
+
const w = r.map((p) => ({ width: o.measureText(fe(p)).width, height: 14 })), g = w.reduce((p, T) => p + T.width, 0), S = (r.length - 1) * s, C = h + P + g + S + h, b = u + 14 + u;
|
|
996
|
+
let W, A, q = 0, B = 0, R = 0, Z = 0, N = 0, a = 0;
|
|
997
|
+
switch (W = t + C, l) {
|
|
998
998
|
case "right-top":
|
|
999
|
-
|
|
999
|
+
A = t + b, q = 0, B = t + b, R = t, Z = 0, N = t, a = 0;
|
|
1000
1000
|
break;
|
|
1001
1001
|
case "right-middle":
|
|
1002
|
-
|
|
1002
|
+
A = b, q = 0, B = b / 2, R = t, Z = b / 2, N = t, a = 0;
|
|
1003
1003
|
break;
|
|
1004
1004
|
case "right-bottom":
|
|
1005
|
-
|
|
1005
|
+
A = t + b, q = 0, B = 0, R = t, Z = t, N = t, a = t;
|
|
1006
1006
|
break;
|
|
1007
1007
|
case "left-top":
|
|
1008
|
-
|
|
1008
|
+
A = t + b, q = C, B = t, R = C + t, Z = b + t, N = 0, a = 0;
|
|
1009
1009
|
break;
|
|
1010
1010
|
case "left-middle":
|
|
1011
|
-
|
|
1011
|
+
A = b, q = C, B = b / 2, R = C + t, Z = b / 2, N = 0, a = 0;
|
|
1012
1012
|
break;
|
|
1013
1013
|
case "left-bottom":
|
|
1014
|
-
|
|
1014
|
+
A = t + b, q = C, B = b, R = C + t, Z = 0, N = 0, a = t;
|
|
1015
1015
|
break;
|
|
1016
1016
|
}
|
|
1017
|
-
|
|
1017
|
+
A = A + u, i.width = Math.round(W * n), i.height = Math.round(A * n), o.scale(n, n), o.clearRect(0, 0, W, A), o.beginPath(), o.moveTo(q, B), o.lineTo(R, Z), o.strokeStyle = "#FFF", o.lineWidth = 1, o.stroke(), o.fillStyle = "#FFF", o.fillRect(N, a, C, b), o.font = m, o.textBaseline = "middle";
|
|
1018
1018
|
const x = a + u + b / 2;
|
|
1019
|
-
o.strokeStyle = "#ffffff", o.lineWidth = 1, o.strokeText(e,
|
|
1020
|
-
let
|
|
1021
|
-
return r.length > 0 && r.forEach((
|
|
1019
|
+
o.strokeStyle = "#ffffff", o.lineWidth = 1, o.strokeText(e, N + h, x), o.fillStyle = "#000000", o.fillText(e, N + h, x), o.font = y, o.fillStyle = "#3370ff";
|
|
1020
|
+
let f = N + h + P + s;
|
|
1021
|
+
return r.length > 0 && r.forEach((p, T) => {
|
|
1022
1022
|
const V = a + u + b / 2;
|
|
1023
|
-
o.fillText(fe(
|
|
1023
|
+
o.fillText(fe(p), f, V), f += w[T].width + s;
|
|
1024
1024
|
}), i.toDataURL("image/png");
|
|
1025
1025
|
}
|
|
1026
1026
|
const nt = (e, r) => {
|
|
1027
|
-
const { name: l, rightIcons: s, selected: i } = e.getProperties(), o = r !== 1 ? vo() : "right-top", u =
|
|
1027
|
+
const { name: l, rightIcons: s, selected: i } = e.getProperties(), o = r !== 1 ? vo() : "right-top", u = ho(l, s, o);
|
|
1028
1028
|
let h = [0, 0];
|
|
1029
1029
|
switch (o) {
|
|
1030
1030
|
case "right-top":
|
|
@@ -1051,7 +1051,7 @@ const nt = (e, r) => {
|
|
|
1051
1051
|
src: u,
|
|
1052
1052
|
anchor: h,
|
|
1053
1053
|
displacement: [0, 0],
|
|
1054
|
-
scale: 1 /
|
|
1054
|
+
scale: 1 / yo,
|
|
1055
1055
|
anchorXUnits: "fraction",
|
|
1056
1056
|
anchorYUnits: "fraction"
|
|
1057
1057
|
}),
|
|
@@ -1065,7 +1065,7 @@ const nt = (e, r) => {
|
|
|
1065
1065
|
renderBuffer: 300,
|
|
1066
1066
|
zIndex: 101,
|
|
1067
1067
|
hitTolerance: 10
|
|
1068
|
-
}), o = new de(), u = new
|
|
1068
|
+
}), o = new de(), u = new ye({
|
|
1069
1069
|
source: o,
|
|
1070
1070
|
className: "zh-map--ship-label-layer",
|
|
1071
1071
|
zIndex: 102,
|
|
@@ -1075,18 +1075,18 @@ const nt = (e, r) => {
|
|
|
1075
1075
|
});
|
|
1076
1076
|
e == null || e.addLayer(i), e == null || e.addLayer(u);
|
|
1077
1077
|
let h = null, t = "", n = {}, m = {};
|
|
1078
|
-
const
|
|
1078
|
+
const y = (a) => {
|
|
1079
1079
|
if (!a || !e) return;
|
|
1080
1080
|
const x = (l == null ? void 0 : l.id) || (r == null ? void 0 : r.get("id"));
|
|
1081
1081
|
if (l) {
|
|
1082
|
-
const
|
|
1083
|
-
|
|
1082
|
+
const f = a.filter((p) => p.id === x);
|
|
1083
|
+
f.length === 0 ? a.push(l) : l = f[0];
|
|
1084
1084
|
}
|
|
1085
|
-
|
|
1086
|
-
},
|
|
1085
|
+
S(), C(!0), N(a), P();
|
|
1086
|
+
}, k = (a) => {
|
|
1087
1087
|
var z;
|
|
1088
|
-
const x = (l == null ? void 0 : l.id) || (r == null ? void 0 : r.get("id")),
|
|
1089
|
-
geometry: new le(
|
|
1088
|
+
const x = (l == null ? void 0 : l.id) || (r == null ? void 0 : r.get("id")), f = ee([a == null ? void 0 : a.lon, a == null ? void 0 : a.lat]), p = ((z = m[a.id]) == null ? void 0 : z.blinkColors) || [], V = p[p.length - 1] || a.fill || "#04C900", G = ao(a), Q = new ie({
|
|
1089
|
+
geometry: new le(f),
|
|
1090
1090
|
// 船舶数据
|
|
1091
1091
|
shipData: a,
|
|
1092
1092
|
id: a.id,
|
|
@@ -1101,166 +1101,166 @@ const nt = (e, r) => {
|
|
|
1101
1101
|
// 船舶颜色
|
|
1102
1102
|
color: V,
|
|
1103
1103
|
// 船艏向的方向
|
|
1104
|
-
direct:
|
|
1104
|
+
direct: G,
|
|
1105
1105
|
// 高亮
|
|
1106
1106
|
isHighlight: !1
|
|
1107
1107
|
});
|
|
1108
|
-
return
|
|
1109
|
-
},
|
|
1108
|
+
return Q.set("clickGeometry", new Yt(f)), Q;
|
|
1109
|
+
}, P = async () => {
|
|
1110
1110
|
if (!l || !e) return;
|
|
1111
|
-
let x = e.getOverlays().getArray().find((
|
|
1111
|
+
let x = e.getOverlays().getArray().find((f) => f.get("class") == "ship-overlay-selected");
|
|
1112
1112
|
if (x) {
|
|
1113
|
-
const
|
|
1114
|
-
await x.setElement(
|
|
1113
|
+
const f = dt(e, l);
|
|
1114
|
+
await x.setElement(f), await x.setPosition(ee([l.lon, l.lat]));
|
|
1115
1115
|
} else
|
|
1116
1116
|
x = go(e, l), x && e.addOverlay(x);
|
|
1117
1117
|
setTimeout(() => {
|
|
1118
|
-
var
|
|
1119
|
-
x && ((
|
|
1118
|
+
var f;
|
|
1119
|
+
x && ((f = x.get("element")) != null && f.parentElement) && (x.get("element").parentElement.style.display = "block");
|
|
1120
1120
|
}, 20);
|
|
1121
|
-
},
|
|
1121
|
+
}, w = (a) => {
|
|
1122
1122
|
if (a === "start") {
|
|
1123
1123
|
const x = () => {
|
|
1124
|
-
s.getFeatures().forEach((
|
|
1125
|
-
|
|
1124
|
+
s.getFeatures().forEach((f) => {
|
|
1125
|
+
f.setStyle(he(e, f));
|
|
1126
1126
|
}), h = requestAnimationFrame(x);
|
|
1127
1127
|
};
|
|
1128
1128
|
x();
|
|
1129
1129
|
}
|
|
1130
1130
|
a === "end" && h && (cancelAnimationFrame(h), h = null);
|
|
1131
|
-
},
|
|
1132
|
-
const x = (e == null ? void 0 : e.getOverlays().getArray()).find((
|
|
1131
|
+
}, g = () => {
|
|
1132
|
+
const x = (e == null ? void 0 : e.getOverlays().getArray()).find((f) => f.get("class") == "ship-overlay-selected");
|
|
1133
1133
|
if (x) {
|
|
1134
|
-
const
|
|
1135
|
-
console.log(
|
|
1134
|
+
const f = x.getElement(), p = Qe(e, l, "ship"), T = f.querySelector("svg");
|
|
1135
|
+
console.log(T), T && (T.style.transform = `scale(${p})`);
|
|
1136
1136
|
}
|
|
1137
|
-
},
|
|
1138
|
-
e && s && (s.clear(), o.clear(), C(),
|
|
1137
|
+
}, S = () => {
|
|
1138
|
+
e && s && (s.clear(), o.clear(), C(), w("end"));
|
|
1139
1139
|
}, C = (a) => {
|
|
1140
|
-
const x = e.getOverlays().getArray().filter((
|
|
1140
|
+
const x = e.getOverlays().getArray().filter((f) => f.get("class") == "zh-map-ship-overlay");
|
|
1141
1141
|
if (x && x.length > 0) {
|
|
1142
|
-
for (let
|
|
1143
|
-
if (!a && x[
|
|
1144
|
-
const
|
|
1145
|
-
|
|
1142
|
+
for (let f = 0; f < x.length; f++)
|
|
1143
|
+
if (!a && x[f].get("class") !== "ship-overlay-selected") {
|
|
1144
|
+
const p = x[f];
|
|
1145
|
+
p.setPosition(void 0), e.removeOverlay(p), p.dispose();
|
|
1146
1146
|
}
|
|
1147
1147
|
}
|
|
1148
1148
|
}, b = (a, x) => {
|
|
1149
1149
|
n = a, m = x;
|
|
1150
|
-
const
|
|
1151
|
-
for (const
|
|
1152
|
-
const V = n[
|
|
1153
|
-
if (
|
|
1154
|
-
const z = x[
|
|
1155
|
-
|
|
1150
|
+
const f = e.getOverlays().getArray(), p = s.getFeatures();
|
|
1151
|
+
for (const T in n) {
|
|
1152
|
+
const V = n[T], G = f.find((z) => z.getId() === "label-" + T), Q = p.find((z) => T === z.get("id"));
|
|
1153
|
+
if (G && Q) {
|
|
1154
|
+
const z = x[T].blinkColors || [], { shipData: ae, name: re, color: se } = Q.getProperties();
|
|
1155
|
+
Q.set("blinking", V), z[(z == null ? void 0 : z.length) - 1] && se !== z[(z == null ? void 0 : z.length) - 1] && (Q.set("color", z[(z == null ? void 0 : z.length) - 1] || ""), Q.setStyle(he(e, Q)));
|
|
1156
1156
|
const Re = {
|
|
1157
1157
|
...ae,
|
|
1158
1158
|
blinking: V,
|
|
1159
1159
|
blinkingColors: z || [],
|
|
1160
|
-
name: re + "(" + x[
|
|
1161
|
-
}, be =
|
|
1162
|
-
be && be !== pe &&
|
|
1160
|
+
name: re + "(" + x[T].shipState + ")"
|
|
1161
|
+
}, be = G.getElement(), pe = ut(Re);
|
|
1162
|
+
be && be !== pe && G.setElement(pe);
|
|
1163
1163
|
}
|
|
1164
1164
|
}
|
|
1165
|
-
},
|
|
1165
|
+
}, W = (a) => {
|
|
1166
1166
|
if (!e) return;
|
|
1167
|
-
const x = s.getFeatures(),
|
|
1167
|
+
const x = s.getFeatures(), f = o.getFeatures(), p = r ? r.get("id") : "", T = x.filter((z) => z.get("id") !== p), V = f == null ? void 0 : f.filter((z) => z.get("id") !== p), G = /* @__PURE__ */ new Map();
|
|
1168
1168
|
a.forEach((z) => {
|
|
1169
|
-
|
|
1169
|
+
G.set(z.id, !0);
|
|
1170
1170
|
});
|
|
1171
|
-
const
|
|
1172
|
-
|
|
1171
|
+
const Q = e.getOverlays().getArray();
|
|
1172
|
+
T.forEach((z) => {
|
|
1173
1173
|
const ae = z.get("id");
|
|
1174
|
-
if (!
|
|
1174
|
+
if (!G.has(ae))
|
|
1175
1175
|
z.setStyle([]);
|
|
1176
1176
|
else {
|
|
1177
1177
|
const se = z.getStyle();
|
|
1178
|
-
(se == null ? void 0 : se.length) == 0 && z.setStyle(
|
|
1178
|
+
(se == null ? void 0 : se.length) == 0 && z.setStyle(he(e, z));
|
|
1179
1179
|
}
|
|
1180
|
-
const re =
|
|
1180
|
+
const re = Q.find((se) => se.getId() === "label-" + ae);
|
|
1181
1181
|
re && re.setPosition(void 0);
|
|
1182
1182
|
}), console.log(V), V.forEach((z) => {
|
|
1183
1183
|
const ae = z.get("id");
|
|
1184
|
-
if (!
|
|
1184
|
+
if (!G.has(ae))
|
|
1185
1185
|
z.setStyle([]);
|
|
1186
1186
|
else {
|
|
1187
1187
|
const re = z.getStyle();
|
|
1188
1188
|
(re == null ? void 0 : re.length) == 0 && z.setStyle(nt(z));
|
|
1189
1189
|
}
|
|
1190
1190
|
});
|
|
1191
|
-
},
|
|
1191
|
+
}, A = (a) => {
|
|
1192
1192
|
if (a) {
|
|
1193
1193
|
console.log("选中", a);
|
|
1194
|
-
const x = s.getFeatures().find((
|
|
1195
|
-
x && (r = x),
|
|
1194
|
+
const x = s.getFeatures().find((p) => p.get("id") === a.id), f = o.getFeatures().find((p) => p.get("id") === a.id);
|
|
1195
|
+
x && (r = x), f && f.set("selected", !0), l = a, P();
|
|
1196
1196
|
} else
|
|
1197
1197
|
console.log("取消选中"), l = null, r = null, R();
|
|
1198
|
-
}, q = Ne((a, x,
|
|
1198
|
+
}, q = Ne((a, x, f) => {
|
|
1199
1199
|
try {
|
|
1200
1200
|
if (a) {
|
|
1201
|
-
const
|
|
1202
|
-
if (e.getTargetElement().style.cursor =
|
|
1203
|
-
t && t !==
|
|
1204
|
-
const V = s.getFeatures().find((
|
|
1205
|
-
V == null || V.set("isHighlight", !0), V == null || V.setStyle(
|
|
1201
|
+
const p = a.get("shipData"), T = a.get("id");
|
|
1202
|
+
if (e.getTargetElement().style.cursor = T ? "pointer" : "", x === "click" && (A(p), f && f(T)), x === "hover") {
|
|
1203
|
+
t && t !== T && B(), t = T;
|
|
1204
|
+
const V = s.getFeatures().find((G) => G.get("id") === t);
|
|
1205
|
+
V == null || V.set("isHighlight", !0), V == null || V.setStyle(he(e, V));
|
|
1206
1206
|
}
|
|
1207
1207
|
} else
|
|
1208
|
-
e.getTargetElement().style.cursor = "",
|
|
1209
|
-
} catch (
|
|
1210
|
-
console.log("handleShipMapEvent",
|
|
1208
|
+
e.getTargetElement().style.cursor = "", B();
|
|
1209
|
+
} catch (p) {
|
|
1210
|
+
console.log("handleShipMapEvent", p);
|
|
1211
1211
|
}
|
|
1212
|
-
}, 10),
|
|
1212
|
+
}, 10), B = () => {
|
|
1213
1213
|
const a = t ? s.getFeatures().find((x) => x.get("id") === t) : null;
|
|
1214
|
-
t = null, a == null || a.set("isHighlight", !1), a == null || a.setStyle(
|
|
1214
|
+
t = null, a == null || a.set("isHighlight", !1), a == null || a.setStyle(he(e, a));
|
|
1215
1215
|
}, R = () => {
|
|
1216
1216
|
try {
|
|
1217
|
-
const x = e.getOverlays().getArray().find((
|
|
1217
|
+
const x = e.getOverlays().getArray().find((f) => f.get("class") == "ship-overlay-selected");
|
|
1218
1218
|
x && x.setPosition(void 0);
|
|
1219
1219
|
} catch (a) {
|
|
1220
1220
|
console.log(a);
|
|
1221
1221
|
}
|
|
1222
1222
|
}, Z = (a, x) => {
|
|
1223
|
-
const
|
|
1224
|
-
geometry: new le(
|
|
1223
|
+
const f = ee([a == null ? void 0 : a.lon, a == null ? void 0 : a.lat]), p = new ie({
|
|
1224
|
+
geometry: new le(f),
|
|
1225
1225
|
name: a.cnname || a.enname || a.name || a.id || "未命名船舶",
|
|
1226
1226
|
// 图标
|
|
1227
1227
|
rightIcons: rt(a),
|
|
1228
1228
|
selected: (a == null ? void 0 : a.id) === (l == null ? void 0 : l.id),
|
|
1229
1229
|
shipData: a
|
|
1230
1230
|
});
|
|
1231
|
-
|
|
1232
|
-
const
|
|
1233
|
-
return
|
|
1234
|
-
},
|
|
1231
|
+
p.set("id", a.id);
|
|
1232
|
+
const T = nt(p, x);
|
|
1233
|
+
return p.setStyle(T), p;
|
|
1234
|
+
}, N = (a) => {
|
|
1235
1235
|
const x = e.getView().getZoom();
|
|
1236
|
-
a.forEach((
|
|
1237
|
-
const
|
|
1238
|
-
if (
|
|
1239
|
-
if (n[
|
|
1240
|
-
if (
|
|
1241
|
-
const
|
|
1242
|
-
...
|
|
1243
|
-
name:
|
|
1244
|
-
blinking: n[
|
|
1236
|
+
a.forEach((f) => {
|
|
1237
|
+
const p = k(f);
|
|
1238
|
+
if (p.setStyle(he(e, p)), s.addFeature(p), (l == null ? void 0 : l.id) == f.id || x >= te.shipModelMin)
|
|
1239
|
+
if (n[f.id]) {
|
|
1240
|
+
if (f.id && m[f == null ? void 0 : f.id]) {
|
|
1241
|
+
const T = m[f == null ? void 0 : f.id] || {}, V = (T == null ? void 0 : T.blinkColors) || [], G = (T == null ? void 0 : T.shipState) || "", Q = (f.cnname || f.enname || f.name || f.id || "未命名船舶") + "(" + G + ")", z = {
|
|
1242
|
+
...f,
|
|
1243
|
+
name: Q,
|
|
1244
|
+
blinking: n[f.id],
|
|
1245
1245
|
blinkingColors: V || []
|
|
1246
1246
|
};
|
|
1247
1247
|
fo(e, z);
|
|
1248
1248
|
}
|
|
1249
1249
|
} else {
|
|
1250
|
-
const
|
|
1251
|
-
o.addFeature(
|
|
1250
|
+
const T = Z(f, a.length);
|
|
1251
|
+
o.addFeature(T);
|
|
1252
1252
|
}
|
|
1253
1253
|
});
|
|
1254
1254
|
};
|
|
1255
1255
|
return {
|
|
1256
|
-
render:
|
|
1257
|
-
selected:
|
|
1258
|
-
filter:
|
|
1256
|
+
render: y,
|
|
1257
|
+
selected: A,
|
|
1258
|
+
filter: W,
|
|
1259
1259
|
blinking: b,
|
|
1260
|
-
clear:
|
|
1260
|
+
clear: S,
|
|
1261
1261
|
handleShipMapEvent: q,
|
|
1262
|
-
changeShipScale:
|
|
1263
|
-
changeSelectedScale:
|
|
1262
|
+
changeShipScale: w,
|
|
1263
|
+
changeSelectedScale: g
|
|
1264
1264
|
};
|
|
1265
1265
|
}, wo = (e) => {
|
|
1266
1266
|
const r = () => e == null ? void 0 : e.getLayers(), l = I("vector"), s = () => l.value, i = (t) => {
|
|
@@ -1277,17 +1277,17 @@ const nt = (e, r) => {
|
|
|
1277
1277
|
if (t !== o.value) {
|
|
1278
1278
|
if (t) {
|
|
1279
1279
|
const n = r();
|
|
1280
|
-
if (!n.getArray().find((
|
|
1281
|
-
const
|
|
1280
|
+
if (!n.getArray().find((y) => y.className_ === "greenTile")) {
|
|
1281
|
+
const y = new me({
|
|
1282
1282
|
source: new we({ url: ue.greenTile }),
|
|
1283
1283
|
visible: t,
|
|
1284
1284
|
zIndex: 2,
|
|
1285
1285
|
className: "greenTile"
|
|
1286
1286
|
});
|
|
1287
|
-
n.push(
|
|
1287
|
+
n.push(y);
|
|
1288
1288
|
}
|
|
1289
1289
|
} else {
|
|
1290
|
-
const n = r(), m = n.getArray().find((
|
|
1290
|
+
const n = r(), m = n.getArray().find((y) => y.className_ === "greenTile");
|
|
1291
1291
|
m && n.remove(m);
|
|
1292
1292
|
}
|
|
1293
1293
|
o.value = t;
|
|
@@ -1307,72 +1307,72 @@ const nt = (e, r) => {
|
|
|
1307
1307
|
}, bo = (e) => {
|
|
1308
1308
|
const r = "zh-map-location-layer";
|
|
1309
1309
|
let l, s, i = null, o = null;
|
|
1310
|
-
const u = (
|
|
1311
|
-
if (!(!
|
|
1310
|
+
const u = (w) => {
|
|
1311
|
+
if (!(!w || w.length === 0)) {
|
|
1312
1312
|
if (s || (s = new de()), s.clear(), o) {
|
|
1313
|
-
const
|
|
1314
|
-
|
|
1313
|
+
const g = w.find((S) => S.id === o.id);
|
|
1314
|
+
g ? o = g : w.push(o);
|
|
1315
1315
|
}
|
|
1316
|
-
|
|
1317
|
-
h(
|
|
1318
|
-
}), l || (l = new
|
|
1316
|
+
w.forEach((g) => {
|
|
1317
|
+
h(g);
|
|
1318
|
+
}), l || (l = new ye({
|
|
1319
1319
|
className: r,
|
|
1320
1320
|
source: s,
|
|
1321
1321
|
zIndex: 100
|
|
1322
1322
|
}), e == null || e.addLayer(l));
|
|
1323
1323
|
}
|
|
1324
|
-
}, h = (
|
|
1325
|
-
const
|
|
1326
|
-
geometry: new le(ee([Number(
|
|
1324
|
+
}, h = (w) => {
|
|
1325
|
+
const g = e == null ? void 0 : e.getView().getZoom(), [S, C] = w.latLon.split(","), b = new ie({
|
|
1326
|
+
geometry: new le(ee([Number(S), Number(C)]))
|
|
1327
1327
|
});
|
|
1328
|
-
b.setStyle(t(
|
|
1329
|
-
}, t = (
|
|
1328
|
+
b.setStyle(t(w, g, w.id === (o == null ? void 0 : o.id))), b.set("loactionData", w), s.addFeature(b);
|
|
1329
|
+
}, t = (w, g, S) => {
|
|
1330
1330
|
const C = {
|
|
1331
1331
|
image: new Oe({
|
|
1332
|
-
src:
|
|
1333
|
-
scale: 0.5 *
|
|
1332
|
+
src: S && w.selectedPath || w.defaultPath,
|
|
1333
|
+
scale: 0.5 * g / 10
|
|
1334
1334
|
})
|
|
1335
1335
|
};
|
|
1336
|
-
return
|
|
1337
|
-
text:
|
|
1336
|
+
return w.name && (C.text = new ge({
|
|
1337
|
+
text: w.name,
|
|
1338
1338
|
font: "12px sans-serif",
|
|
1339
|
-
fill: new
|
|
1339
|
+
fill: new j({
|
|
1340
1340
|
color: "#000000"
|
|
1341
1341
|
}),
|
|
1342
|
-
backgroundFill: new
|
|
1342
|
+
backgroundFill: new j({
|
|
1343
1343
|
color: "#FFFFFF"
|
|
1344
1344
|
}),
|
|
1345
1345
|
offsetY: 30
|
|
1346
1346
|
})), new X(C);
|
|
1347
1347
|
}, n = () => {
|
|
1348
1348
|
if (i) {
|
|
1349
|
-
const
|
|
1350
|
-
s.getFeatures().forEach((
|
|
1351
|
-
|
|
1349
|
+
const w = i.get("loactionData").id;
|
|
1350
|
+
s.getFeatures().forEach((g) => {
|
|
1351
|
+
g.get("loactionData").id !== w && s.removeFeature(g);
|
|
1352
1352
|
});
|
|
1353
1353
|
} else
|
|
1354
1354
|
s.clear();
|
|
1355
1355
|
}, m = () => {
|
|
1356
1356
|
var C;
|
|
1357
|
-
const
|
|
1357
|
+
const w = i.get("loactionData"), g = (C = e == null ? void 0 : e.getView()) == null ? void 0 : C.getZoom();
|
|
1358
1358
|
s.getFeatures().forEach((b) => {
|
|
1359
|
-
b.get("loactionData").id ===
|
|
1359
|
+
b.get("loactionData").id === w.id && (b == null || b.setStyle(t(w, g, !1)));
|
|
1360
1360
|
}), o = null, i = null;
|
|
1361
|
-
},
|
|
1362
|
-
|
|
1363
|
-
},
|
|
1364
|
-
var
|
|
1361
|
+
}, y = (w) => {
|
|
1362
|
+
w ? (k(), P(w)) : clearSelectedPort();
|
|
1363
|
+
}, k = () => {
|
|
1364
|
+
var w;
|
|
1365
1365
|
if (i) {
|
|
1366
|
-
const
|
|
1367
|
-
i.setStyle(t(
|
|
1366
|
+
const g = i.get("loactionData"), S = (w = e == null ? void 0 : e.getView()) == null ? void 0 : w.getZoom();
|
|
1367
|
+
i.setStyle(t(g, S, !1));
|
|
1368
1368
|
}
|
|
1369
|
-
},
|
|
1370
|
-
const
|
|
1371
|
-
o =
|
|
1369
|
+
}, P = (w) => {
|
|
1370
|
+
const g = s.getFeatures();
|
|
1371
|
+
o = w, i = g.find((S) => S.get("loactionData").id === w.id);
|
|
1372
1372
|
};
|
|
1373
1373
|
return {
|
|
1374
1374
|
render: u,
|
|
1375
|
-
selected:
|
|
1375
|
+
selected: y,
|
|
1376
1376
|
clearSelected: m,
|
|
1377
1377
|
clear: n
|
|
1378
1378
|
};
|
|
@@ -1388,18 +1388,18 @@ const nt = (e, r) => {
|
|
|
1388
1388
|
const l = e.getViewport();
|
|
1389
1389
|
l && (l.style.cursor = r);
|
|
1390
1390
|
}, Mo = (e, r) => {
|
|
1391
|
-
const l = I([]), s = I("km"), i = (
|
|
1392
|
-
s.value =
|
|
1391
|
+
const l = I([]), s = I("km"), i = (N) => {
|
|
1392
|
+
s.value = N;
|
|
1393
1393
|
};
|
|
1394
1394
|
let o;
|
|
1395
1395
|
const u = I(!1), h = () => {
|
|
1396
|
-
ze(e, "crosshair"), m(), ko(e), e.on("pointermove",
|
|
1396
|
+
ze(e, "crosshair"), m(), ko(e), e.on("pointermove", P), e.getViewport().addEventListener("mouseout", () => {
|
|
1397
1397
|
o && o.classList.add("hidden");
|
|
1398
|
-
}),
|
|
1398
|
+
}), g(), u.value = !0;
|
|
1399
1399
|
};
|
|
1400
1400
|
let t, n;
|
|
1401
1401
|
const m = () => {
|
|
1402
|
-
t = new de(), n = new
|
|
1402
|
+
t = new de(), n = new ye({
|
|
1403
1403
|
source: t,
|
|
1404
1404
|
zIndex: 1e3,
|
|
1405
1405
|
style: {
|
|
@@ -1411,20 +1411,20 @@ const nt = (e, r) => {
|
|
|
1411
1411
|
}
|
|
1412
1412
|
}), e == null || e.addLayer(n);
|
|
1413
1413
|
};
|
|
1414
|
-
let
|
|
1415
|
-
const
|
|
1416
|
-
if (
|
|
1414
|
+
let y, k;
|
|
1415
|
+
const P = (N) => {
|
|
1416
|
+
if (N.dragging)
|
|
1417
1417
|
return;
|
|
1418
1418
|
let a = "点击选择起点";
|
|
1419
|
-
|
|
1419
|
+
y && (a = "单击继续,双击结束"), o && (o.innerHTML = a, k.setPosition(N.coordinate), o.classList.remove("hidden"));
|
|
1420
1420
|
};
|
|
1421
|
-
let
|
|
1422
|
-
const
|
|
1423
|
-
|
|
1421
|
+
let w;
|
|
1422
|
+
const g = () => {
|
|
1423
|
+
w = new Se({
|
|
1424
1424
|
source: t,
|
|
1425
1425
|
type: "LineString",
|
|
1426
1426
|
style: new X({
|
|
1427
|
-
fill: new
|
|
1427
|
+
fill: new j({
|
|
1428
1428
|
color: "rgba(255, 255, 255, 0.2)"
|
|
1429
1429
|
}),
|
|
1430
1430
|
stroke: new ve({
|
|
@@ -1437,39 +1437,39 @@ const nt = (e, r) => {
|
|
|
1437
1437
|
stroke: new ve({
|
|
1438
1438
|
color: "rgba(0, 0, 0, 0.7)"
|
|
1439
1439
|
}),
|
|
1440
|
-
fill: new
|
|
1440
|
+
fill: new j({
|
|
1441
1441
|
color: "rgba(255, 255, 255, 0.2)"
|
|
1442
1442
|
})
|
|
1443
1443
|
})
|
|
1444
1444
|
}),
|
|
1445
1445
|
// 添加条件函数,判断是否应该出发点绘制
|
|
1446
1446
|
condition: (a) => a.originalEvent.target.tagName !== "DIV"
|
|
1447
|
-
}), e == null || e.addInteraction(
|
|
1448
|
-
let
|
|
1449
|
-
|
|
1450
|
-
var
|
|
1451
|
-
|
|
1447
|
+
}), e == null || e.addInteraction(w), W(), A();
|
|
1448
|
+
let N;
|
|
1449
|
+
w.on("drawstart", function(a) {
|
|
1450
|
+
var f;
|
|
1451
|
+
y = a.feature, y.set("randomId", S());
|
|
1452
1452
|
let x;
|
|
1453
|
-
|
|
1454
|
-
const
|
|
1455
|
-
x =
|
|
1453
|
+
N = (f = y.getGeometry()) == null ? void 0 : f.on("change", function(p) {
|
|
1454
|
+
const T = p.target, V = gt(T, s.value);
|
|
1455
|
+
x = T.getLastCoordinate(), C && V && (C.innerHTML = V), b.setPosition(x);
|
|
1456
1456
|
});
|
|
1457
|
-
}),
|
|
1458
|
-
var a, x,
|
|
1457
|
+
}), w.on("drawend", function() {
|
|
1458
|
+
var a, x, f;
|
|
1459
1459
|
if (C && (C.className = "ol-tooltip ol-tooltip-static ol-tooltip-measure"), C != null && C.innerHTML) {
|
|
1460
|
-
const
|
|
1461
|
-
l.value.push({ id:
|
|
1460
|
+
const p = (y == null ? void 0 : y.get("randomId")) || S();
|
|
1461
|
+
l.value.push({ id: p, value: C == null ? void 0 : C.innerHTML }), C.innerHTML = `${C.innerHTML}<div class="ol-tooltip-delete-button" data-id="${p}"><i class="map-iconfont icon-delete"></i></div>`;
|
|
1462
1462
|
}
|
|
1463
|
-
(a = document.querySelector(".ol-selectable:has(.ol-tooltip-delete-button):last-child .ol-tooltip-delete-button")) == null || a.addEventListener("click", (
|
|
1463
|
+
(a = document.querySelector(".ol-selectable:has(.ol-tooltip-delete-button):last-child .ol-tooltip-delete-button")) == null || a.addEventListener("click", (p) => {
|
|
1464
1464
|
var V;
|
|
1465
|
-
|
|
1466
|
-
const
|
|
1467
|
-
|
|
1468
|
-
}), b.setOffset([0, -7]),
|
|
1465
|
+
p.preventDefault(), p.stopPropagation();
|
|
1466
|
+
const T = (V = p.target) == null ? void 0 : V.getAttribute("data-id");
|
|
1467
|
+
T && B(T);
|
|
1468
|
+
}), b.setOffset([0, -7]), y = null, C = null, W(), N && We(N), (f = (x = r.getProps()) == null ? void 0 : x.lineDrawEnd) == null || f.call(x, l.value);
|
|
1469
1469
|
});
|
|
1470
|
-
},
|
|
1470
|
+
}, S = () => Math.random().toString(36).substring(2, 9);
|
|
1471
1471
|
let C, b;
|
|
1472
|
-
const
|
|
1472
|
+
const W = () => {
|
|
1473
1473
|
C != null && C.parentNode && C.parentNode.removeChild(C), C = document.createElement("div"), C.className = "ol-tooltip ol-tooltip-measure", b = new ce({
|
|
1474
1474
|
element: C,
|
|
1475
1475
|
offset: [0, -15],
|
|
@@ -1477,45 +1477,45 @@ const nt = (e, r) => {
|
|
|
1477
1477
|
stopEvent: !1,
|
|
1478
1478
|
insertFirst: !1
|
|
1479
1479
|
}), e == null || e.addOverlay(b);
|
|
1480
|
-
},
|
|
1481
|
-
o != null && o.parentNode && o.parentNode.removeChild(o), o = document.createElement("div"), o.className = "ol-tooltip hidden",
|
|
1480
|
+
}, A = () => {
|
|
1481
|
+
o != null && o.parentNode && o.parentNode.removeChild(o), o = document.createElement("div"), o.className = "ol-tooltip hidden", k = new ce({
|
|
1482
1482
|
element: o,
|
|
1483
1483
|
offset: [15, 0],
|
|
1484
1484
|
positioning: "center-left"
|
|
1485
|
-
}), e == null || e.addOverlay(
|
|
1485
|
+
}), e == null || e.addOverlay(k);
|
|
1486
1486
|
}, q = () => {
|
|
1487
|
-
l.value.forEach((
|
|
1488
|
-
var
|
|
1487
|
+
l.value.forEach((N, a) => {
|
|
1488
|
+
var p, T;
|
|
1489
1489
|
const x = document.querySelectorAll(".ol-tooltip.ol-tooltip-static.ol-tooltip-measure");
|
|
1490
|
-
x[a] && ((
|
|
1491
|
-
const
|
|
1492
|
-
|
|
1490
|
+
x[a] && ((T = (p = x[a]) == null ? void 0 : p.parentNode) == null || T.removeChild(x[a]));
|
|
1491
|
+
const f = t.getFeatures();
|
|
1492
|
+
f[a] && t.removeFeature(f[a]);
|
|
1493
1493
|
}), R(), po(e), u.value = !1, ze(e, "pointer");
|
|
1494
|
-
},
|
|
1495
|
-
var x,
|
|
1496
|
-
const a = l.value.findIndex((V) => V.id ===
|
|
1494
|
+
}, B = (N) => {
|
|
1495
|
+
var x, f, p, T;
|
|
1496
|
+
const a = l.value.findIndex((V) => V.id === N);
|
|
1497
1497
|
if (a !== -1) {
|
|
1498
1498
|
l.value.splice(a, 1);
|
|
1499
1499
|
const V = document.querySelectorAll(".ol-tooltip.ol-tooltip-static.ol-tooltip-measure");
|
|
1500
|
-
V[a] && ((
|
|
1501
|
-
const
|
|
1502
|
-
|
|
1500
|
+
V[a] && ((f = (x = V[a]) == null ? void 0 : x.parentNode) == null || f.removeChild(V[a]));
|
|
1501
|
+
const G = t.getFeatures();
|
|
1502
|
+
G[a] && t.removeFeature(G[a]);
|
|
1503
1503
|
}
|
|
1504
|
-
(
|
|
1504
|
+
(T = (p = r.getProps()) == null ? void 0 : p.lineDrawEnd) == null || T.call(p, l.value);
|
|
1505
1505
|
}, R = () => {
|
|
1506
|
-
if (l.value = [], document.querySelectorAll(".ol-tooltip.ol-tooltip-static").forEach((
|
|
1506
|
+
if (l.value = [], document.querySelectorAll(".ol-tooltip.ol-tooltip-static").forEach((N) => {
|
|
1507
1507
|
var a;
|
|
1508
|
-
(a =
|
|
1509
|
-
}), t == null || t.clear(),
|
|
1510
|
-
const
|
|
1511
|
-
|
|
1508
|
+
(a = N == null ? void 0 : N.parentNode) == null || a.removeChild(N);
|
|
1509
|
+
}), t == null || t.clear(), w) {
|
|
1510
|
+
const N = e.getInteractions().getArray().find((a) => et(a) === et(w));
|
|
1511
|
+
N && e.removeInteraction(N);
|
|
1512
1512
|
}
|
|
1513
1513
|
e.removeLayer(n), o != null && o.parentNode && o.parentNode.removeChild(o), C != null && C.parentNode && C.parentNode.removeChild(C);
|
|
1514
1514
|
};
|
|
1515
1515
|
return {
|
|
1516
1516
|
open: h,
|
|
1517
1517
|
close: q,
|
|
1518
|
-
deleteLine:
|
|
1518
|
+
deleteLine: B,
|
|
1519
1519
|
setUnit: i,
|
|
1520
1520
|
getState: () => u.value
|
|
1521
1521
|
};
|
|
@@ -1539,12 +1539,12 @@ const nt = (e, r) => {
|
|
|
1539
1539
|
const i = () => {
|
|
1540
1540
|
o(), ze(e, "crosshair");
|
|
1541
1541
|
}, o = () => {
|
|
1542
|
-
t(), C(),
|
|
1542
|
+
t(), C(), A(), P();
|
|
1543
1543
|
};
|
|
1544
1544
|
let u = null, h = null;
|
|
1545
1545
|
const t = () => {
|
|
1546
1546
|
if (u && h) return;
|
|
1547
|
-
const R = new de(), Z = new
|
|
1547
|
+
const R = new de(), Z = new ye({
|
|
1548
1548
|
source: R,
|
|
1549
1549
|
style: new X({
|
|
1550
1550
|
stroke: new ve({
|
|
@@ -1553,43 +1553,43 @@ const nt = (e, r) => {
|
|
|
1553
1553
|
})
|
|
1554
1554
|
})
|
|
1555
1555
|
});
|
|
1556
|
-
u = Z, h = R, e.on("pointermove", m), e.addLayer(Z), e.on(["dblclick"], function(
|
|
1557
|
-
|
|
1556
|
+
u = Z, h = R, e.on("pointermove", m), e.addLayer(Z), e.on(["dblclick"], function(N) {
|
|
1557
|
+
y && (N.stopPropagation(), N.preventDefault());
|
|
1558
1558
|
});
|
|
1559
1559
|
};
|
|
1560
1560
|
let n;
|
|
1561
1561
|
const m = (R) => {
|
|
1562
1562
|
if (R.dragging) return;
|
|
1563
1563
|
const Z = n ? "单击继续,双击结束" : "点击选择起点";
|
|
1564
|
-
b && (b.innerHTML = Z,
|
|
1564
|
+
b && (b.innerHTML = Z, W.setPosition(R.coordinate));
|
|
1565
1565
|
};
|
|
1566
|
-
let
|
|
1567
|
-
const
|
|
1566
|
+
let y, k = !1;
|
|
1567
|
+
const P = () => {
|
|
1568
1568
|
if (l) {
|
|
1569
1569
|
b != null && b.parentNode && b.parentNode.removeChild(b);
|
|
1570
1570
|
const R = l.getGeometry();
|
|
1571
1571
|
if (!R) return;
|
|
1572
|
-
const Z =
|
|
1573
|
-
|
|
1574
|
-
<span class="text">面积:${Z}${
|
|
1575
|
-
`),
|
|
1576
|
-
const
|
|
1577
|
-
if (
|
|
1578
|
-
const
|
|
1579
|
-
|
|
1572
|
+
const Z = w(R, "nm");
|
|
1573
|
+
g && (g.innerHTML = `
|
|
1574
|
+
<span class="text">面积:${Z}${k ? '<span class="error pl-12">超出可以绘画的距离</span>' : ""}</span>
|
|
1575
|
+
`), g && (g.innerHTML += '<span class="delete-icon" ><i class="map-iconfont icon-delete" /></div>');
|
|
1576
|
+
const N = R.getCoordinates(), a = N[0][N[0].length - 2];
|
|
1577
|
+
if (S.setPosition(a), u) {
|
|
1578
|
+
const f = u.getSource();
|
|
1579
|
+
f && l && (f.clear(), f.addFeature(l));
|
|
1580
1580
|
}
|
|
1581
1581
|
setTimeout(() => {
|
|
1582
|
-
var
|
|
1583
|
-
(
|
|
1584
|
-
var
|
|
1585
|
-
console.log("delete"), q(), (
|
|
1582
|
+
var f;
|
|
1583
|
+
(f = document.querySelector(".delete-icon")) == null || f.addEventListener("click", () => {
|
|
1584
|
+
var p, T;
|
|
1585
|
+
console.log("delete"), q(), (T = (p = r.getProps()) == null ? void 0 : p.areaDrawEnd) == null || T.call(p, []);
|
|
1586
1586
|
});
|
|
1587
1587
|
}, 0);
|
|
1588
1588
|
const x = qt(l.getGeometry().getExtent());
|
|
1589
1589
|
e == null || e.getView().setCenter(x);
|
|
1590
1590
|
return;
|
|
1591
1591
|
}
|
|
1592
|
-
|
|
1592
|
+
y = new Se({
|
|
1593
1593
|
type: "Polygon",
|
|
1594
1594
|
source: h,
|
|
1595
1595
|
trace: !0,
|
|
@@ -1599,13 +1599,13 @@ const nt = (e, r) => {
|
|
|
1599
1599
|
width: 1.5,
|
|
1600
1600
|
lineDash: [10, 10]
|
|
1601
1601
|
}),
|
|
1602
|
-
fill: new
|
|
1602
|
+
fill: new j({
|
|
1603
1603
|
color: "rgba(255, 255, 255, 0.25)"
|
|
1604
1604
|
})
|
|
1605
1605
|
}), new X({
|
|
1606
1606
|
image: new Ve({
|
|
1607
1607
|
radius: 5,
|
|
1608
|
-
fill: new
|
|
1608
|
+
fill: new j({
|
|
1609
1609
|
color: "rgb(51,112,255, 1)"
|
|
1610
1610
|
})
|
|
1611
1611
|
}),
|
|
@@ -1614,24 +1614,24 @@ const nt = (e, r) => {
|
|
|
1614
1614
|
return new Ht(Z);
|
|
1615
1615
|
}
|
|
1616
1616
|
})]
|
|
1617
|
-
}), e == null || e.addInteraction(
|
|
1617
|
+
}), e == null || e.addInteraction(y), y.on("drawstart", (R) => {
|
|
1618
1618
|
var Z;
|
|
1619
|
-
n = R.feature, s = (Z = n.getGeometry()) == null ? void 0 : Z.on("change", (
|
|
1620
|
-
const a =
|
|
1621
|
-
if (
|
|
1622
|
-
const
|
|
1623
|
-
|
|
1619
|
+
n = R.feature, s = (Z = n.getGeometry()) == null ? void 0 : Z.on("change", (N) => {
|
|
1620
|
+
const a = N.target, x = w(a, "nm"), p = a.getCoordinates()[0], T = new Pe([p[p.length - 2], p[p.length - 1]]), V = gt(T, "nm");
|
|
1621
|
+
if (k = Number(He(T) / 1e3) > 150, !x) return;
|
|
1622
|
+
const G = '<span class="error pl-4">超出可以绘画的距离</span>';
|
|
1623
|
+
g && (g.innerHTML = `
|
|
1624
1624
|
<div class="text">
|
|
1625
1625
|
面积:${x}
|
|
1626
|
-
${
|
|
1626
|
+
${k ? G : ""}
|
|
1627
1627
|
</div>
|
|
1628
1628
|
`), b && (b.innerHTML = `
|
|
1629
1629
|
<div class="text">
|
|
1630
1630
|
面积:${x}
|
|
1631
1631
|
</div>
|
|
1632
|
-
<div class="text ${
|
|
1633
|
-
线段 ${
|
|
1634
|
-
${
|
|
1632
|
+
<div class="text ${k ? "error" : ""}">
|
|
1633
|
+
线段 ${p.length - 2}: ${V}
|
|
1634
|
+
${k ? G : ""}
|
|
1635
1635
|
|
|
1636
1636
|
</div>
|
|
1637
1637
|
<div>
|
|
@@ -1639,91 +1639,97 @@ const nt = (e, r) => {
|
|
|
1639
1639
|
</div>
|
|
1640
1640
|
`);
|
|
1641
1641
|
});
|
|
1642
|
-
}),
|
|
1643
|
-
var x,
|
|
1642
|
+
}), y.on("drawend", (R) => {
|
|
1643
|
+
var x, f, p, T;
|
|
1644
1644
|
if (!R.feature.getGeometry()) return;
|
|
1645
|
-
|
|
1646
|
-
const
|
|
1647
|
-
if (
|
|
1648
|
-
const V =
|
|
1649
|
-
(
|
|
1645
|
+
g && !l && (g.innerHTML += '<span class="delete-icon"><i class="map-iconfont icon-delete" /></div>'), l = R.feature, S.setOffset([10, 0]);
|
|
1646
|
+
const N = R.feature.getGeometry().getCoordinates(), a = N[0][N[0].length - 2];
|
|
1647
|
+
if (S.setPosition(a), b != null && b.parentNode && b.parentNode.removeChild(b), (x = r.getProps()) != null && x.areaDrawEnd) {
|
|
1648
|
+
const V = N[0].map((G) => ke(G, K.mercator, K.data));
|
|
1649
|
+
(p = (f = r.getProps()) == null ? void 0 : f.areaDrawEnd) == null || p.call(f, V);
|
|
1650
1650
|
}
|
|
1651
|
-
|
|
1652
|
-
|
|
1653
|
-
})), s && We(s), (
|
|
1654
|
-
var V,
|
|
1655
|
-
q(), (
|
|
1651
|
+
y && (y.setActive(!1), e == null || e.removeInteraction(y), (e == null ? void 0 : e.getInteractions()).forEach((G) => {
|
|
1652
|
+
G instanceof Se && (G.setActive(!1), e == null || e.removeInteraction(G));
|
|
1653
|
+
})), s && We(s), (T = document.querySelector(".delete-icon")) == null || T.addEventListener("click", () => {
|
|
1654
|
+
var V, G;
|
|
1655
|
+
q(), (G = (V = r.getProps()) == null ? void 0 : V.areaDrawEnd) == null || G.call(V, []);
|
|
1656
1656
|
});
|
|
1657
1657
|
});
|
|
1658
|
-
},
|
|
1659
|
-
const
|
|
1658
|
+
}, w = (R, Z) => {
|
|
1659
|
+
const N = Bt(R);
|
|
1660
1660
|
switch (Z) {
|
|
1661
1661
|
case "km":
|
|
1662
|
-
return
|
|
1662
|
+
return N > 1e4 ? Math.round(N / 1e6 * 100) / 100 + " km<sup>2</sup>" : Math.round(N * 100) / 100 + " m<sup>2</sup>";
|
|
1663
1663
|
case "nm":
|
|
1664
|
-
return
|
|
1664
|
+
return N > 1e4 ? Math.round(N / 1e6 / Math.pow(1.852, 2) * 100) / 100 + " nm<sup>2</sup>" : Math.round(N * 100) / 100 + " m<sup>2</sup>";
|
|
1665
1665
|
}
|
|
1666
1666
|
};
|
|
1667
|
-
let
|
|
1667
|
+
let g, S;
|
|
1668
1668
|
const C = () => {
|
|
1669
|
-
|
|
1670
|
-
element:
|
|
1669
|
+
g != null && g.parentNode && g.parentNode.removeChild(g), g = document.createElement("div"), g.style.display = "flex", g.className = "ol-tooltip ol-tooltip-draw-polygon", S = new ce({
|
|
1670
|
+
element: g,
|
|
1671
1671
|
offset: [0, -15],
|
|
1672
1672
|
positioning: "bottom-center",
|
|
1673
1673
|
stopEvent: !1,
|
|
1674
1674
|
insertFirst: !1
|
|
1675
|
-
}), e == null || e.addOverlay(
|
|
1675
|
+
}), e == null || e.addOverlay(S);
|
|
1676
1676
|
};
|
|
1677
|
-
let b,
|
|
1678
|
-
const
|
|
1679
|
-
b != null && b.parentNode && b.parentNode.removeChild(b), b = document.createElement("div"), b.className = "ol-tooltip ol-help-tooltip",
|
|
1677
|
+
let b, W;
|
|
1678
|
+
const A = () => {
|
|
1679
|
+
b != null && b.parentNode && b.parentNode.removeChild(b), b = document.createElement("div"), b.className = "ol-tooltip ol-help-tooltip", W = new ce({
|
|
1680
1680
|
element: b,
|
|
1681
1681
|
offset: [15, 0],
|
|
1682
1682
|
positioning: "center-left"
|
|
1683
|
-
}), e == null || e.addOverlay(
|
|
1683
|
+
}), e == null || e.addOverlay(W);
|
|
1684
1684
|
}, q = () => {
|
|
1685
|
-
h == null || h.clear(), l = null, C(),
|
|
1685
|
+
h == null || h.clear(), l = null, C(), A(), P();
|
|
1686
1686
|
};
|
|
1687
1687
|
return {
|
|
1688
1688
|
open: i,
|
|
1689
1689
|
close: () => {
|
|
1690
|
-
h == null || h.clear(), h = null, u && (e.removeLayer(u), u = null), n = null,
|
|
1690
|
+
h == null || h.clear(), h = null, u && (e.removeLayer(u), u = null), n = null, y && (y.setActive(!1), (e == null ? void 0 : e.getInteractions()).forEach((Z) => {
|
|
1691
1691
|
Z instanceof Se && (Z.setActive(!1), e == null || e.removeInteraction(Z));
|
|
1692
|
-
}),
|
|
1692
|
+
}), y = null), s && We(s), b != null && b.parentElement && b.parentElement.removeChild(b), g != null && g.parentElement && g.parentElement.removeChild(g), W && e.removeOverlay(W), S && e.removeOverlay(S), ze(e, "pointer");
|
|
1693
1693
|
},
|
|
1694
1694
|
reset: q
|
|
1695
1695
|
};
|
|
1696
1696
|
}, Lo = "zh-map-port-layer", Eo = (e) => {
|
|
1697
|
-
const r = new de(), l = new
|
|
1697
|
+
const r = new de(), l = new ye({
|
|
1698
1698
|
className: Lo,
|
|
1699
1699
|
source: r,
|
|
1700
1700
|
zIndex: 100,
|
|
1701
|
-
updateWhileInteracting: !
|
|
1702
|
-
updateWhileAnimating: !
|
|
1701
|
+
updateWhileInteracting: !0,
|
|
1702
|
+
updateWhileAnimating: !0
|
|
1703
1703
|
});
|
|
1704
1704
|
e == null || e.addLayer(l);
|
|
1705
1705
|
let s = null, i = null;
|
|
1706
|
-
const o = (
|
|
1707
|
-
if (!
|
|
1708
|
-
|
|
1709
|
-
|
|
1710
|
-
|
|
1706
|
+
const o = (k, P = !0) => {
|
|
1707
|
+
if (!k || k.length === 0) return;
|
|
1708
|
+
if (r.clear(), i) {
|
|
1709
|
+
const g = k.find((S) => S.id === (i == null ? void 0 : i.id));
|
|
1710
|
+
g ? i = g : k.push(i);
|
|
1711
|
+
}
|
|
1712
|
+
const w = [];
|
|
1713
|
+
if (k.forEach((g) => {
|
|
1714
|
+
const [S, C] = g.latLon.split(","), b = new ie({
|
|
1715
|
+
geometry: new le(ee([Number(S), Number(C)])),
|
|
1716
|
+
portData: g,
|
|
1717
|
+
id: g.id,
|
|
1718
|
+
select: g.id === (i == null ? void 0 : i.id),
|
|
1719
|
+
showTitle: g.id === (i == null ? void 0 : i.id) || P
|
|
1720
|
+
}), W = u(b);
|
|
1721
|
+
b.setStyle(W), w.push(b);
|
|
1722
|
+
}), r.addFeatures(w), i) {
|
|
1723
|
+
console.log("selectedPortData-----------", i);
|
|
1724
|
+
const g = r.getFeatures().find((S) => S.get("id") === (i == null ? void 0 : i.id));
|
|
1725
|
+
if (console.log("feature-----------", g), g) {
|
|
1726
|
+
const S = g.getStyle();
|
|
1727
|
+
console.log("styles------------", S), S && S.getText().setBackgroundFill(new j({ color: "#FF5733" }));
|
|
1711
1728
|
}
|
|
1712
|
-
M.forEach((w) => {
|
|
1713
|
-
u(w, y);
|
|
1714
|
-
}), i && (console.log("selectedPortData", i), v(i));
|
|
1715
1729
|
}
|
|
1716
|
-
}, u = (
|
|
1717
|
-
const
|
|
1718
|
-
|
|
1719
|
-
portData: M,
|
|
1720
|
-
select: M.id === (i == null ? void 0 : i.id),
|
|
1721
|
-
showTitle: M.id === (i == null ? void 0 : i.id) || y
|
|
1722
|
-
}), b = h(C);
|
|
1723
|
-
C.setStyle(b), r.addFeature(C);
|
|
1724
|
-
}, h = (M) => {
|
|
1725
|
-
const { select: y, showTitle: w } = M.getProperties(), L = (Y) => `<svg width="46" height="46" viewBox="0 0 46 46" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
1726
|
-
<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="${Y}"/>
|
|
1730
|
+
}, u = (k) => {
|
|
1731
|
+
const { select: P, showTitle: w } = k.getProperties(), g = (q) => `<svg width="46" height="46" viewBox="0 0 46 46" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
1732
|
+
<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="${q}"/>
|
|
1727
1733
|
<g clip-path="url(#clip0_10059_122082)">
|
|
1728
1734
|
<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"/>
|
|
1729
1735
|
</g>
|
|
@@ -1733,75 +1739,75 @@ const nt = (e, r) => {
|
|
|
1733
1739
|
</clipPath>
|
|
1734
1740
|
</defs>
|
|
1735
1741
|
</svg>
|
|
1736
|
-
`,
|
|
1742
|
+
`, S = () => `data:image/svg+xml;utf8,${encodeURIComponent(g(P ? "#FF5733" : "#3370FF"))}`, C = e.getView().getZoom(), b = k.get("portData"), W = {
|
|
1737
1743
|
image: new Oe({
|
|
1738
|
-
src:
|
|
1739
|
-
scale: 0.5 *
|
|
1744
|
+
src: S(),
|
|
1745
|
+
scale: 0.5 * C / 10
|
|
1740
1746
|
}),
|
|
1741
|
-
zIndex:
|
|
1742
|
-
},
|
|
1747
|
+
zIndex: P ? 110 : 100
|
|
1748
|
+
}, A = {
|
|
1743
1749
|
text: new ge({
|
|
1744
|
-
text:
|
|
1750
|
+
text: b.shortName,
|
|
1745
1751
|
font: "12px sans-serif",
|
|
1746
|
-
fill: new
|
|
1747
|
-
color:
|
|
1752
|
+
fill: new j({
|
|
1753
|
+
color: P ? "#ffffff" : "#000000"
|
|
1748
1754
|
}),
|
|
1749
|
-
backgroundFill: new
|
|
1755
|
+
backgroundFill: new j({
|
|
1750
1756
|
color: "#FFF"
|
|
1751
1757
|
}),
|
|
1752
1758
|
offsetY: 30
|
|
1753
1759
|
})
|
|
1754
1760
|
};
|
|
1755
|
-
return !w && !
|
|
1756
|
-
...
|
|
1761
|
+
return !w && !P ? new X({
|
|
1762
|
+
...W
|
|
1757
1763
|
}) : new X({
|
|
1758
|
-
...
|
|
1759
|
-
...
|
|
1764
|
+
...W,
|
|
1765
|
+
...A
|
|
1760
1766
|
});
|
|
1761
|
-
},
|
|
1767
|
+
}, h = () => {
|
|
1762
1768
|
if (r)
|
|
1763
1769
|
if (s) {
|
|
1764
1770
|
console.log("清除非选中的港口");
|
|
1765
|
-
const
|
|
1766
|
-
r.getFeatures().forEach((
|
|
1767
|
-
|
|
1771
|
+
const k = s.get("portData").id;
|
|
1772
|
+
r.getFeatures().forEach((P) => {
|
|
1773
|
+
P.get("portData").id !== k && r.removeFeature(P);
|
|
1768
1774
|
});
|
|
1769
1775
|
} else
|
|
1770
1776
|
console.log("清除所有港口", r), r == null || r.clear();
|
|
1771
|
-
},
|
|
1777
|
+
}, t = (k) => {
|
|
1772
1778
|
if (r) {
|
|
1773
|
-
if (!
|
|
1774
|
-
return
|
|
1775
|
-
(s == null ? void 0 : s.get("portData").id) !==
|
|
1779
|
+
if (!k)
|
|
1780
|
+
return n();
|
|
1781
|
+
(s == null ? void 0 : s.get("portData").id) !== k.id && (n(), m(k));
|
|
1776
1782
|
}
|
|
1777
|
-
},
|
|
1778
|
-
var
|
|
1783
|
+
}, n = () => {
|
|
1784
|
+
var k;
|
|
1779
1785
|
if (s) {
|
|
1780
|
-
const
|
|
1786
|
+
const P = s == null ? void 0 : s.get("portData"), w = (k = r.getFeatures()) == null ? void 0 : k.find((g) => g.get("portData").id === P.id);
|
|
1781
1787
|
if (w) {
|
|
1782
|
-
const
|
|
1783
|
-
w.set("select", !1), w.setStyle(
|
|
1788
|
+
const g = u(w);
|
|
1789
|
+
w.set("select", !1), w.setStyle(g), s = null, i = null;
|
|
1784
1790
|
}
|
|
1785
1791
|
}
|
|
1786
|
-
},
|
|
1792
|
+
}, m = (k) => {
|
|
1787
1793
|
var w;
|
|
1788
1794
|
if (!r) return;
|
|
1789
|
-
const
|
|
1790
|
-
if (i =
|
|
1795
|
+
const P = r.getFeatures();
|
|
1796
|
+
if (i = k, s = P.find((g) => g.get("portData").id === k.id), s) {
|
|
1791
1797
|
s.set("select", !0);
|
|
1792
|
-
const
|
|
1793
|
-
|
|
1798
|
+
const g = u(s);
|
|
1799
|
+
g && ((w = g == null ? void 0 : g.getText()) == null || w.setBackgroundFill(new j({
|
|
1794
1800
|
color: "#FF5733"
|
|
1795
|
-
}))), s.setStyle(
|
|
1801
|
+
}))), s.setStyle(g);
|
|
1796
1802
|
}
|
|
1797
1803
|
};
|
|
1798
1804
|
return {
|
|
1799
1805
|
render: o,
|
|
1800
|
-
clear:
|
|
1801
|
-
selected:
|
|
1802
|
-
handlePortHover: (
|
|
1803
|
-
const
|
|
1804
|
-
|
|
1806
|
+
clear: h,
|
|
1807
|
+
selected: t,
|
|
1808
|
+
handlePortHover: (k) => {
|
|
1809
|
+
const P = e == null ? void 0 : e.getTargetElement();
|
|
1810
|
+
k && k.get("portData") && P && (P.style.cursor = "pointer");
|
|
1805
1811
|
}
|
|
1806
1812
|
};
|
|
1807
1813
|
}, To = (e, r, l, s, i, o) => {
|
|
@@ -1836,21 +1842,21 @@ const nt = (e, r) => {
|
|
|
1836
1842
|
var t, n, m;
|
|
1837
1843
|
try {
|
|
1838
1844
|
if (console.log("1", o.getState()), o.getState()) return;
|
|
1839
|
-
const
|
|
1840
|
-
if (!
|
|
1841
|
-
console.log("features------------",
|
|
1842
|
-
let
|
|
1843
|
-
if (
|
|
1844
|
-
|
|
1845
|
-
}),
|
|
1846
|
-
s.handleShipMapEvent(
|
|
1847
|
-
else if (
|
|
1848
|
-
const
|
|
1849
|
-
i.selected(
|
|
1845
|
+
const y = u.getFeaturesAtPixel(h.pixel);
|
|
1846
|
+
if (!y && y.length === 0) return;
|
|
1847
|
+
console.log("features------------", y);
|
|
1848
|
+
let k = null, P = null;
|
|
1849
|
+
if (y == null || y.forEach((w) => {
|
|
1850
|
+
w.get("shipData") && (k = w), w.get("portData") && (P = w);
|
|
1851
|
+
}), k)
|
|
1852
|
+
s.handleShipMapEvent(k, "click", (t = r.getProps()) == null ? void 0 : t.selectShip);
|
|
1853
|
+
else if (P) {
|
|
1854
|
+
const w = P.get("portData");
|
|
1855
|
+
i.selected(w), (m = (n = r.getProps()) == null ? void 0 : n.selectPort) == null || m.call(n, w);
|
|
1850
1856
|
}
|
|
1851
1857
|
h.preventDefault(), h.stopPropagation();
|
|
1852
|
-
} catch (
|
|
1853
|
-
console.log("click---catch",
|
|
1858
|
+
} catch (y) {
|
|
1859
|
+
console.log("click---catch", y);
|
|
1854
1860
|
}
|
|
1855
1861
|
}, 150)), u.getView().on("change:resolution", Ne(() => {
|
|
1856
1862
|
const h = u == null ? void 0 : u.getView().getZoom();
|
|
@@ -1864,11 +1870,11 @@ const nt = (e, r) => {
|
|
|
1864
1870
|
o.initMap(s, i);
|
|
1865
1871
|
const u = o.getInstall(), h = wo(u), t = xo();
|
|
1866
1872
|
t.setProps(i), h.setShowLayerType(i.layerType), h.setGreenTileVisible(i.showGreenLayer);
|
|
1867
|
-
const n = so(u), m = lo(u, n),
|
|
1868
|
-
To(o, t, n,
|
|
1869
|
-
const
|
|
1870
|
-
const b = u.getView().calculateExtent(o.getSize()),
|
|
1871
|
-
return [
|
|
1873
|
+
const n = so(u), m = lo(u, n), y = mo(u), k = bo(u), P = Mo(u, t), w = Co(u, t), g = Eo(u);
|
|
1874
|
+
To(o, t, n, y, g, P);
|
|
1875
|
+
const S = () => {
|
|
1876
|
+
const b = u.getView().calculateExtent(o.getSize()), W = ke([b[0], b[1]], K.mercator, K.data), A = ke([b[2], b[3]], K.mercator, K.data);
|
|
1877
|
+
return [W[0], W[1], A[0], A[1]];
|
|
1872
1878
|
}, C = {
|
|
1873
1879
|
id: Symbol("map-instance"),
|
|
1874
1880
|
innerMap: null,
|
|
@@ -1879,20 +1885,20 @@ const nt = (e, r) => {
|
|
|
1879
1885
|
methods: {
|
|
1880
1886
|
...o,
|
|
1881
1887
|
layer: h,
|
|
1882
|
-
ship:
|
|
1888
|
+
ship: y,
|
|
1883
1889
|
track: n,
|
|
1884
1890
|
carTrack: m,
|
|
1885
1891
|
port: {
|
|
1886
|
-
render:
|
|
1887
|
-
clear:
|
|
1888
|
-
selected:
|
|
1892
|
+
render: g.render,
|
|
1893
|
+
clear: g.clear,
|
|
1894
|
+
selected: g.selected
|
|
1889
1895
|
},
|
|
1890
|
-
position:
|
|
1891
|
-
drawLine:
|
|
1892
|
-
drawPolygon:
|
|
1896
|
+
position: k,
|
|
1897
|
+
drawLine: P,
|
|
1898
|
+
drawPolygon: w,
|
|
1893
1899
|
// 子模块
|
|
1894
1900
|
utils: {
|
|
1895
|
-
getCalculateExtent:
|
|
1901
|
+
getCalculateExtent: S,
|
|
1896
1902
|
convertSixHundredThousandToLatLng: je,
|
|
1897
1903
|
calculateCirclePoints: to
|
|
1898
1904
|
}
|
|
@@ -2144,7 +2150,7 @@ const nt = (e, r) => {
|
|
|
2144
2150
|
}
|
|
2145
2151
|
}
|
|
2146
2152
|
}), (t, n) => (Be(), qe("div", Po, [
|
|
2147
|
-
|
|
2153
|
+
De("div", {
|
|
2148
2154
|
id: "map",
|
|
2149
2155
|
ref_key: "zhMapRef",
|
|
2150
2156
|
ref: l,
|