gisviewer-vue3-arcgis 1.0.169 → 1.0.170
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/es/src/gis-map/gis-map.vue.mjs +48 -48
- package/es/src/gis-map/style/index.css +26 -0
- package/es/src/gis-map/utils/holo-flow/signal-countdown-panel.vue.mjs +120 -5
- package/es/src/gis-map/utils/holo-flow/signal-countdown-panel.vue2.mjs +2 -120
- package/es/style.css +1 -1
- package/lib/src/gis-map/gis-map.vue.js +1 -1
- package/lib/src/gis-map/style/index.css +26 -0
- package/lib/src/gis-map/utils/holo-flow/signal-countdown-panel.vue.js +1 -1
- package/lib/src/gis-map/utils/holo-flow/signal-countdown-panel.vue2.js +1 -1
- package/package.json +1 -1
- package/es/_virtual/_plugin-vue_export-helper.mjs +0 -9
- package/es/src/gis-map/utils/holo-flow/signal-countdown-panel.vue3.mjs +0 -4
- package/lib/_virtual/_plugin-vue_export-helper.js +0 -1
- package/lib/src/gis-map/utils/holo-flow/signal-countdown-panel.vue3.js +0 -1
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { defineComponent as xe, ref as O, onMounted as
|
|
2
|
-
import { storeToRefs as
|
|
3
|
-
import A, { registerStore as
|
|
1
|
+
import { defineComponent as xe, ref as O, onMounted as Be, getCurrentInstance as Pe, onUnmounted as Ve, computed as ze, openBlock as v, createElementBlock as k, createElementVNode as g, withDirectives as Ne, vShow as Qe, Fragment as je, renderList as Ee, unref as Ze, createBlock as $e } from "vue";
|
|
2
|
+
import { storeToRefs as qe } from "pinia";
|
|
3
|
+
import A, { registerStore as Ke } from "./stores/index.mjs";
|
|
4
4
|
import "./style/index.css";
|
|
5
5
|
import T from "./utils/holo-flow/index.mjs";
|
|
6
|
-
import
|
|
7
|
-
import
|
|
6
|
+
import Re from "./utils/holo-flow/signal-countdown-panel.vue.mjs";
|
|
7
|
+
import Ue from "./utils/map-initializer.mjs";
|
|
8
8
|
import L from "./utils/open-drive-renderer/index.mjs";
|
|
9
9
|
import D from "./utils/overlay.mjs";
|
|
10
10
|
import Ge from "./utils/queue-length.mjs";
|
|
@@ -20,48 +20,48 @@ const We = { class: "gis-viewer" }, Xe = { style: { position: "absolute", bottom
|
|
|
20
20
|
emits: ["mapLoaded", "markerClick", "mapClick"],
|
|
21
21
|
setup(M, { expose: _, emit: H }) {
|
|
22
22
|
const d = O(null);
|
|
23
|
-
let
|
|
23
|
+
let o, l, c, s, a, n, p, t, r;
|
|
24
24
|
const f = O(!1);
|
|
25
|
-
|
|
26
|
-
const
|
|
27
|
-
|
|
25
|
+
Ke();
|
|
26
|
+
const h = A.useAppDataStore, { countdownPanels: x } = qe(h);
|
|
27
|
+
Be(async () => {
|
|
28
28
|
if (!d.value)
|
|
29
29
|
return;
|
|
30
30
|
document.addEventListener("keydown", (m) => {
|
|
31
31
|
m.ctrlKey && m.key === "i" && (f.value = !f.value);
|
|
32
32
|
});
|
|
33
|
-
const e =
|
|
34
|
-
i.assetsRoot =
|
|
33
|
+
const e = Pe(), { $gisviewerAssetsRoot: u } = e.appContext.config.globalProperties, i = await (await fetch(C.config)).json();
|
|
34
|
+
i.assetsRoot = C.assetsRoot || u, h.mapConfig = i, l = new Ue(), o = await l.initialize({
|
|
35
35
|
container: d.value,
|
|
36
36
|
mapConfig: i,
|
|
37
|
-
markerClickCallback: (m,
|
|
38
|
-
w("markerClick", m,
|
|
37
|
+
markerClickCallback: (m, y, S, He) => {
|
|
38
|
+
w("markerClick", m, y, S, He);
|
|
39
39
|
},
|
|
40
|
-
mapClickCallback: (m,
|
|
41
|
-
w("mapClick", m,
|
|
40
|
+
mapClickCallback: (m, y, S) => {
|
|
41
|
+
w("mapClick", m, y, S);
|
|
42
42
|
}
|
|
43
|
-
}), a = new T(
|
|
43
|
+
}), a = new T(o), await a.init(), w("mapLoaded");
|
|
44
44
|
}), Ve(() => {
|
|
45
|
-
r == null || r.clearSignalControlArea(), t == null || t.clearOpenDrive(), a.clearHoloTrace(), a.clearHoloSignal(),
|
|
45
|
+
r == null || r.clearSignalControlArea(), t == null || t.clearOpenDrive(), a.clearHoloTrace(), a.clearHoloSignal(), s == null || s.disconnectTrafficFlow();
|
|
46
46
|
});
|
|
47
|
-
const
|
|
47
|
+
const B = ze(() => o), P = () => {
|
|
48
48
|
const e = A.useAppDataStore;
|
|
49
49
|
e.saveTrackLog = !0;
|
|
50
50
|
}, V = () => {
|
|
51
51
|
a.downloadTrackLog();
|
|
52
52
|
}, z = async (e) => await l.setMapCenter(e), N = async (e) => await l.setMapCamera(e), Q = async (e) => await l.lookAt(e), j = (e) => l.setLayerVisibility(e), E = (e, u) => l.requestCoordinateTransform(e, u), Z = (e) => {
|
|
53
53
|
l.cancelCoordinateTransform(e);
|
|
54
|
-
},
|
|
54
|
+
}, $ = (e) => {
|
|
55
55
|
l.setMapZoomRange(e);
|
|
56
|
-
},
|
|
56
|
+
}, q = (e) => (c || (c = new b(o)), c.showLaneNumber(e)), K = () => {
|
|
57
57
|
c == null || c.clearLaneNumber();
|
|
58
|
-
},
|
|
58
|
+
}, R = async (e) => (c || (c = new b(o)), await c.initializeSearch(e)), U = async () => c == null ? void 0 : c.calCrossIndicatorArea(), G = async () => {
|
|
59
59
|
}, J = async (e, u) => {
|
|
60
|
-
|
|
60
|
+
s || (s = new Je(o)), s.connectTrafficFlow(e, u);
|
|
61
61
|
}, W = () => {
|
|
62
|
-
|
|
62
|
+
s == null || s.disconnectTrafficFlow();
|
|
63
63
|
}, X = async (e) => {
|
|
64
|
-
a || (a = new T(
|
|
64
|
+
a || (a = new T(o), await a.init()), a.handleVehicleTraceData(e);
|
|
65
65
|
}, Y = () => {
|
|
66
66
|
a.clearHoloTrace();
|
|
67
67
|
}, F = (e) => {
|
|
@@ -71,31 +71,31 @@ const We = { class: "gis-viewer" }, Xe = { style: { position: "absolute", bottom
|
|
|
71
71
|
}, te = () => {
|
|
72
72
|
a.clearHoloSignal();
|
|
73
73
|
}, ae = (e) => {
|
|
74
|
-
|
|
74
|
+
s == null || s.toggleTrafficInfo(e), a == null || a.toggleTrafficInfo(e);
|
|
75
75
|
}, ne = (e) => {
|
|
76
76
|
a == null || a.togglePause(e);
|
|
77
77
|
}, re = (e) => {
|
|
78
|
-
|
|
79
|
-
},
|
|
78
|
+
s == null || s.toggleTrafficObject(e), a == null || a.toggleTrafficObject(e);
|
|
79
|
+
}, se = (e) => {
|
|
80
80
|
a == null || a.updatePanelContent(e);
|
|
81
|
-
},
|
|
81
|
+
}, oe = async (e) => (n || (n = new D(o)), n.addOverlays(e)), ie = (e) => (n || (n = new D(o)), n.addMask(e)), ce = () => {
|
|
82
82
|
n == null || n.removeMask();
|
|
83
83
|
}, le = (e) => n == null ? void 0 : n.removeOverlaysByType(e), ue = (e) => n == null ? void 0 : n.removeOverlaysById(e), me = () => n == null ? void 0 : n.removeAllOverlays(), pe = () => {
|
|
84
84
|
n == null || n.showAllOverlays();
|
|
85
85
|
}, ge = (e) => {
|
|
86
|
-
p || (p = new Ge(
|
|
86
|
+
p || (p = new Ge(o)), p.updateQueueLength(e);
|
|
87
87
|
}, de = () => {
|
|
88
88
|
p == null || p.removeQueueLength();
|
|
89
|
-
}, fe = async (e, u) => (t || (t = new L(
|
|
89
|
+
}, fe = async (e, u) => (t || (t = new L(o)), await t.showOpenDriveFromServer(e, u)), we = async (e) => (t || (t = new L(o)), await t.clearOpenDrive(), await t.showOpenDriveFromFile(e)), ye = async () => await (t == null ? void 0 : t.clearOpenDrive()), Se = async (e) => t ? await (t == null ? void 0 : t.findSumo(e)) : {
|
|
90
90
|
status: -1,
|
|
91
91
|
message: "未加载OpenDrive地图"
|
|
92
92
|
}, ve = async (e) => t ? t.selectSumo(e) : {
|
|
93
93
|
status: -1,
|
|
94
94
|
message: "未加载OpenDrive地图"
|
|
95
|
-
},
|
|
95
|
+
}, he = async (e) => t ? t.unselectSumo(e) : {
|
|
96
96
|
status: -1,
|
|
97
97
|
message: "未加载OpenDrive地图"
|
|
98
|
-
},
|
|
98
|
+
}, Ce = async (e) => t ? await t.geometrySearch(e) : {
|
|
99
99
|
status: -1,
|
|
100
100
|
message: "未加载OpenDrive地图"
|
|
101
101
|
}, Oe = async (e) => t ? await t.getSumoInfo(e) : {
|
|
@@ -107,29 +107,29 @@ const We = { class: "gis-viewer" }, Xe = { style: { position: "absolute", bottom
|
|
|
107
107
|
}, Ae = async () => t ? t == null ? void 0 : t.clearSplitLane() : {
|
|
108
108
|
status: -1,
|
|
109
109
|
message: "未加载OpenDrive地图"
|
|
110
|
-
}, Te = (e) => (r || (r = new I(
|
|
110
|
+
}, Te = (e) => (r || (r = new I(o)), r.showSignalControlArea(e)), Le = () => {
|
|
111
111
|
r == null || r.clearSignalControlArea();
|
|
112
|
-
}, De = async (e) => r ? await r.locateSignalControlArea(e) : { status: -1, message: "未加载信号控制区" }, be = async (e) => r ? await r.highlightSignalControlArea(e) : { status: -1, message: "未加载信号控制区" }, Ie = () => r ? r.resetHighlight() : { status: -1, message: "未加载信号控制区" }, Me = (e) => (r || (r = new I(
|
|
112
|
+
}, De = async (e) => r ? await r.locateSignalControlArea(e) : { status: -1, message: "未加载信号控制区" }, be = async (e) => r ? await r.highlightSignalControlArea(e) : { status: -1, message: "未加载信号控制区" }, Ie = () => r ? r.resetHighlight() : { status: -1, message: "未加载信号控制区" }, Me = (e) => (r || (r = new I(o)), r.showSubSignalControlArea(e)), _e = () => r ? r.editSubSignalArea() : { status: -1, message: "未加载信号控制区" }, C = M, w = H;
|
|
113
113
|
return _({
|
|
114
|
-
mapViewer:
|
|
114
|
+
mapViewer: B,
|
|
115
115
|
setLayerVisibility: j,
|
|
116
116
|
setMapCenter: z,
|
|
117
117
|
lookAt: Q,
|
|
118
118
|
setMapCamera: N,
|
|
119
|
-
setMapZoomRange:
|
|
119
|
+
setMapZoomRange: $,
|
|
120
120
|
requestCoordinateTransform: E,
|
|
121
121
|
cancelCoordinateTransform: Z,
|
|
122
|
-
addOverlays:
|
|
122
|
+
addOverlays: oe,
|
|
123
123
|
addMask: ie,
|
|
124
124
|
removeMask: ce,
|
|
125
125
|
showAllOverlays: pe,
|
|
126
126
|
removeOverlaysByType: le,
|
|
127
127
|
removeOverlaysById: ue,
|
|
128
128
|
removeAllOverlays: me,
|
|
129
|
-
showLaneNumber:
|
|
130
|
-
clearLaneNumber:
|
|
131
|
-
initializeAreaTool:
|
|
132
|
-
calCrossIndicatorArea:
|
|
129
|
+
showLaneNumber: q,
|
|
130
|
+
clearLaneNumber: K,
|
|
131
|
+
initializeAreaTool: R,
|
|
132
|
+
calCrossIndicatorArea: U,
|
|
133
133
|
calRoadIndicatorArea: G,
|
|
134
134
|
connectCarFlow: J,
|
|
135
135
|
disconnectCarFlow: W,
|
|
@@ -140,17 +140,17 @@ const We = { class: "gis-viewer" }, Xe = { style: { position: "absolute", bottom
|
|
|
140
140
|
setInterpolate: F,
|
|
141
141
|
toggleTrafficInfo: ae,
|
|
142
142
|
toggleTrafficObject: re,
|
|
143
|
-
toggleVehicleInfo:
|
|
143
|
+
toggleVehicleInfo: se,
|
|
144
144
|
togglePause: ne,
|
|
145
145
|
updateQueueLength: ge,
|
|
146
146
|
removeQueueLength: de,
|
|
147
147
|
showOpenDriveFromServer: fe,
|
|
148
148
|
showOpenDriveFromFile: we,
|
|
149
|
-
clearOpenDrive:
|
|
150
|
-
geometrySearchInOpenDrive:
|
|
151
|
-
findSumoInOpenDrive:
|
|
149
|
+
clearOpenDrive: ye,
|
|
150
|
+
geometrySearchInOpenDrive: Ce,
|
|
151
|
+
findSumoInOpenDrive: Se,
|
|
152
152
|
selectSumoInOpenDrive: ve,
|
|
153
|
-
unselectSumoInOpenDrive:
|
|
153
|
+
unselectSumoInOpenDrive: he,
|
|
154
154
|
getSumoInfo: Oe,
|
|
155
155
|
splitOpenDriveLane: ke,
|
|
156
156
|
clearSplitOpenDriveLane: Ae,
|
|
@@ -170,14 +170,14 @@ const We = { class: "gis-viewer" }, Xe = { style: { position: "absolute", bottom
|
|
|
170
170
|
Ne(g("div", Xe, [
|
|
171
171
|
g("button", {
|
|
172
172
|
style: { "margin-right": "10px" },
|
|
173
|
-
onClick:
|
|
173
|
+
onClick: P
|
|
174
174
|
}, " 开始记录 "),
|
|
175
175
|
g("button", { onClick: V }, "下载日志")
|
|
176
176
|
], 512), [
|
|
177
177
|
[Qe, f.value]
|
|
178
178
|
])
|
|
179
179
|
], 512),
|
|
180
|
-
(v(!0), k(je, null, Ee(Ze(x), (i, m) => (v(),
|
|
180
|
+
(v(!0), k(je, null, Ee(Ze(x), (i, m) => (v(), $e(Re, {
|
|
181
181
|
key: m,
|
|
182
182
|
"display-mode": i.displayMode,
|
|
183
183
|
"road-id": i.crossId,
|
|
@@ -11,3 +11,29 @@
|
|
|
11
11
|
.esri-view .esri-view-surface:focus::after {
|
|
12
12
|
outline: none !important;
|
|
13
13
|
}
|
|
14
|
+
.signal-countdown-panel {
|
|
15
|
+
position: absolute;
|
|
16
|
+
display: flex;
|
|
17
|
+
flex-direction: row;
|
|
18
|
+
padding: 0px;
|
|
19
|
+
margin: 0px;
|
|
20
|
+
}
|
|
21
|
+
.signal-countdown-container {
|
|
22
|
+
margin: 0 1px;
|
|
23
|
+
padding: 0px;
|
|
24
|
+
background-color: rgba(0, 0, 0, 0.8);
|
|
25
|
+
border-style: solid;
|
|
26
|
+
border-color: turquoise;
|
|
27
|
+
border-width: 2px;
|
|
28
|
+
border-radius: 5px;
|
|
29
|
+
color: white;
|
|
30
|
+
width: 40px;
|
|
31
|
+
height: 70px;
|
|
32
|
+
justify-content: center;
|
|
33
|
+
align-items: center;
|
|
34
|
+
display: flex;
|
|
35
|
+
flex-direction: column;
|
|
36
|
+
}
|
|
37
|
+
.signal-countdown-number {
|
|
38
|
+
font: 30px bold;
|
|
39
|
+
}
|
|
@@ -1,7 +1,122 @@
|
|
|
1
|
-
import o from "
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
import { defineComponent as C, computed as o, openBlock as l, createElementBlock as a, normalizeStyle as n, createElementVNode as s, toDisplayString as i, createCommentVNode as u } from "vue";
|
|
2
|
+
const b = {
|
|
3
|
+
key: 0,
|
|
4
|
+
class: "signal-countdown-container"
|
|
5
|
+
}, _ = ["src"], I = {
|
|
6
|
+
key: 1,
|
|
7
|
+
class: "signal-countdown-container"
|
|
8
|
+
}, N = ["src"], f = {
|
|
9
|
+
key: 2,
|
|
10
|
+
class: "signal-countdown-container"
|
|
11
|
+
}, $ = ["src"], k = {
|
|
12
|
+
key: 3,
|
|
13
|
+
class: "signal-countdown-container"
|
|
14
|
+
}, V = ["src"], A = /* @__PURE__ */ C({
|
|
15
|
+
__name: "signal-countdown-panel",
|
|
16
|
+
props: {
|
|
17
|
+
displayMode: {},
|
|
18
|
+
crossId: {},
|
|
19
|
+
roadId: {},
|
|
20
|
+
mapPoint: {},
|
|
21
|
+
stopLine: {},
|
|
22
|
+
scale: {},
|
|
23
|
+
position: {},
|
|
24
|
+
rotation: {},
|
|
25
|
+
lampStatus: {}
|
|
26
|
+
},
|
|
27
|
+
setup(c) {
|
|
28
|
+
const t = c, m = o(() => ({
|
|
29
|
+
top: `${t.position.top}px`,
|
|
30
|
+
left: `${t.position.left}px`,
|
|
31
|
+
"transform-origin": "bottom center",
|
|
32
|
+
transform: `translateX(-50%) translateY(-100%) rotate(${t.rotation}deg) scale(${t.scale})`
|
|
33
|
+
})), p = o(
|
|
34
|
+
() => `/GisViewerAssets/Images/SignalLamp/u-${t.lampStatus.uColor}.png`
|
|
35
|
+
), d = o(() => ({
|
|
36
|
+
color: r(t.lampStatus.uColor)
|
|
37
|
+
})), g = o(
|
|
38
|
+
() => `/GisViewerAssets/Images/SignalLamp/l-${t.lampStatus.lColor}.png`
|
|
39
|
+
), S = o(() => ({
|
|
40
|
+
color: r(t.lampStatus.lColor)
|
|
41
|
+
})), h = o(
|
|
42
|
+
() => `/GisViewerAssets/Images/SignalLamp/s-${t.lampStatus.sColor}.png`
|
|
43
|
+
), v = o(() => ({
|
|
44
|
+
color: r(t.lampStatus.sColor)
|
|
45
|
+
})), w = o(
|
|
46
|
+
() => `/GisViewerAssets/Images/SignalLamp/r-${t.lampStatus.rColor}.png`
|
|
47
|
+
), y = o(() => ({
|
|
48
|
+
color: r(t.lampStatus.rColor)
|
|
49
|
+
})), r = (e) => {
|
|
50
|
+
switch (e) {
|
|
51
|
+
case "red":
|
|
52
|
+
return "red";
|
|
53
|
+
case "yellow":
|
|
54
|
+
return "rgb(255, 192, 2)";
|
|
55
|
+
case "green":
|
|
56
|
+
return "lime";
|
|
57
|
+
default:
|
|
58
|
+
return "white";
|
|
59
|
+
}
|
|
60
|
+
};
|
|
61
|
+
return (e, L) => (l(), a("div", {
|
|
62
|
+
class: "signal-countdown-panel",
|
|
63
|
+
style: n(m.value)
|
|
64
|
+
}, [
|
|
65
|
+
e.lampStatus.uColor ? (l(), a("div", b, [
|
|
66
|
+
s("div", {
|
|
67
|
+
class: "signal-countdown-number",
|
|
68
|
+
style: n(d.value)
|
|
69
|
+
}, i(e.lampStatus.uNumber), 5),
|
|
70
|
+
s("div", null, [
|
|
71
|
+
s("img", {
|
|
72
|
+
src: p.value,
|
|
73
|
+
width: "20px",
|
|
74
|
+
height: "20px"
|
|
75
|
+
}, null, 8, _)
|
|
76
|
+
])
|
|
77
|
+
])) : u("", !0),
|
|
78
|
+
e.lampStatus.lColor ? (l(), a("div", I, [
|
|
79
|
+
s("div", {
|
|
80
|
+
class: "signal-countdown-number",
|
|
81
|
+
style: n(S.value)
|
|
82
|
+
}, i(e.lampStatus.lNumber), 5),
|
|
83
|
+
s("div", null, [
|
|
84
|
+
s("img", {
|
|
85
|
+
src: g.value,
|
|
86
|
+
width: "20px",
|
|
87
|
+
height: "20px"
|
|
88
|
+
}, null, 8, N)
|
|
89
|
+
])
|
|
90
|
+
])) : u("", !0),
|
|
91
|
+
e.lampStatus.sColor ? (l(), a("div", f, [
|
|
92
|
+
s("div", {
|
|
93
|
+
class: "signal-countdown-number",
|
|
94
|
+
style: n(v.value)
|
|
95
|
+
}, i(e.lampStatus.sNumber), 5),
|
|
96
|
+
s("div", null, [
|
|
97
|
+
s("img", {
|
|
98
|
+
src: h.value,
|
|
99
|
+
width: "20px",
|
|
100
|
+
height: "20px"
|
|
101
|
+
}, null, 8, $)
|
|
102
|
+
])
|
|
103
|
+
])) : u("", !0),
|
|
104
|
+
e.lampStatus.rColor !== void 0 ? (l(), a("div", k, [
|
|
105
|
+
s("div", {
|
|
106
|
+
class: "signal-countdown-number",
|
|
107
|
+
style: n(y.value)
|
|
108
|
+
}, i(e.lampStatus.rNumber), 5),
|
|
109
|
+
s("div", null, [
|
|
110
|
+
s("img", {
|
|
111
|
+
src: w.value,
|
|
112
|
+
width: "20px",
|
|
113
|
+
height: "20px"
|
|
114
|
+
}, null, 8, V)
|
|
115
|
+
])
|
|
116
|
+
])) : u("", !0)
|
|
117
|
+
], 4));
|
|
118
|
+
}
|
|
119
|
+
});
|
|
5
120
|
export {
|
|
6
|
-
|
|
121
|
+
A as default
|
|
7
122
|
};
|
|
@@ -1,122 +1,4 @@
|
|
|
1
|
-
import
|
|
2
|
-
const b = {
|
|
3
|
-
key: 0,
|
|
4
|
-
class: "signal-countdown-container"
|
|
5
|
-
}, _ = ["src"], I = {
|
|
6
|
-
key: 1,
|
|
7
|
-
class: "signal-countdown-container"
|
|
8
|
-
}, N = ["src"], f = {
|
|
9
|
-
key: 2,
|
|
10
|
-
class: "signal-countdown-container"
|
|
11
|
-
}, $ = ["src"], k = {
|
|
12
|
-
key: 3,
|
|
13
|
-
class: "signal-countdown-container"
|
|
14
|
-
}, V = ["src"], A = /* @__PURE__ */ C({
|
|
15
|
-
__name: "signal-countdown-panel",
|
|
16
|
-
props: {
|
|
17
|
-
displayMode: {},
|
|
18
|
-
crossId: {},
|
|
19
|
-
roadId: {},
|
|
20
|
-
mapPoint: {},
|
|
21
|
-
stopLine: {},
|
|
22
|
-
scale: {},
|
|
23
|
-
position: {},
|
|
24
|
-
rotation: {},
|
|
25
|
-
lampStatus: {}
|
|
26
|
-
},
|
|
27
|
-
setup(c) {
|
|
28
|
-
const t = c, m = o(() => ({
|
|
29
|
-
top: `${t.position.top}px`,
|
|
30
|
-
left: `${t.position.left}px`,
|
|
31
|
-
"transform-origin": "bottom center",
|
|
32
|
-
transform: `translateX(-50%) translateY(-100%) rotate(${t.rotation}deg) scale(${t.scale})`
|
|
33
|
-
})), p = o(
|
|
34
|
-
() => `/GisViewerAssets/Images/SignalLamp/u-${t.lampStatus.uColor}.png`
|
|
35
|
-
), d = o(() => ({
|
|
36
|
-
color: r(t.lampStatus.uColor)
|
|
37
|
-
})), g = o(
|
|
38
|
-
() => `/GisViewerAssets/Images/SignalLamp/l-${t.lampStatus.lColor}.png`
|
|
39
|
-
), S = o(() => ({
|
|
40
|
-
color: r(t.lampStatus.lColor)
|
|
41
|
-
})), h = o(
|
|
42
|
-
() => `/GisViewerAssets/Images/SignalLamp/s-${t.lampStatus.sColor}.png`
|
|
43
|
-
), v = o(() => ({
|
|
44
|
-
color: r(t.lampStatus.sColor)
|
|
45
|
-
})), w = o(
|
|
46
|
-
() => `/GisViewerAssets/Images/SignalLamp/r-${t.lampStatus.rColor}.png`
|
|
47
|
-
), y = o(() => ({
|
|
48
|
-
color: r(t.lampStatus.rColor)
|
|
49
|
-
})), r = (e) => {
|
|
50
|
-
switch (e) {
|
|
51
|
-
case "red":
|
|
52
|
-
return "red";
|
|
53
|
-
case "yellow":
|
|
54
|
-
return "rgb(255, 192, 2)";
|
|
55
|
-
case "green":
|
|
56
|
-
return "lime";
|
|
57
|
-
default:
|
|
58
|
-
return "white";
|
|
59
|
-
}
|
|
60
|
-
};
|
|
61
|
-
return (e, L) => (l(), a("div", {
|
|
62
|
-
class: "signal-countdown-panel",
|
|
63
|
-
style: n(m.value)
|
|
64
|
-
}, [
|
|
65
|
-
e.lampStatus.uColor ? (l(), a("div", b, [
|
|
66
|
-
s("div", {
|
|
67
|
-
class: "signal-countdown-number",
|
|
68
|
-
style: n(d.value)
|
|
69
|
-
}, i(e.lampStatus.uNumber), 5),
|
|
70
|
-
s("div", null, [
|
|
71
|
-
s("img", {
|
|
72
|
-
src: p.value,
|
|
73
|
-
width: "20px",
|
|
74
|
-
height: "20px"
|
|
75
|
-
}, null, 8, _)
|
|
76
|
-
])
|
|
77
|
-
])) : u("", !0),
|
|
78
|
-
e.lampStatus.lColor ? (l(), a("div", I, [
|
|
79
|
-
s("div", {
|
|
80
|
-
class: "signal-countdown-number",
|
|
81
|
-
style: n(S.value)
|
|
82
|
-
}, i(e.lampStatus.lNumber), 5),
|
|
83
|
-
s("div", null, [
|
|
84
|
-
s("img", {
|
|
85
|
-
src: g.value,
|
|
86
|
-
width: "20px",
|
|
87
|
-
height: "20px"
|
|
88
|
-
}, null, 8, N)
|
|
89
|
-
])
|
|
90
|
-
])) : u("", !0),
|
|
91
|
-
e.lampStatus.sColor ? (l(), a("div", f, [
|
|
92
|
-
s("div", {
|
|
93
|
-
class: "signal-countdown-number",
|
|
94
|
-
style: n(v.value)
|
|
95
|
-
}, i(e.lampStatus.sNumber), 5),
|
|
96
|
-
s("div", null, [
|
|
97
|
-
s("img", {
|
|
98
|
-
src: h.value,
|
|
99
|
-
width: "20px",
|
|
100
|
-
height: "20px"
|
|
101
|
-
}, null, 8, $)
|
|
102
|
-
])
|
|
103
|
-
])) : u("", !0),
|
|
104
|
-
e.lampStatus.rColor !== void 0 ? (l(), a("div", k, [
|
|
105
|
-
s("div", {
|
|
106
|
-
class: "signal-countdown-number",
|
|
107
|
-
style: n(y.value)
|
|
108
|
-
}, i(e.lampStatus.rNumber), 5),
|
|
109
|
-
s("div", null, [
|
|
110
|
-
s("img", {
|
|
111
|
-
src: w.value,
|
|
112
|
-
width: "20px",
|
|
113
|
-
height: "20px"
|
|
114
|
-
}, null, 8, V)
|
|
115
|
-
])
|
|
116
|
-
])) : u("", !0)
|
|
117
|
-
], 4));
|
|
118
|
-
}
|
|
119
|
-
});
|
|
1
|
+
import f from "./signal-countdown-panel.vue.mjs";
|
|
120
2
|
export {
|
|
121
|
-
|
|
3
|
+
f as default
|
|
122
4
|
};
|
package/es/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.gis-viewer{overflow:auto;scrollbar-width:none;-ms-overflow-style:none;&::-webkit-scrollbar{display:none}}
|
|
1
|
+
.gis-viewer{overflow:auto;scrollbar-width:none;-ms-overflow-style:none;&::-webkit-scrollbar{display:none}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("vue"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("vue"),qe=require("pinia"),S=require("./stores/index.js");require("./style/index.css");const O=require("./utils/holo-flow/index.js"),Ie=require("./utils/holo-flow/signal-countdown-panel.vue.js"),Me=require("./utils/map-initializer.js"),k=require("./utils/open-drive-renderer/index.js"),A=require("./utils/overlay.js"),xe=require("./utils/queue-length.js"),L=require("./utils/road-config-tool/index.js"),T=require("./utils/signal-control-area-controller/index.js"),Be=require("./utils/traffic-flow.js"),He={class:"gis-viewer"},Ve={style:{position:"absolute",bottom:"10px",left:"10px"}},Pe=n.defineComponent({__name:"gis-map",props:{config:{},assetsRoot:{}},emits:["mapLoaded","markerClick","mapClick"],setup(b,{expose:D,emit:_}){const p=n.ref(null);let i,u,l,o,a,r,g,t,s;const f=n.ref(!1);S.registerStore();const h=S.default.useAppDataStore,{countdownPanels:q}=qe.storeToRefs(h);n.onMounted(async()=>{if(!p.value)return;document.addEventListener("keydown",m=>{m.ctrlKey&&m.key==="i"&&(f.value=!f.value)});const e=n.getCurrentInstance(),{$gisviewerAssetsRoot:d}=e.appContext.config.globalProperties,c=await(await fetch(C.config)).json();c.assetsRoot=C.assetsRoot||d,h.mapConfig=c,u=new Me.default,i=await u.initialize({container:p.value,mapConfig:c,markerClickCallback:(m,y,v,_e)=>{w("markerClick",m,y,v,_e)},mapClickCallback:(m,y,v)=>{w("mapClick",m,y,v)}}),a=new O.default(i),await a.init(),w("mapLoaded")}),n.onUnmounted(()=>{s==null||s.clearSignalControlArea(),t==null||t.clearOpenDrive(),a.clearHoloTrace(),a.clearHoloSignal(),o==null||o.disconnectTrafficFlow()});const I=n.computed(()=>i),M=()=>{const e=S.default.useAppDataStore;e.saveTrackLog=!0},x=()=>{a.downloadTrackLog()},B=async e=>await u.setMapCenter(e),H=async e=>await u.setMapCamera(e),V=async e=>await u.lookAt(e),P=e=>u.setLayerVisibility(e),N=(e,d)=>u.requestCoordinateTransform(e,d),E=e=>{u.cancelCoordinateTransform(e)},j=e=>{u.setMapZoomRange(e)},z=e=>(l||(l=new L.default(i)),l.showLaneNumber(e)),Q=()=>{l==null||l.clearLaneNumber()},Z=async e=>(l||(l=new L.default(i)),await l.initializeSearch(e)),K=async()=>l==null?void 0:l.calCrossIndicatorArea(),U=async()=>{},G=async(e,d)=>{o||(o=new Be.default(i)),o.connectTrafficFlow(e,d)},J=()=>{o==null||o.disconnectTrafficFlow()},W=async e=>{a||(a=new O.default(i),await a.init()),a.handleVehicleTraceData(e)},X=()=>{a.clearHoloTrace()},Y=e=>{a.setInterpolate(e)},F=async e=>{await a.handleSignalData(e)},R=()=>{a.clearHoloSignal()},$=e=>{o==null||o.toggleTrafficInfo(e),a==null||a.toggleTrafficInfo(e)},ee=e=>{a==null||a.togglePause(e)},te=e=>{o==null||o.toggleTrafficObject(e),a==null||a.toggleTrafficObject(e)},ae=e=>{a==null||a.updatePanelContent(e)},ne=async e=>(r||(r=new A.default(i)),r.addOverlays(e)),re=e=>(r||(r=new A.default(i)),r.addMask(e)),se=()=>{r==null||r.removeMask()},oe=e=>r==null?void 0:r.removeOverlaysByType(e),ie=e=>r==null?void 0:r.removeOverlaysById(e),ce=()=>r==null?void 0:r.removeAllOverlays(),le=()=>{r==null||r.showAllOverlays()},ue=e=>{g||(g=new xe.default(i)),g.updateQueueLength(e)},de=()=>{g==null||g.removeQueueLength()},me=async(e,d)=>(t||(t=new k.default(i)),await t.showOpenDriveFromServer(e,d)),ge=async e=>(t||(t=new k.default(i)),await t.clearOpenDrive(),await t.showOpenDriveFromFile(e)),pe=async()=>await(t==null?void 0:t.clearOpenDrive()),fe=async e=>t?await(t==null?void 0:t.findSumo(e)):{status:-1,message:"未加载OpenDrive地图"},we=async e=>t?t.selectSumo(e):{status:-1,message:"未加载OpenDrive地图"},ye=async e=>t?t.unselectSumo(e):{status:-1,message:"未加载OpenDrive地图"},ve=async e=>t?await t.geometrySearch(e):{status:-1,message:"未加载OpenDrive地图"},Se=async e=>t?await t.getSumoInfo(e):{status:-1,message:"未加载OpenDrive地图"},he=async e=>t?await(t==null?void 0:t.splitLane(e)):{status:-1,message:"未加载OpenDrive地图"},Ce=async()=>t?t==null?void 0:t.clearSplitLane():{status:-1,message:"未加载OpenDrive地图"},Oe=e=>(s||(s=new T.default(i)),s.showSignalControlArea(e)),ke=()=>{s==null||s.clearSignalControlArea()},Ae=async e=>s?await s.locateSignalControlArea(e):{status:-1,message:"未加载信号控制区"},Le=async e=>s?await s.highlightSignalControlArea(e):{status:-1,message:"未加载信号控制区"},Te=()=>s?s.resetHighlight():{status:-1,message:"未加载信号控制区"},be=e=>(s||(s=new T.default(i)),s.showSubSignalControlArea(e)),De=()=>s?s.editSubSignalArea():{status:-1,message:"未加载信号控制区"},C=b,w=_;return D({mapViewer:I,setLayerVisibility:P,setMapCenter:B,lookAt:V,setMapCamera:H,setMapZoomRange:j,requestCoordinateTransform:N,cancelCoordinateTransform:E,addOverlays:ne,addMask:re,removeMask:se,showAllOverlays:le,removeOverlaysByType:oe,removeOverlaysById:ie,removeAllOverlays:ce,showLaneNumber:z,clearLaneNumber:Q,initializeAreaTool:Z,calCrossIndicatorArea:K,calRoadIndicatorArea:U,connectCarFlow:G,disconnectCarFlow:J,handleHoloVehicleTraceData:W,clearHoloTrace:X,handleHoloSignalData:F,clearHoloSignal:R,setInterpolate:Y,toggleTrafficInfo:$,toggleTrafficObject:te,toggleVehicleInfo:ae,togglePause:ee,updateQueueLength:ue,removeQueueLength:de,showOpenDriveFromServer:me,showOpenDriveFromFile:ge,clearOpenDrive:pe,geometrySearchInOpenDrive:ve,findSumoInOpenDrive:fe,selectSumoInOpenDrive:we,unselectSumoInOpenDrive:ye,getSumoInfo:Se,splitOpenDriveLane:he,clearSplitOpenDriveLane:Ce,showSignalControlArea:Oe,clearSignalControlArea:ke,locateSignalControlArea:Ae,highlightSignalControlArea:Le,resetHighlightSignalControlArea:Te,showSubSignalControlArea:be,editSubSignalControlArea:De}),(e,d)=>(n.openBlock(),n.createElementBlock("div",He,[n.createElementVNode("div",{class:"gis-viewer-main",ref_key:"mapContainer",ref:p},[n.withDirectives(n.createElementVNode("div",Ve,[n.createElementVNode("button",{style:{"margin-right":"10px"},onClick:M}," 开始记录 "),n.createElementVNode("button",{onClick:x},"下载日志")],512),[[n.vShow,f.value]])],512),(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(n.unref(q),(c,m)=>(n.openBlock(),n.createBlock(Ie.default,{key:m,"display-mode":c.displayMode,"road-id":c.crossId,"cross-id":c.roadId,"map-point":c.mapPoint,"stop-line":c.stopLine,position:c.position,rotation:c.rotation,scale:c.scale,"lamp-status":c.lampStatus},null,8,["display-mode","road-id","cross-id","map-point","stop-line","position","rotation","scale","lamp-status"]))),128))]))}});exports.default=Pe;
|
|
@@ -11,3 +11,29 @@
|
|
|
11
11
|
.esri-view .esri-view-surface:focus::after {
|
|
12
12
|
outline: none !important;
|
|
13
13
|
}
|
|
14
|
+
.signal-countdown-panel {
|
|
15
|
+
position: absolute;
|
|
16
|
+
display: flex;
|
|
17
|
+
flex-direction: row;
|
|
18
|
+
padding: 0px;
|
|
19
|
+
margin: 0px;
|
|
20
|
+
}
|
|
21
|
+
.signal-countdown-container {
|
|
22
|
+
margin: 0 1px;
|
|
23
|
+
padding: 0px;
|
|
24
|
+
background-color: rgba(0, 0, 0, 0.8);
|
|
25
|
+
border-style: solid;
|
|
26
|
+
border-color: turquoise;
|
|
27
|
+
border-width: 2px;
|
|
28
|
+
border-radius: 5px;
|
|
29
|
+
color: white;
|
|
30
|
+
width: 40px;
|
|
31
|
+
height: 70px;
|
|
32
|
+
justify-content: center;
|
|
33
|
+
align-items: center;
|
|
34
|
+
display: flex;
|
|
35
|
+
flex-direction: column;
|
|
36
|
+
}
|
|
37
|
+
.signal-countdown-number {
|
|
38
|
+
font: 30px bold;
|
|
39
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),g={key:0,class:"signal-countdown-container"},S=["src"],v={key:1,class:"signal-countdown-container"},y=["src"],N={key:2,class:"signal-countdown-container"},h=["src"],w={key:3,class:"signal-countdown-container"},V=["src"],C=e.defineComponent({__name:"signal-countdown-panel",props:{displayMode:{},crossId:{},roadId:{},mapPoint:{},stopLine:{},scale:{},position:{},rotation:{},lampStatus:{}},setup(n){const t=n,s=e.computed(()=>({top:`${t.position.top}px`,left:`${t.position.left}px`,"transform-origin":"bottom center",transform:`translateX(-50%) translateY(-100%) rotate(${t.rotation}deg) scale(${t.scale})`})),a=e.computed(()=>`/GisViewerAssets/Images/SignalLamp/u-${t.lampStatus.uColor}.png`),r=e.computed(()=>({color:l(t.lampStatus.uColor)})),c=e.computed(()=>`/GisViewerAssets/Images/SignalLamp/l-${t.lampStatus.lColor}.png`),i=e.computed(()=>({color:l(t.lampStatus.lColor)})),m=e.computed(()=>`/GisViewerAssets/Images/SignalLamp/s-${t.lampStatus.sColor}.png`),u=e.computed(()=>({color:l(t.lampStatus.sColor)})),d=e.computed(()=>`/GisViewerAssets/Images/SignalLamp/r-${t.lampStatus.rColor}.png`),p=e.computed(()=>({color:l(t.lampStatus.rColor)})),l=o=>{switch(o){case"red":return"red";case"yellow":return"rgb(255, 192, 2)";case"green":return"lime";default:return"white"}};return(o,E)=>(e.openBlock(),e.createElementBlock("div",{class:"signal-countdown-panel",style:e.normalizeStyle(s.value)},[o.lampStatus.uColor?(e.openBlock(),e.createElementBlock("div",g,[e.createElementVNode("div",{class:"signal-countdown-number",style:e.normalizeStyle(r.value)},e.toDisplayString(o.lampStatus.uNumber),5),e.createElementVNode("div",null,[e.createElementVNode("img",{src:a.value,width:"20px",height:"20px"},null,8,S)])])):e.createCommentVNode("",!0),o.lampStatus.lColor?(e.openBlock(),e.createElementBlock("div",v,[e.createElementVNode("div",{class:"signal-countdown-number",style:e.normalizeStyle(i.value)},e.toDisplayString(o.lampStatus.lNumber),5),e.createElementVNode("div",null,[e.createElementVNode("img",{src:c.value,width:"20px",height:"20px"},null,8,y)])])):e.createCommentVNode("",!0),o.lampStatus.sColor?(e.openBlock(),e.createElementBlock("div",N,[e.createElementVNode("div",{class:"signal-countdown-number",style:e.normalizeStyle(u.value)},e.toDisplayString(o.lampStatus.sNumber),5),e.createElementVNode("div",null,[e.createElementVNode("img",{src:m.value,width:"20px",height:"20px"},null,8,h)])])):e.createCommentVNode("",!0),o.lampStatus.rColor!==void 0?(e.openBlock(),e.createElementBlock("div",w,[e.createElementVNode("div",{class:"signal-countdown-number",style:e.normalizeStyle(p.value)},e.toDisplayString(o.lampStatus.rNumber),5),e.createElementVNode("div",null,[e.createElementVNode("img",{src:d.value,width:"20px",height:"20px"},null,8,V)])])):e.createCommentVNode("",!0)],4))}});exports.default=C;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./signal-countdown-panel.vue.js");exports.default=e.default;
|
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=(e,o)=>{const t=e.__vccOpts||e;for(const[r,s]of o)t[r]=s;return t};exports.default=u;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="";exports.default=e;
|