gisviewer-vue3-arcgis 1.0.90 → 1.0.91

package/es/src/gis-map/gis-map.vue.d.ts

@@ -1,6 +1,6 @@
 import MapView from '@arcgis/core/views/MapView';
 import SceneView from '@arcgis/core/views/SceneView';
-import { ILaneNumberParams, ILayerVisibleParams, ILookAtParams, IOverlayParam, IQueueLengthParams, ISetMapCameraParams, ISetMapCenterParams, IStartCrossBufferParam } from '../types';
+import { ILaneNumberParams, ILayerVisibleParams, ILookAtParams, IOverlayParam, IQueueLengthParams, ISetMapCameraParams, ISetMapCenterParams, IStartCrossBufferParam, IToggleTrafficInfoParams } from '../types';
 import HoloFlow from './utils/holo-flow';
 import MapInitializer from './utils/map-initializer';
 import OpenDriveRenderer from './utils/open-drive-renderer';
@@ -52,10 +52,8 @@ declare const _sfc_main: import("vue").DefineComponent<{
     clearHoloTrace: () => void;
     handleHoloSignalData: (signalData: any) => Promise<void>;
     clearHoloSignal: () => void;
-    toggleTrafficInfo: (params: {
-        name: string;
-        visible: boolean;
-    }) => void;
+    toggleTrafficInfo: (params: IToggleTrafficInfoParams) => void;
+    toggleTrafficObject: (params: IToggleTrafficInfoParams) => void;
     toggleVehicleInfo: (contentType: string) => void;
     addOverlays: (params: IOverlayParam) => Promise<import("../types").IResult>;
     removeOverlaysByType: (types: string[]) => import("../types").IResult;

package/es/src/gis-map/gis-map.vue.mjs

@@ -1,91 +1,89 @@
-import { defineComponent as ee, ref as te, onMounted as ae, getCurrentInstance as ne, computed as re, openBlock as oe, createElementBlock as se, createElementVNode as ie } from "vue";
-import ce, { registerStore as le } from "./stores/index.mjs";
+import { defineComponent as te, ref as ae, onMounted as ne, getCurrentInstance as re, computed as oe, openBlock as se, createElementBlock as ce, createElementVNode as ie } from "vue";
+import le, { registerStore as me } from "./stores/index.mjs";
 import "./style/index.css";
-import w from "./utils/holo-flow/index.mjs";
-import me from "./utils/map-initializer.mjs";
-import pe from "./utils/open-drive-renderer/index.mjs";
-import ue from "./utils/overlay.mjs";
+import g from "./utils/holo-flow/index.mjs";
+import pe from "./utils/map-initializer.mjs";
+import ue from "./utils/open-drive-renderer/index.mjs";
+import fe from "./utils/overlay.mjs";
 import de from "./utils/queue-length.mjs";
-import g from "./utils/road-config-tool/index.mjs";
-import fe from "./utils/traffic-flow.mjs";
-const we = { class: "gis-viewer" }, be = /* @__PURE__ */ ee({
+import v from "./utils/road-config-tool/index.mjs";
+import ge from "./utils/traffic-flow.mjs";
+const ye = { class: "gis-viewer" }, Le = /* @__PURE__ */ te({
   __name: "gis-map",
   props: {
     config: {},
     assetsRoot: {}
   },
   emits: ["mapLoaded", "markerClick", "mapClick"],
-  setup(v, { expose: h, emit: k }) {
-    const m = te(null);
-    let r, o, n, s, t, a, c, l;
-    le(), ae(async () => {
+  setup(w, { expose: O, emit: T }) {
+    const m = ae(null);
+    let o, s, n, r, t, a, i, l;
+    me(), ne(async () => {
       if (!m.value)
         return;
-      const e = ne(), { $gisviewerAssetsRoot: i } = e.appContext.config.globalProperties, C = await (await fetch(y.config)).json();
-      C.assetsRoot = y.assetsRoot || i;
-      const Y = ce.useAppDataStore;
-      Y.mapConfig = C, o = new me(), r = await o.initialize({
+      const e = re(), { $gisviewerAssetsRoot: c } = e.appContext.config.globalProperties, C = await (await fetch(y.config)).json();
+      C.assetsRoot = y.assetsRoot || c;
+      const F = le.useAppDataStore;
+      F.mapConfig = C, s = new pe(), o = await s.initialize({
         container: m.value,
-        markerClickCallback: (u, d, f, F) => {
-          p("markerClick", u, d, f, F);
+        markerClickCallback: (u, f, d, ee) => {
+          p("markerClick", u, f, d, ee);
         },
-        mapClickCallback: (u, d, f) => {
-          p("mapClick", u, d, f);
+        mapClickCallback: (u, f, d) => {
+          p("mapClick", u, f, d);
         }
-      }), t = new w(r), p("mapLoaded");
+      }), t = new g(o), p("mapLoaded");
     });
-    const O = re(() => r), L = async (e) => await o.setMapCenter(e), T = async (e) => await o.setMapCamera(e), A = async (e) => await o.lookAt(e), b = (e) => o.setLayerVisibility(e), I = (e, i) => o.requestCoordinateTransform(e, i), D = (e) => {
-      o.cancelCoordinateTransform(e);
+    const h = oe(() => o), k = async (e) => await s.setMapCenter(e), b = async (e) => await s.setMapCamera(e), A = async (e) => await s.lookAt(e), I = (e) => s.setLayerVisibility(e), L = (e, c) => s.requestCoordinateTransform(e, c), D = (e) => {
+      s.cancelCoordinateTransform(e);
     }, S = (e) => {
-      o.setMapZoomRange(e);
-    }, _ = (e) => (n || (n = new g(r)), n.showLaneNumber(e)), M = () => {
+      s.setMapZoomRange(e);
+    }, _ = (e) => (n || (n = new v(o)), n.showLaneNumber(e)), M = () => {
       n == null || n.clearLaneNumber();
-    }, R = async (e) => (n || (n = new g(r)), await n.initializeSearch(e)), V = async () => n == null ? void 0 : n.calCrossIndicatorArea(), x = async () => {
-    }, B = async (e, i) => {
-      s || (s = new fe(r)), s.connectTrafficFlow(e, i);
+    }, R = async (e) => (n || (n = new v(o)), await n.initializeSearch(e)), V = async () => n == null ? void 0 : n.calCrossIndicatorArea(), x = async () => {
+    }, B = async (e, c) => {
+      r || (r = new ge(o)), r.connectTrafficFlow(e, c);
     }, H = () => {
-      s == null || s.disconnectTrafficFlow();
+      r == null || r.disconnectTrafficFlow();
     }, z = (e) => {
-      t || (t = new w(r)), t.handleVehicleTraceData(e);
+      t || (t = new g(o)), t.handleVehicleTraceData(e);
     }, N = () => {
       t == null || t.clearHoloTrace();
     }, Q = async (e) => {
-      t || (t = new w(r)), await t.handleSignalData(e);
-    }, P = () => {
+      t || (t = new g(o)), await t.handleSignalData(e);
+    }, j = () => {
       t == null || t.clearHoloSignal();
     }, E = (e) => {
-      switch (e.name.toLowerCase()) {
-        case "vehiclePlate".toLowerCase():
-          s == null || s.toggleVehiclePlate(e.visible);
-          break;
-      }
+      r == null || r.toggleTrafficInfo(e);
+    }, P = (e) => {
+      t == null || t.toggleTrafficObject(e), r == null || r.toggleTrafficObject(e);
     }, Z = (e) => {
       t == null || t.updatePanelContent(e);
-    }, j = async (e) => (a || (a = new ue(r)), await a.addOverlays(e)), q = (e) => a == null ? void 0 : a.removeOverlaysByType(e), $ = (e) => a == null ? void 0 : a.removeOverlaysById(e), G = () => a == null ? void 0 : a.removeAllOverlays(), J = () => {
+    }, q = async (e) => (a || (a = new fe(o)), a.addOverlays(e)), $ = (e) => a == null ? void 0 : a.removeOverlaysByType(e), G = (e) => a == null ? void 0 : a.removeOverlaysById(e), J = () => a == null ? void 0 : a.removeAllOverlays(), K = () => {
       a == null || a.showAllOverlays();
-    }, K = (e) => {
-      c || (c = new de(r)), c.updateQueueLength(e);
-    }, U = () => {
-      c == null || c.removeQueueLength();
-    }, W = async (e, i) => {
-      l || (l = new pe(r)), await l.showOpenDrive(e, i);
-    }, X = async () => {
+    }, U = (e) => {
+      i || (i = new de(o)), i.updateQueueLength(e);
+    }, W = () => {
+      i == null || i.removeQueueLength();
+    }, X = async (e, c) => {
+      l || (l = new ue(o)), await l.showOpenDrive(e, c);
+    }, Y = async () => {
       await (l == null ? void 0 : l.hideOpenDrive());
-    }, y = v, p = k;
-    return h({
-      mapViewer: O,
-      setLayerVisibility: b,
-      setMapCenter: L,
+    }, y = w, p = T;
+    return O({
+      mapViewer: h,
+      setLayerVisibility: I,
+      setMapCenter: k,
       lookAt: A,
-      setMapCamera: T,
+      setMapCamera: b,
       setMapZoomRange: S,
-      requestCoordinateTransform: I,
+      requestCoordinateTransform: L,
       cancelCoordinateTransform: D,
-      addOverlays: j,
-      showAllOverlays: J,
-      removeOverlaysByType: q,
-      removeOverlaysById: $,
-      removeAllOverlays: G,
+      addOverlays: q,
+      showAllOverlays: K,
+      removeOverlaysByType: $,
+      removeOverlaysById: G,
+      removeAllOverlays: J,
       showLaneNumber: _,
       clearLaneNumber: M,
       initializeAreaTool: R,
@@ -96,14 +94,15 @@ const we = { class: "gis-viewer" }, be = /* @__PURE__ */ ee({
       handleHoloVehicleTraceData: z,
       clearHoloTrace: N,
       handleHoloSignalData: Q,
-      clearHoloSignal: P,
+      clearHoloSignal: j,
       toggleTrafficInfo: E,
+      toggleTrafficObject: P,
       toggleVehicleInfo: Z,
-      updateQueueLength: K,
-      removeQueueLength: U,
-      showOpenDrive: W,
-      hideOpenDrive: X
-    }), (e, i) => (oe(), se("div", we, [
+      updateQueueLength: U,
+      removeQueueLength: W,
+      showOpenDrive: X,
+      hideOpenDrive: Y
+    }), (e, c) => (se(), ce("div", ye, [
       ie("div", {
         class: "gis-viewer-main",
         ref_key: "mapContainer",
@@ -113,5 +112,5 @@ const we = { class: "gis-viewer" }, be = /* @__PURE__ */ ee({
   }
 });
 export {
-  be as default
+  Le as default
 };

package/es/src/gis-map/index.d.ts

@@ -42,10 +42,8 @@ export declare const GisMap: import("@easyest/utils/dist/lib/withinstall").SFCWi
     clearHoloTrace: () => void;
     handleHoloSignalData: (signalData: any) => Promise<void>;
     clearHoloSignal: () => void;
-    toggleTrafficInfo: (params: {
-        name: string;
-        visible: boolean;
-    }) => void;
+    toggleTrafficInfo: (params: import("../types").IToggleTrafficInfoParams) => void;
+    toggleTrafficObject: (params: import("../types").IToggleTrafficInfoParams) => void;
     toggleVehicleInfo: (contentType: string) => void;
     addOverlays: (params: import("../types").IOverlayParam) => Promise<import("../types").IResult>;
     removeOverlaysByType: (types: string[]) => import("../types").IResult;

package/es/src/gis-map/utils/holo-flow/index.d.ts

@@ -1,4 +1,5 @@
 import View from '@arcgis/core/views/View';
+import { IToggleTrafficInfoParams } from '../../../types';
 export default class Index {
     private readonly view;
     private traceHoloFlow;
@@ -8,6 +9,7 @@ export default class Index {
      * 处理全息流轨迹数据
      * */
     handleVehicleTraceData(data: any): void;
+    toggleTrafficObject(params: IToggleTrafficInfoParams): void;
     clearHoloTrace(): void;
     updatePanelContent(contentType: string): void;
     handleSignalData(data: any): Promise<void>;

package/es/src/gis-map/utils/holo-flow/index.mjs

@@ -1,48 +1,59 @@
-import { EVehiclePlateState as l } from "../../../types/index.mjs";
+import { EVehiclePlateState as a } from "../../../types/index.mjs";
 import t from "./signal-holo-flow.mjs";
 import i from "./trace-holo-flow.mjs";
 class h {
-  constructor(a) {
-    this.view = a;
+  constructor(e) {
+    this.view = e;
   }
   /**
    * 处理全息流轨迹数据
    * */
-  handleVehicleTraceData(a) {
-    this.traceHoloFlow || (this.traceHoloFlow = new i(this.view)), this.traceHoloFlow.handleVehicleTraceData(a);
+  handleVehicleTraceData(e) {
+    this.traceHoloFlow || (this.traceHoloFlow = new i(this.view)), this.traceHoloFlow.handleVehicleTraceData(e);
+  }
+  toggleTrafficObject(e) {
+    var l, o;
+    switch (e.name.toLowerCase()) {
+      case "groundVehicle".toLowerCase():
+        (l = this.traceHoloFlow) == null || l.toggleGroundVehicle(e.visible);
+        break;
+      case "elevatedVehicle".toLowerCase():
+        (o = this.traceHoloFlow) == null || o.toggleElevatedVehicle(e.visible);
+        break;
+    }
   }
   clearHoloTrace() {
-    var a;
-    (a = this.traceHoloFlow) == null || a.clearTrace();
+    var e;
+    (e = this.traceHoloFlow) == null || e.clearTrace();
   }
   // public toggleVehiclePlate(visible: boolean): void {
   //   this.traceHoloFlow?.togglePlateLayer(visible);
   // }
-  updatePanelContent(a) {
+  updatePanelContent(e) {
     var o;
-    let e = l.None;
-    switch (a) {
+    let l = a.None;
+    switch (e) {
       case "none":
-        e = l.None;
+        l = a.None;
         break;
       case "plateNumber":
-        e = l.PlateNumber;
+        l = a.PlateNumber;
         break;
       case "vehicleId":
-        e = l.Id;
+        l = a.Id;
         break;
       case "mix":
-        e = l.Mix;
+        l = a.Mix;
         break;
     }
-    (o = this.traceHoloFlow) == null || o.updatePanelContent(e);
+    (o = this.traceHoloFlow) == null || o.updatePanelContent(l);
   }
-  async handleSignalData(a) {
-    this.signalHoloFlow || (this.signalHoloFlow = new t(this.view)), await this.signalHoloFlow.initializeLayer(), await this.signalHoloFlow.handleSignalData(a);
+  async handleSignalData(e) {
+    this.signalHoloFlow || (this.signalHoloFlow = new t(this.view)), await this.signalHoloFlow.initializeLayer(), await this.signalHoloFlow.handleSignalData(e);
   }
   clearHoloSignal() {
-    var a;
-    (a = this.signalHoloFlow) == null || a.clearSignal();
+    var e;
+    (e = this.signalHoloFlow) == null || e.clearSignal();
   }
 }
 export {

package/es/src/gis-map/utils/holo-flow/signal-holo-flow.d.ts

@@ -25,6 +25,14 @@ export default class SignalHoloFlow {
      * 获取显示倒计时的canvas
      * */
     private updateCountdown;
+    /**
+     * 在倒计时面板上写入倒计时时间
+     * @param countdownCanvas 倒计时面板canvas
+     * @param rtState 相位数据
+     * @param rtState.stageRemainingTime 剩余时间
+     * @param rtState.stageAllRedTime 全红时间
+     * @param rtState.stageYellowTime 黄灯时间
+     */
     private drawCountdownText;
     private updatePhaseLine;
     /**

package/es/src/gis-map/utils/holo-flow/signal-holo-flow.mjs

@@ -5,8 +5,8 @@ import u from "../../stores/index.mjs";
 class f {
   constructor(e) {
     this.currentPhaseMap = /* @__PURE__ */ new Map(), this.countdownCanvasMap = /* @__PURE__ */ new Map(), this.lastDataTime = 0, this.isDeletingCanvas = !1, this.canvasWidth = 80, this.canvasHeight = 50, this.view = (e.type === "2d", e);
-    const t = u.useAppDataStore;
-    this.mapConfig = JSON.parse(JSON.stringify(t.mapConfig));
+    const a = u.useAppDataStore;
+    this.mapConfig = JSON.parse(JSON.stringify(a.mapConfig));
   }
   /**
    * 初始化相位线图层
@@ -16,14 +16,14 @@ class f {
       if (this.phaseLineLayer)
         this.phaseLineLayer.visible || (this.phaseLineLayer.visible = !0);
       else {
-        const e = `${this.mapConfig.assetsRoot}/${this.mapConfig.phaseLineLayer}`, o = (await (await fetch(e)).json()).features.map((i, s) => ({
+        const e = `${this.mapConfig.assetsRoot}/${this.mapConfig.phaseLineLayer}`, o = (await (await fetch(e)).json()).features.map((s, n) => ({
           geometry: {
             type: "polyline",
-            paths: [i.geometry.coordinates]
+            paths: [s.geometry.coordinates]
           },
           attributes: {
-            ObjectID: s + 1,
-            id: i.properties.id,
+            ObjectID: n + 1,
+            id: s.properties.id,
             color: "hide"
           }
         }));
@@ -106,16 +106,16 @@ class f {
       }
   }
   async handleSignalData(e) {
-    const t = new Date().getTime();
-    if (t - this.lastDataTime < 100)
+    const a = new Date().getTime();
+    if (a - this.lastDataTime < 100)
       return;
-    this.lastDataTime = t;
-    const { crossId: o, lat: i, lon: s, rtStage: n, channelsConfig: l } = e;
-    await this.updateCountdown(o, i, s, n), this.phaseLineLayer && ((!this.currentPhaseMap.has(o) || this.currentPhaseMap.get(o) !== n.stagePhase) && await this.updatePhaseLine(
+    this.lastDataTime = a;
+    const { crossId: o, lat: s, lon: n, rtStage: t, channelsConfig: l } = e;
+    await this.updateCountdown(o, s, n, t), this.phaseLineLayer && ((!this.currentPhaseMap.has(o) || this.currentPhaseMap.get(o) !== t.stagePhase) && await this.updatePhaseLine(
       o,
-      n.channelsConfig,
+      t.channelsConfig,
       l
-    ), this.currentPhaseMap.set(o, n.stagePhase));
+    ), this.currentPhaseMap.set(o, t.stagePhase));
   }
   /**
    * 清除实时信号相关图层
@@ -128,54 +128,62 @@ class f {
   /**
    * 获取显示倒计时的canvas
    * */
-  async updateCountdown(e, t, a, o) {
+  async updateCountdown(e, a, i, o) {
     if (this.isDeletingCanvas)
       return;
-    const i = this.countdownCanvasMap.get(e);
-    if (i)
-      this.drawCountdownText(i.countdownCanvas, o);
+    const s = this.countdownCanvasMap.get(e);
+    if (s)
+      this.drawCountdownText(s.countdownCanvas, o);
     else {
-      const s = new c({
-        longitude: a,
-        latitude: t,
+      const n = new c({
+        longitude: i,
+        latitude: a,
         z: 10
-      }), n = this.view.toScreen(s);
-      if (n.x > this.view.width || n.y > this.view.height)
+      }), t = this.view.toScreen(n);
+      if (t.x > this.view.width || t.y > this.view.height || t.x <= 0 || t.y <= 0)
         return;
       this.createCountdownCanvas((l) => {
         const h = l[0], r = l[1];
-        h.style.left = n.x + "px", h.style.top = n.y + "px", r.style.left = n.x + "px", r.style.top = n.y + "px", this.countdownCanvasMap.set(e, {
+        h.style.left = t.x + "px", h.style.top = t.y + "px", r.style.left = t.x + "px", r.style.top = t.y + "px", this.countdownCanvasMap.set(e, {
           backgroundCanvas: h,
           countdownCanvas: r,
-          mapPoint: s
+          mapPoint: n
         }), this.drawCountdownText(r, o);
       });
     }
     this.countdownWatchHandel || (this.countdownWatchHandel = d.watch(
       () => this.view.extent,
       () => {
-        this.countdownCanvasMap.forEach((s) => {
-          const n = this.view.toScreen(s.mapPoint);
-          n.x > this.view.width || n.y > this.view.height ? (this.isDeletingCanvas = !0, this.view.container.removeChild(s.backgroundCanvas), this.view.container.removeChild(s.countdownCanvas), this.countdownCanvasMap.delete(e), this.isDeletingCanvas = !1) : (s.backgroundCanvas.style.left = n.x + "px", s.backgroundCanvas.style.top = n.y + "px", s.countdownCanvas.style.left = n.x + "px", s.countdownCanvas.style.top = n.y + "px");
+        this.countdownCanvasMap.forEach((n) => {
+          const t = this.view.toScreen(n.mapPoint);
+          t.x > this.view.width || t.y > this.view.height || t.x <= 0 || t.y <= 0 ? (this.isDeletingCanvas = !0, this.view.container.removeChild(n.backgroundCanvas), this.view.container.removeChild(n.countdownCanvas), this.countdownCanvasMap.delete(e), this.isDeletingCanvas = !1) : (n.backgroundCanvas.style.left = t.x + "px", n.backgroundCanvas.style.top = t.y + "px", n.countdownCanvas.style.left = t.x + "px", n.countdownCanvas.style.top = t.y + "px");
         });
       }
     ));
   }
-  drawCountdownText(e, t) {
-    const a = e.getContext("2d");
-    a.clearRect(0, 0, e.width, e.height), a.font = "32px LESLIE", a.textBaseline = "middle", a.textAlign = "center", a.fillStyle = t.stageRemainingTime <= t.stageAllRedTime ? "red" : t.stageRemainingTime <= t.stageAllRedTime + t.stageYellowTime ? "yellow" : "lime", a.fillText(
-      t.stageRemainingTime,
+  /**
+   * 在倒计时面板上写入倒计时时间
+   * @param countdownCanvas 倒计时面板canvas
+   * @param rtState 相位数据
+   * @param rtState.stageRemainingTime 剩余时间
+   * @param rtState.stageAllRedTime 全红时间
+   * @param rtState.stageYellowTime 黄灯时间
+   */
+  drawCountdownText(e, a) {
+    const i = e.getContext("2d");
+    i.clearRect(0, 0, e.width, e.height), i.font = "32px LESLIE", i.textBaseline = "middle", i.textAlign = "center", i.fillStyle = a.stageRemainingTime <= a.stageAllRedTime ? "red" : a.stageRemainingTime <= a.stageAllRedTime + a.stageYellowTime ? "yellow" : "lime", i.fillText(
+      a.stageRemainingTime.toFixed(0),
       e.width / 2,
       e.height / 2
     );
   }
-  async updatePhaseLine(e, t, a) {
+  async updatePhaseLine(e, a, i) {
     const o = this.phaseLineLayer.source.filter(
-      (i) => i.getAttribute("id").includes(e)
+      (s) => s.getAttribute("id").includes(e)
     );
-    o.forEach((i) => {
-      const s = i.getAttribute("id");
-      this.isLaneInChannels(s, t) ? i.setAttribute("color", "green") : this.isLaneInChannels(s, a) ? i.setAttribute("color", "red") : i.setAttribute("color", "green");
+    o.forEach((s) => {
+      const n = s.getAttribute("id");
+      this.isLaneInChannels(n, a) ? s.setAttribute("color", "green") : this.isLaneInChannels(n, i) ? s.setAttribute("color", "red") : s.setAttribute("color", "green");
     }), await this.phaseLineLayer.applyEdits({ updateFeatures: o });
   }
   /**
@@ -184,24 +192,24 @@ class f {
    * @param channels 通道列表
    * @returns
    */
-  isLaneInChannels(e, t) {
-    const a = e.split("+"), o = a[1], i = a[2];
-    for (let s = 0; s < t.length; s++)
-      for (let n = 0; n < t[s].laneSnList.length; n++) {
-        const l = t[s].laneSnList[n].toFixed(0);
-        if (o === l[0] && i === l[1])
+  isLaneInChannels(e, a) {
+    const i = e.split("+"), o = i[1], s = i[2];
+    for (let n = 0; n < a.length; n++)
+      for (let t = 0; t < a[n].laneSnList.length; t++) {
+        const l = a[n].laneSnList[t].toFixed(0);
+        if (o === l[0] && s === l[1])
           return !0;
       }
     return !1;
   }
   createCountdownCanvas(e) {
-    const t = new Image();
-    t.src = `${this.mapConfig.assetsRoot}/Images/timeboard/CountdownBG.png`, t.onload = () => {
-      const a = document.createElement("canvas");
-      a.width = this.canvasWidth, a.height = this.canvasHeight, a.style.position = "absolute", a.style.transform = "translate(-50%, -50%)", a.getContext("2d").drawImage(t, 0, 0, this.canvasWidth, this.canvasHeight), this.view.container.appendChild(a);
+    const a = new Image();
+    a.src = `${this.mapConfig.assetsRoot}/Images/timeboard/CountdownBG.png`, a.onload = () => {
       const i = document.createElement("canvas");
-      i.width = this.canvasWidth - 10, i.height = this.canvasHeight - 10, i.style.position = "absolute", i.style.transform = "translate(-50%, -50%)", this.view.container.appendChild(i), e([a, i]);
-    }, t.onerror = () => {
+      i.width = this.canvasWidth, i.height = this.canvasHeight, i.style.position = "absolute", i.style.transform = "translate(-50%, -50%)", i.getContext("2d").drawImage(a, 0, 0, this.canvasWidth, this.canvasHeight), this.view.container.appendChild(i);
+      const s = document.createElement("canvas");
+      s.width = this.canvasWidth - 10, s.height = this.canvasHeight - 10, s.style.position = "absolute", s.style.transform = "translate(-50%, -50%)", this.view.container.appendChild(s), e([i, s]);
+    }, a.onerror = () => {
       console.error("倒计时背景图加载失败");
     };
   }

package/es/src/gis-map/utils/holo-flow/trace-external-renderer.d.ts

@@ -49,6 +49,8 @@ export default class TraceExternalRenderer implements ITraceRendererInterface {
      * @returns
      */
     updatePanelContent(contentType: EVehiclePlateState): void;
+    toggleGroundVehicle(visible: boolean): void;
+    toggleElevatedVehicle(visible: boolean): void;
     /**
      * 释放模型资源
      * */

package/es/src/gis-map/utils/holo-flow/trace-external-renderer.mjs

@@ -1,5 +1,5 @@
 import b from "@arcgis/core/geometry/SpatialReference";
-import * as g from "@arcgis/core/views/3d/externalRenderers";
+import * as u from "@arcgis/core/views/3d/externalRenderers";
 import * as o from "three";
 import { GLTFLoader as v } from "three/examples/jsm/loaders/GLTFLoader.js";
 import { EVehiclePlateState as M } from "../../../types/index.mjs";
@@ -64,7 +64,7 @@ class k {
       const a = this.computeVehiclePosition(r);
       if (a) {
         const c = [0, 0, 0];
-        g.toRenderCoordinates(
+        u.toRenderCoordinates(
           this.view,
           a,
           0,
@@ -84,7 +84,7 @@ class k {
       t.ambient.color[0],
       t.ambient.color[1],
       t.ambient.color[2]
-    ), this.renderer.resetState(), i.bindRenderTarget(), this.renderer.render(this.scene, this.camera), g.requestRender(this.view), i.resetWebGLState();
+    ), this.renderer.resetState(), i.bindRenderTarget(), this.renderer.render(this.scene, this.camera), u.requestRender(this.view), i.resetWebGLState();
   }
   /**
    * 新增车辆
@@ -115,8 +115,8 @@ class k {
       if (n) {
         if ((n.data.vehicleColor !== e.vehicleColor || n.data.vehicleType !== e.vehicleType) && (this.scene.remove(n.model), this.disposeModel(n.model), n.model = this.getVehicleModel(e), this.scene.add(n.model)), n.data.showName !== e.showName || n.data.plateColor !== e.plateColor) {
           const m = n.model.getObjectByName("VehiclePlate");
-          m && (n.model.remove(m), this.disposeModel(m)), this.createPlateSprite(e, (u) => {
-            n.model.add(u), u.position.set(0, 5, -4);
+          m && (n.model.remove(m), this.disposeModel(m)), this.createPlateSprite(e, (g) => {
+            n.model.add(g), g.position.set(0, 5, -4);
           });
         }
         n.data = e;
@@ -180,6 +180,10 @@ class k {
       }
     }
   }
+  toggleGroundVehicle(i) {
+  }
+  toggleElevatedVehicle(i) {
+  }
   /**
    * 释放模型资源
    * */
@@ -306,8 +310,8 @@ class k {
         return;
       const d = new o.CanvasTexture(n), p = new o.SpriteMaterial({
         map: d
-      }), f = new o.Sprite(p), m = 0.05, u = n.width * m, y = n.height * m;
-      f.scale.set(u, y, 1), f.name = "VehiclePlate", e(f);
+      }), f = new o.Sprite(p), m = 0.05, g = n.width * m, y = n.height * m;
+      f.scale.set(g, y, 1), f.name = "VehiclePlate", e(f);
     };
   }
 }

package/es/src/gis-map/utils/holo-flow/trace-holo-flow.d.ts

@@ -14,5 +14,7 @@ export default class TraceHoloFlow {
      * */
     clearTrace(): void;
     updatePanelContent(contentType: EVehiclePlateState): void;
+    toggleGroundVehicle(visible: boolean): void;
+    toggleElevatedVehicle(visible: boolean): void;
     private buildVehicleTrackData;
 }