gisviewer-vue3-arcgis 1.0.102 → 1.0.103

package/es/src/gis-map/utils/GreenWaveline.d.ts

@@ -0,0 +1,68 @@
+import Graphic from '@arcgis/core/Graphic';
+import GraphicsLayer from '@arcgis/core/layers/GraphicsLayer';
+import MapView from '@arcgis/core/views/MapView';
+import SceneView from '@arcgis/core/views/SceneView';
+interface GreenWaveLineOptions {
+    viewer: MapView | SceneView;
+    graphicsLayerOptions: {
+        id: string;
+    };
+}
+interface roadPath {
+    paths: [number, number][];
+    symbol: any;
+    attributes: any;
+    visible?: boolean;
+}
+interface animationOptions {
+    isAnimation: boolean;
+    positive?: boolean;
+    positiveColor?: number[];
+    negative?: boolean;
+    negativeColor?: number[];
+}
+export default class GreenWaveLine {
+    private viewer;
+    overlayLayer: GraphicsLayer;
+    customGreenWaveLineView: any;
+    material: THREE.ShaderMaterial;
+    renderer: THREE.WebGLRenderer;
+    threeScene: THREE.Scene;
+    camera: THREE.PerspectiveCamera;
+    private defaultAnimationOptions;
+    constructor(options: GreenWaveLineOptions);
+    addGreenWaveLine(paths: roadPath[], options?: animationOptions): void;
+    getAnimationPath(paths: [number, number][], options?: animationOptions): any;
+    createLine(paths: any, symbol: any, attributes: any, visible: boolean): Graphic;
+    addPointText(points: any[]): void;
+    createPointText(point: any, symbol: any, attributes: any, visible: boolean): Graphic;
+    /**
+     * 隐藏覆盖物
+     *
+     * @param {string[]} [ids]
+     * @memberof GreenWaveLine
+     */
+    hideWaveLine(ids?: string[]): void;
+    /**
+     * 显示覆盖物
+     *
+     * @param {string[]} [ids]
+     * @memberof GreenWaveLine
+     */
+    showWaveLine(ids?: string[]): void;
+    /**
+     * 隐藏图层
+     *
+     * @memberof GreenWaveLine
+     */
+    hideLayer(): void;
+    /**
+     * 显示图层
+     *
+     * @memberof Overlay
+     */
+    showLayer(): void;
+    clearGreenWaveLine(): void;
+    destroy(): void;
+}
+export {};

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

@@ -216,7 +216,7 @@ class f {
   createCountdownCanvas() {
     return new Promise((e, a) => {
       const i = new Image();
-      i.src = `${this.mapConfig.assetsRoot}/Images/timeboard/CountdownBG.png`, console.log(i.src), i.onload = () => {
+      i.src = `${this.mapConfig.assetsRoot}/Images/timeboard/CountdownBG.png`, i.onload = () => {
         const n = document.createElement("canvas");
         n.width = this.canvasWidth, n.height = this.canvasHeight, n.style.position = "absolute", n.style.transform = "translate(-50%, -50%)", n.getContext(
           "2d"

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

@@ -1,38 +1,38 @@
-import * as m from "@arcgis/core/views/3d/externalRenderers";
-import f from "../../stores/index.mjs";
-import g from "./trace-renderer-layer.mjs";
-import u from "./trace-renderer-webgl.mjs";
-class y {
+import * as f from "@arcgis/core/views/3d/externalRenderers";
+import g from "../../stores/index.mjs";
+import u from "./trace-renderer-external.mjs";
+import T from "./trace-renderer-layer.mjs";
+class b {
   constructor(e) {
     this.lastDataTime = 0, this.view = e;
-    const o = f.useAppDataStore;
-    this.mapConfig = JSON.parse(JSON.stringify(o.mapConfig)), e.type === "3d" ? (this.traceRenderer = new u(e), m.add(
+    const c = g.useAppDataStore;
+    this.mapConfig = JSON.parse(JSON.stringify(c.mapConfig)), e.type === "3d" ? (this.traceRenderer = new u(e), f.add(
       e,
       this.traceRenderer
-    )) : this.traceRenderer = new g(e);
+    )) : this.traceRenderer = new T(e);
   }
   /**
    * 处理全息流轨迹数据
    * */
   handleVehicleTraceData(e) {
-    const o = new Date().getTime(), { newVehList: s, updateVehList: a, deleteVehList: c, jgsj: i } = e, n = e.crossId || "", l = [], h = [];
+    const c = new Date().getTime(), { newVehList: s, updateVehList: l, deleteVehList: o, jgsj: i } = e, n = e.crossId || "", a = [], h = [];
     if (s && s.length > 0) {
       for (const t of s) {
-        t.localTimestamp || (t.localTimestamp = i || o);
+        t.localTimestamp || (t.localTimestamp = i || c);
         const r = this.buildVehicleTrackData(t, n);
-        r && l.push(r);
+        r && a.push(r);
       }
-      this.traceRenderer.addVehicles(l);
+      this.traceRenderer.addVehicles(a);
     }
-    if (a && a.length > 0) {
-      for (const t of a) {
+    if (l && l.length > 0) {
+      for (const t of l) {
         const r = this.buildVehicleTrackData(t, n);
         r && h.push(r);
       }
       this.traceRenderer.updateVehicles(h);
     }
-    if (c && c.length > 0) {
-      const t = c.map(
+    if (o && o.length > 0) {
+      const t = o.map(
         (r) => n + "-" + (r.ptcId || r.vehno || r.vehNo)
       );
       this.traceRenderer.deleteVehicles(t);
@@ -63,28 +63,28 @@ class y {
   setInterpolate(e) {
     this.traceRenderer.setInterpolate(e);
   }
-  buildVehicleTrackData(e, o) {
-    const s = e.longitude, a = e.latitude, c = e.ptcId, i = Number(e.ptcType), n = e.heading, l = Number(e.vehicleType), h = Number(e.vehicleColor), t = e.plateNo || e.plateno, r = Number(e.plateColor), p = e.timestamp, d = String(e.roadLayer) || "1";
+  buildVehicleTrackData(e, c) {
+    const s = e.longitude, l = e.latitude, o = e.ptcId, i = Number(e.ptcType), n = e.heading, a = Number(e.vehicleType), h = Number(e.vehicleColor), t = e.plateNo || e.plateno, r = Number(e.plateColor), p = e.timestamp, d = e.localTimestamp, m = String(e.roadLayer) || "1";
     if (!(i < 0 || i > 8))
       return {
-        ptcId: c,
-        crossId: o,
-        vehicleId: o + "-" + c,
+        ptcId: o,
+        crossId: c,
+        vehicleId: c + "-" + o,
         x: s,
-        y: a,
+        y: l,
         ptcType: i,
-        vehicleType: l,
+        vehicleType: a,
         heading: i === 2 ? -n : n,
         vehicleColor: h,
         showName: t && t !== "" && t !== "0" && t !== "000000" ? t : "",
         plateNo: t,
         plateColor: r,
         timestamp: p,
-        localTimestamp: Date.now(),
-        roadLayer: d
+        localTimestamp: d,
+        roadLayer: m
       };
   }
 }
 export {
-  y as default
+  b as default
 };

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

@@ -1,5 +1,5 @@
 import { EVehiclePlateState, IToggleTrafficInfoParams, ITraceRendererInterface, IVehicleTrack } from '../../../types';
-export default class TraceRendererWebgl implements ITraceRendererInterface {
+export default class TraceRendererExternal implements ITraceRendererInterface {
     private renderer;
     private scene;
     private camera;
@@ -25,27 +25,29 @@ export default class TraceRendererWebgl implements ITraceRendererInterface {
     private historyPositionMap;
     private vehicleObjectMap;
     private needInterpolate;
+    private mesh;
+    private sprite;
     constructor(view: __esri.SceneView);
     setInterpolate(needInterpolate: boolean): void;
     private context;
     setup(context: any): Promise<void>;
-    private lastRenderTime;
+    private geometryTest;
     render(context: any): Promise<void>;
     /**
      * 新增车辆
      * */
-    addVehicles(objects: IVehicleTrack[]): void;
+    addVehicles(objects: IVehicleTrack[]): Promise<void>;
     /**
      * 更新车辆
      * */
-    updateVehicles(objects: IVehicleTrack[]): void;
+    updateVehicles(objects: IVehicleTrack[]): Promise<void>;
     private toRenderCoordinates;
     /**
      * 删除车辆
      * */
     deleteVehicles(idList: string[]): void;
     private deleteVehicle;
-    toggleTrafficInfo(params: IToggleTrafficInfoParams): void;
+    toggleTrafficInfo(params: IToggleTrafficInfoParams): Promise<void>;
     /**
      * 清除全部车辆
      * */
@@ -55,7 +57,7 @@ export default class TraceRendererWebgl implements ITraceRendererInterface {
      * @param contentType
      * @returns
      */
-    updatePanelContent(contentType: EVehiclePlateState): void;
+    updatePanelContent(contentType: EVehiclePlateState): Promise<void>;
     toggleGroundVehicle(visible: boolean): void;
     toggleElevatedVehicle(visible: boolean): void;
     /**

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

@@ -0,0 +1,381 @@
+import w from "@arcgis/core/geometry/SpatialReference";
+import * as g from "@arcgis/core/views/3d/externalRenderers";
+import * as o from "three";
+import { GLTFLoader as u } from "three/examples/jsm/loaders/GLTFLoader.js";
+import { EVehiclePlateState as p } from "../../../types/index.mjs";
+import R from "../../stores/index.mjs";
+class k {
+  constructor(i) {
+    this.defaultMaterial = new o.MeshBasicMaterial({
+      color: 6908265
+    }), this.materialMap = /* @__PURE__ */ new Map([
+      [1, new o.MeshBasicMaterial({ color: 16777215 })],
+      [2, new o.MeshBasicMaterial({ color: 7833753 })],
+      [3, new o.MeshBasicMaterial({ color: 16766720 })],
+      [4, new o.MeshBasicMaterial({ color: 16758465 })],
+      [5, new o.MeshBasicMaterial({ color: 14423100 })],
+      [6, new o.MeshBasicMaterial({ color: 3329330 })],
+      [7, new o.MeshBasicMaterial({ color: 2003183 })],
+      [8, new o.MeshBasicMaterial({ color: 16032864 })],
+      [9, new o.MeshBasicMaterial({ color: 2105376 })],
+      [10, new o.MeshBasicMaterial({ color: 9662683 })],
+      [99, new o.MeshBasicMaterial({ color: 6908265 })]
+    ]), this.carModelReady = !1, this.vanModelReady = !1, this.truckModelReady = !1, this.busModelReady = !1, this.bicycleModelReady = !1, this.currentSpriteContent = p.None, this.historyPositionMap = /* @__PURE__ */ new Map(), this.vehicleObjectMap = /* @__PURE__ */ new Map(), this.needInterpolate = !0;
+    const e = R.useAppDataStore;
+    this.assetsRoot = JSON.parse(
+      JSON.stringify(e.mapConfig)
+    ).assetsRoot, this.view = i;
+    const t = new u();
+    t.load(`${this.assetsRoot}/3DModels/car.glb`, (s) => {
+      this.carModel = s.scene, this.carModel.rotation.x = o.MathUtils.degToRad(90), this.carModelReady = !0;
+    }), t.load(`${this.assetsRoot}/3DModels/van.glb`, (s) => {
+      this.vanModel = s.scene, this.vanModel.rotation.x = o.MathUtils.degToRad(90), this.vanModelReady = !0;
+    }), t.load(`${this.assetsRoot}/3DModels/truck.glb`, (s) => {
+      this.truckModel = s.scene, this.truckModel.scale.set(1.2, 1, 1.5), this.truckModel.rotation.x = o.MathUtils.degToRad(90), this.truckModelReady = !0;
+    }), t.load(`${this.assetsRoot}/3DModels/bus.glb`, (s) => {
+      this.busModel = s.scene, this.busModel.rotation.x = o.MathUtils.degToRad(90), this.busModelReady = !0;
+    }), t.load(`${this.assetsRoot}/3DModels/bicycle.glb`, (s) => {
+      this.bicycleModel = s.scene, this.bicycleModel.rotation.x = o.MathUtils.degToRad(90), this.bicycleModel.rotation.y = o.MathUtils.degToRad(180), this.bicycleModelReady = !0;
+    }), document.addEventListener(
+      "visibilitychange",
+      () => {
+        this.clearVehicles(), this.needInterpolate = !document.hidden;
+      },
+      !1
+    );
+  }
+  setInterpolate(i) {
+    this.clearVehicles(), this.needInterpolate = i;
+  }
+  async setup(i) {
+    this.context = i, this.renderer = new o.WebGLRenderer({
+      context: i.gl,
+      premultipliedAlpha: !0,
+      logarithmicDepthBuffer: !0,
+      antialias: !0,
+      powerPreference: "high-performance"
+    }), this.renderer.setPixelRatio(window.devicePixelRatio), this.renderer.setViewport(0, 0, this.view.width, this.view.height), this.renderer.autoClearDepth = !1, this.renderer.autoClearStencil = !1, this.renderer.autoClearColor = !1;
+    const e = this.renderer.setRenderTarget.bind(
+      this.renderer
+    );
+    this.renderer.setRenderTarget = (t) => {
+      e(t), t == null && i.bindRenderTarget();
+    }, this.scene = new o.Scene(), this.camera = new o.PerspectiveCamera(), this.ambient = new o.AmbientLight(16777215, 0.5), this.scene.add(this.ambient), this.sun = new o.DirectionalLight(16777215, 0.5), this.scene.add(this.sun), i.resetWebGLState();
+  }
+  geometryTest() {
+    new u().load(`${this.assetsRoot}/3DModels/car.glb`, (e) => {
+      this.mesh = e.scene, this.mesh.rotation.x = o.MathUtils.degToRad(90);
+      const t = [121.46892831020403, 31.239681632841354, 0], s = this.toRenderCoordinates(t);
+      this.mesh.position.set(s[0], s[1], s[2]), this.scene.add(this.mesh), new o.TextureLoader().load(
+        `${this.assetsRoot}/Images/PlateBG/grey.png`,
+        (r) => {
+          const n = new o.SpriteMaterial({
+            map: r,
+            transparent: !1
+          }), a = new o.Sprite(n);
+          a.scale.set(5, 2.5, 1), a.position.set(0, 5, -4), this.mesh.add(a), console.log(this.mesh.visible, a.visible);
+        }
+      );
+    });
+  }
+  async render(i) {
+    var s;
+    const e = i.camera;
+    if (this.camera.position.set(e.eye[0], e.eye[1], e.eye[2]), this.camera.up.set(e.up[0], e.up[1], e.up[2]), this.camera.lookAt(
+      new o.Vector3(e.center[0], e.center[1], e.center[2])
+    ), this.camera.projectionMatrix.fromArray(e.projectionMatrix), this.needInterpolate)
+      for (const l of this.vehicleObjectMap.keys()) {
+        const r = (s = this.vehicleObjectMap.get(l)) == null ? void 0 : s.model;
+        if (!r)
+          continue;
+        const n = this.computeVehiclePosition(l);
+        if (n) {
+          const a = this.toRenderCoordinates(n);
+          r.position.set(a[0], a[1], a[2]), r.rotation.y = o.MathUtils.degToRad(-n[3]);
+        }
+      }
+    const t = i.sunLight;
+    this.sun.position.set(t.direction[0], t.direction[1], t.direction[2]), this.sun.intensity = t.diffuse.intensity, this.sun.color = new o.Color(
+      t.diffuse.color[0],
+      t.diffuse.color[1],
+      t.diffuse.color[2]
+    ), this.ambient.intensity = t.ambient.intensity, this.ambient.color = new o.Color(
+      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();
+  }
+  /**
+   * 新增车辆
+   * */
+  async addVehicles(i) {
+    if (!(!this.carModelReady || !this.vanModelReady || !this.truckModelReady || !this.busModelReady || !this.bicycleModelReady))
+      for (const e of i) {
+        const { vehicleId: t, localTimestamp: s } = e, l = Number(e.x), r = Number(e.y), n = Number(e.heading);
+        this.historyPositionMap.set(t, [
+          { pos: [l, r, 0], heading: n, time: s }
+        ]);
+        const a = this.getVehicleModel(e);
+        a.name = t, a.visible = !this.needInterpolate;
+        try {
+          const c = await this.createPlateSprite(e);
+          c && (a.add(c), c.position.set(0, 5, -4)), this.scene.add(a), this.vehicleObjectMap.set(t, {
+            model: a,
+            data: e,
+            waitForDelete: !1,
+            isMoving: !1
+          });
+        } catch (c) {
+          console.log("createPlateSprite error:", c);
+        }
+      }
+  }
+  /**
+   * 更新车辆
+   * */
+  async updateVehicles(i) {
+    if (!this.carModelReady || !this.vanModelReady || !this.truckModelReady || !this.busModelReady || !this.bicycleModelReady)
+      return;
+    const e = [];
+    for (const t of i) {
+      const { vehicleId: s, localTimestamp: l } = t, r = Number(t.x), n = Number(t.y);
+      let a = Number(t.heading);
+      const c = this.vehicleObjectMap.get(s);
+      if (!c)
+        e.push(t);
+      else {
+        if (c.data.vehicleColor !== t.vehicleColor || c.data.vehicleType !== t.vehicleType) {
+          this.scene.remove(c.model), this.disposeModel(c.model), c.model = this.getVehicleModel(t);
+          const h = await this.createPlateSprite(t);
+          h && (c.model.add(h), h.position.set(0, 5, -4)), this.scene.add(c.model);
+        }
+        if (c.data.showName !== t.showName || c.data.plateColor !== t.plateColor) {
+          const h = c.model.getObjectByName("VehiclePlate");
+          h && (c.model.remove(h), this.disposeModel(h));
+          const d = await this.createPlateSprite(t);
+          d && (c.model.add(d), d.position.set(0, 5, -4));
+        }
+        if (c.data = t, this.needInterpolate) {
+          const h = this.historyPositionMap.get(
+            s
+          ), d = h[h.length - 1];
+          Math.abs(a - d.heading) >= 180 && (a > d.heading ? d.heading += 360 : a += 360), h.push({
+            pos: [r, n, 0],
+            heading: a,
+            time: l
+          });
+        } else {
+          this.historyPositionMap.set(s, [
+            { pos: [r, n, 0], heading: a, time: l }
+          ]);
+          const h = this.toRenderCoordinates([r, n, 0]);
+          c.model.position.set(h[0], h[1], h[2]), c.model.rotation.y = o.MathUtils.degToRad(-a);
+        }
+      }
+    }
+    this.addVehicles(e), this.needInterpolate || this.render(this.context);
+  }
+  toRenderCoordinates(i) {
+    const e = [0, 0, 0];
+    return g.toRenderCoordinates(
+      // @ts-ignore
+      this.view,
+      i,
+      0,
+      w.WGS84,
+      e,
+      0,
+      1
+    ), e;
+  }
+  /**
+   * 删除车辆
+   * */
+  deleteVehicles(i) {
+    i.forEach((e) => {
+      const t = this.vehicleObjectMap.get(e);
+      t && (this.needInterpolate ? t.isMoving ? t.waitForDelete = !0 : this.deleteVehicle(t) : this.deleteVehicle(t));
+    });
+  }
+  deleteVehicle(i) {
+    this.scene.remove(i.model), this.disposeModel(i.model);
+    const e = i.data.vehicleId;
+    this.vehicleObjectMap.delete(e), this.historyPositionMap.delete(e);
+  }
+  async toggleTrafficInfo(i) {
+    i.name === "vehiclePlate" && (i.visible === !0 && this.currentSpriteContent === p.None ? await this.updatePanelContent(p.Id) : await this.updatePanelContent(
+      i.visible ? this.currentSpriteContent : p.None
+    ));
+  }
+  /**
+   * 清除全部车辆
+   * */
+  clearVehicles() {
+    for (const i of this.vehicleObjectMap.keys()) {
+      const e = this.vehicleObjectMap.get(i);
+      e && (this.disposeModel(e.model), this.scene.remove(e.model));
+    }
+    this.vehicleObjectMap.clear(), this.historyPositionMap.clear();
+  }
+  /**
+   * 设置号牌显示状态
+   * @param contentType
+   * @returns
+   */
+  async updatePanelContent(i) {
+    if (i !== this.currentSpriteContent) {
+      this.currentSpriteContent = i;
+      for (const e of this.vehicleObjectMap.keys()) {
+        const t = this.vehicleObjectMap.get(e);
+        if (t) {
+          const s = t.model.getObjectByName("VehiclePlate");
+          if (s && (t.model.remove(s), this.disposeModel(s)), i !== p.None) {
+            const l = await this.createPlateSprite(t.data);
+            l && (t.model.add(l), l.position.set(0, 5, -4));
+          }
+        }
+      }
+    }
+  }
+  toggleGroundVehicle(i) {
+  }
+  toggleElevatedVehicle(i) {
+  }
+  /**
+   * 释放模型资源
+   * */
+  disposeModel(i) {
+    i.traverse((e) => {
+      e instanceof o.Mesh && (e.geometry.dispose(), e.material.dispose());
+    });
+  }
+  /**
+   * 计算车辆位置
+   * */
+  computeVehiclePosition(i) {
+    const e = this.historyPositionMap.get(i), t = this.vehicleObjectMap.get(i);
+    if (!t || !e || !t.isMoving && e.length <= 2)
+      return;
+    const s = Date.now();
+    t.model.visible = !0, t.isMoving = !0, t.segmentStartTime || (t.segmentStartTime = s, t.segmentTotalTime = e[1].time - e[0].time);
+    const l = s - t.segmentStartTime, r = Math.min(
+      l / t.segmentTotalTime,
+      1
+    );
+    if (r === 1)
+      if (e.shift(), e.length === 1) {
+        t.waitForDelete === !0 ? this.deleteVehicle(t) : (t.segmentStartTime = void 0, t.segmentTotalTime = void 0, t.model.visible = !1, t.isMoving = !1, console.log("pause vehicle", i));
+        return;
+      } else
+        return t.segmentStartTime = Date.now(), t.segmentTotalTime = e[1].time - e[0].time, (e[1].heading >= 270 && e[0].heading <= 90 || e[1].heading <= 90 && e[0].heading >= 270) && (e[1].heading > e[0].heading ? e[0].heading += 360 : e[1].heading += 360), e[0].pos.concat(e[0].heading);
+    else {
+      const n = e[0].pos[0] + (e[1].pos[0] - e[0].pos[0]) * r, a = e[0].pos[1] + (e[1].pos[1] - e[0].pos[1]) * r, c = e[0].heading + (e[1].heading - e[0].heading) * r;
+      return [n, a, 0, c];
+    }
+  }
+  /**
+   * 根据车辆类型、车身颜色获取模型
+   * */
+  getVehicleModel(i) {
+    let e;
+    if (i.ptcType === 2)
+      e = this.bicycleModel.clone();
+    else {
+      switch (i.vehicleType) {
+        case 10:
+          e = this.carModel.clone();
+          break;
+        case 20:
+          e = this.vanModel.clone();
+          break;
+        case 25:
+          e = this.truckModel.clone();
+          break;
+        case 50:
+          e = this.busModel.clone();
+          break;
+        default:
+          e = this.carModel.clone();
+          break;
+      }
+      const t = this.materialMap.get(i.vehicleColor) || this.defaultMaterial;
+      let s = !1;
+      e.traverse((l) => {
+        !s && l instanceof o.Mesh && (l.material = t, s = !0);
+      });
+    }
+    return e;
+  }
+  /**
+   * 创建号牌canvas
+   * */
+  createCanvas(i, e, t) {
+    const s = document.createElement("canvas"), l = i.width, r = i.height;
+    s.width = l, s.height = r;
+    const n = s.getContext("2d");
+    if (!n) {
+      console.log("canvas创建失败");
+      return;
+    }
+    return n.fillStyle = "rgba(0,0,0,0.0)", n.fillRect(0, 0, l, r), n.drawImage(i, 0, 0, l, r), n.beginPath(), n.translate(l / 2, r / 2), n.fillStyle = t, n.font = "bold 32px 宋体", n.textBaseline = "middle", n.textAlign = "center", n.fillText(e, 0, 0), s;
+  }
+  createPlateSprite(i) {
+    return new Promise((e, t) => {
+      var c, h;
+      const s = !i.plateNo || i.plateNo === "0" || i.plateNo === "000000";
+      if (this.currentSpriteContent === p.None || this.currentSpriteContent === p.PlateNumber && s) {
+        e(void 0);
+        return;
+      }
+      const l = new Image();
+      let r = "", n = "", a = "";
+      if (this.currentSpriteContent === p.PlateNumber || this.currentSpriteContent === p.Mix)
+        if (s)
+          r = "grey", n = i.ptcId, a = "#ffffff";
+        else
+          switch (n = ((c = i.showName) == null ? void 0 : c.substring(0, 2)) + "•" + ((h = i.showName) == null ? void 0 : h.substring(2)), i.plateColor) {
+            case 1:
+              r = "blue", a = "#ffffff";
+              break;
+            case 2:
+              r = "yellow", a = "#000000";
+              break;
+            case 3:
+              r = "white", a = "#000000";
+              break;
+            case 4:
+              r = "black";
+              break;
+            case 5:
+              r = "neo_yellow", a = "#000000";
+              break;
+            case 6:
+              r = "neo_green", a = "#000000";
+              break;
+            default:
+              r = "grey", n = i.plateNo, a = "#ffffff";
+              break;
+          }
+      else
+        this.currentSpriteContent === p.Id && (r = "grey", n = i.ptcId, a = "#ffffff");
+      l.src = `${this.assetsRoot}/Images/PlateBG/${r}.png`, l.onload = () => {
+        const d = this.createCanvas(l, n, a);
+        if (!d)
+          t("canvas创建失败");
+        else {
+          const f = new o.CanvasTexture(d), b = new o.SpriteMaterial({
+            map: f,
+            transparent: !1
+          }), m = new o.Sprite(b), M = 0.05, y = d.width * M, v = d.height * M;
+          m.scale.set(y, v, 1), m.name = "VehiclePlate", e(m);
+        }
+        l.onerror = (f) => {
+          console.log(`号牌背景加载失败: ${l.src}`, f), t(f);
+        };
+      };
+    });
+  }
+}
+export {
+  k as default
+};

package/lib/src/gis-map/utils/GreenWaveline.d.ts

@@ -0,0 +1,68 @@
+import Graphic from '@arcgis/core/Graphic';
+import GraphicsLayer from '@arcgis/core/layers/GraphicsLayer';
+import MapView from '@arcgis/core/views/MapView';
+import SceneView from '@arcgis/core/views/SceneView';
+interface GreenWaveLineOptions {
+    viewer: MapView | SceneView;
+    graphicsLayerOptions: {
+        id: string;
+    };
+}
+interface roadPath {
+    paths: [number, number][];
+    symbol: any;
+    attributes: any;
+    visible?: boolean;
+}
+interface animationOptions {
+    isAnimation: boolean;
+    positive?: boolean;
+    positiveColor?: number[];
+    negative?: boolean;
+    negativeColor?: number[];
+}
+export default class GreenWaveLine {
+    private viewer;
+    overlayLayer: GraphicsLayer;
+    customGreenWaveLineView: any;
+    material: THREE.ShaderMaterial;
+    renderer: THREE.WebGLRenderer;
+    threeScene: THREE.Scene;
+    camera: THREE.PerspectiveCamera;
+    private defaultAnimationOptions;
+    constructor(options: GreenWaveLineOptions);
+    addGreenWaveLine(paths: roadPath[], options?: animationOptions): void;
+    getAnimationPath(paths: [number, number][], options?: animationOptions): any;
+    createLine(paths: any, symbol: any, attributes: any, visible: boolean): Graphic;
+    addPointText(points: any[]): void;
+    createPointText(point: any, symbol: any, attributes: any, visible: boolean): Graphic;
+    /**
+     * 隐藏覆盖物
+     *
+     * @param {string[]} [ids]
+     * @memberof GreenWaveLine
+     */
+    hideWaveLine(ids?: string[]): void;
+    /**
+     * 显示覆盖物
+     *
+     * @param {string[]} [ids]
+     * @memberof GreenWaveLine
+     */
+    showWaveLine(ids?: string[]): void;
+    /**
+     * 隐藏图层
+     *
+     * @memberof GreenWaveLine
+     */
+    hideLayer(): void;
+    /**
+     * 显示图层
+     *
+     * @memberof Overlay
+     */
+    showLayer(): void;
+    clearGreenWaveLine(): void;
+    destroy(): void;
+}
+export {};

package/lib/src/gis-map/utils/holo-flow/signal-holo-flow.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("@arcgis/core/core/reactiveUtils"),u=require("@arcgis/core/geometry"),p=require("@arcgis/core/layers/FeatureLayer"),g=require("../../stores/index.js");function y(l){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const t in l)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(l,t);Object.defineProperty(e,t,n.get?n:{enumerable:!0,get:()=>l[t]})}}return e.default=l,Object.freeze(e)}const w=y(d);class m{constructor(e){this.currentPhaseMap=new Map,this.countdownCanvasMap=new Map,this.lastDataTime=0,this.isDeletingCanvas=!1,this.canvasWidth=80,this.canvasHeight=40,this.view=(e.type==="2d",e);const t=g.default.useAppDataStore;this.mapConfig=JSON.parse(JSON.stringify(t.mapConfig))}async initializeLayer(){if(this.mapConfig.phaseLineLayer)if(this.phaseLineLayer)this.phaseLineLayer.visible||(this.phaseLineLayer.visible=!0);else{const e=`${this.mapConfig.assetsRoot}/${this.mapConfig.phaseLineLayer}`,i=(await(await fetch(e)).json()).features.map((s,a)=>({geometry:{type:"polyline",paths:[s.geometry.coordinates]},attributes:{ObjectID:a+1,id:s.properties.id,color:"hide"}}));this.phaseLineLayer=new p({source:i,geometryType:"polyline",objectIdField:"ObjectID",outFields:["*"],fields:[{name:"ObjectID",alias:"ObjectID",type:"oid"},{name:"color",alias:"color",type:"string"}],renderer:{type:"unique-value",field:"color",defaultSymbol:{type:"simple-line",color:"lightblue",width:"2px",style:"none"},uniqueValueInfos:[{value:"green",symbol:{type:"line-3d",symbolLayers:[{type:"path",profile:"quad",material:{color:[19,255,69,.8]},width:1,height:.5}]}},{value:"red",symbol:{type:"line-3d",symbolLayers:[{type:"path",profile:"quad",material:{color:[254,5,9,.8]},width:1,height:.5}]}},{value:"yellow",symbol:{type:"line-3d",symbolLayers:[{type:"path",profile:"quad",material:{color:[255,215,0,.8]},width:1,height:.5}]}}]}}),this.view.map.add(this.phaseLineLayer)}}async handleSignalData(e){const{crossId:t,lat:n,lon:i,rtStage:s,channelsConfig:a}=e;await this.updateCountdown(t,n,i,s),!(!this.phaseLineLayer||!a)&&((!this.currentPhaseMap.has(t)||this.currentPhaseMap.get(t)!==s.stagePhase)&&await this.updatePhaseLine(t,s.channelsConfig,a),this.currentPhaseMap.set(t,s.stagePhase))}clearSignal(){this.phaseLineLayer&&(this.phaseLineLayer.visible=!1),this.countdownWatchHandel&&(this.countdownWatchHandel.remove(),this.countdownWatchHandel=void 0),this.countdownCanvasMap.forEach(e=>{this.view.container.removeChild(e.backgroundCanvas),this.view.container.removeChild(e.countdownCanvas)}),this.countdownCanvasMap.clear()}async updateCountdown(e,t,n,i){if(this.isDeletingCanvas)return;const s=this.countdownCanvasMap.get(e);if(s)this.drawCountdownText(s.countdownCanvas,i);else try{const a=new u.Point({longitude:n,latitude:t,z:10}),o=this.view.toScreen(a),r=await this.createCountdownCanvas(),c=r[0],h=r[1];c.style.left=o.x+"px",c.style.top=o.y+"px",h.style.left=o.x+"px",h.style.top=o.y+"px",this.countdownCanvasMap.set(e,{backgroundCanvas:c,countdownCanvas:h,mapPoint:a}),this.drawCountdownText(h,i)}catch(a){console.log("倒计时canvas创建失败",e,a)}this.countdownWatchHandel||(this.countdownWatchHandel=w.watch(()=>this.view.extent,()=>{this.countdownCanvasMap.forEach(a=>{const o=this.view.toScreen(a.mapPoint);a.backgroundCanvas.style.left=o.x+"px",a.backgroundCanvas.style.top=o.y+"px",a.countdownCanvas.style.left=o.x+"px",a.countdownCanvas.style.top=o.y+"px"})}))}drawCountdownText(e,t){const n=e.getContext("2d");n.clearRect(0,0,e.width,e.height),n.font="24px Digital",n.textBaseline="middle",n.textAlign="center",n.fillStyle=t.stageRemainingTime<=t.stageAllRedTime?"red":t.stageRemainingTime<=t.stageAllRedTime+t.stageYellowTime?"yellow":"lime",n.fillText(`${t.stageID} ${t.stageRemainingTime.toFixed(0)}`,e.width/2,e.height/2)}drawCircle(e,t){console.log(t);const n=e.getContext("2d");n.clearRect(0,0,e.width,e.height),this.ctxDraw(n,"lime",e.width/2,e.height/2,20,-Math.PI/2,-Math.PI/2+2*.6*Math.PI)}ctxDraw(e,t,n,i,s,a,o){e.save,e.beginPath(),e.lineWidth=4,e.strokeStyle=t,e.arc(n,i,s,a,o),e.stroke(),e.closePath(),e.font="26px Digital",e.textBaseline="middle",e.textAlign="center",e.fillText("A",n,i),e.restore()}async updatePhaseLine(e,t,n){const i=this.phaseLineLayer.source.filter(s=>s.getAttribute("id").includes(e));i.forEach(s=>{const a=s.getAttribute("id");this.isLaneInChannels(a,t)?s.setAttribute("color","green"):this.isLaneInChannels(a,n)?s.setAttribute("color","red"):s.setAttribute("color","green")}),await this.phaseLineLayer.applyEdits({updateFeatures:i})}isLaneInChannels(e,t){const n=e.split("+"),i=n[1],s=n[2];for(let a=0;a<t.length;a++)for(let o=0;o<t[a].laneSnList.length;o++){const r=t[a].laneSnList[o].toFixed(0);if(i===r[0]&&s===r[1])return!0}return!1}createCountdownCanvas(){return new Promise((e,t)=>{const n=new Image;n.src=`${this.mapConfig.assetsRoot}/Images/timeboard/CountdownBG.png`,console.log(n.src),n.onload=()=>{const i=document.createElement("canvas");i.width=this.canvasWidth,i.height=this.canvasHeight,i.style.position="absolute",i.style.transform="translate(-50%, -50%)",i.getContext("2d").drawImage(n,0,0,this.canvasWidth,this.canvasHeight),this.view.container.appendChild(i);const a=document.createElement("canvas");a.width=this.canvasWidth-10,a.height=this.canvasHeight-10,a.style.position="absolute",a.style.transform="translate(-50%, -50%)",this.view.container.appendChild(a),e([i,a])},n.onerror=i=>{t(i)}})}}exports.default=m;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("@arcgis/core/core/reactiveUtils"),u=require("@arcgis/core/geometry"),p=require("@arcgis/core/layers/FeatureLayer"),g=require("../../stores/index.js");function y(l){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const t in l)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(l,t);Object.defineProperty(e,t,n.get?n:{enumerable:!0,get:()=>l[t]})}}return e.default=l,Object.freeze(e)}const w=y(d);class m{constructor(e){this.currentPhaseMap=new Map,this.countdownCanvasMap=new Map,this.lastDataTime=0,this.isDeletingCanvas=!1,this.canvasWidth=80,this.canvasHeight=40,this.view=(e.type==="2d",e);const t=g.default.useAppDataStore;this.mapConfig=JSON.parse(JSON.stringify(t.mapConfig))}async initializeLayer(){if(this.mapConfig.phaseLineLayer)if(this.phaseLineLayer)this.phaseLineLayer.visible||(this.phaseLineLayer.visible=!0);else{const e=`${this.mapConfig.assetsRoot}/${this.mapConfig.phaseLineLayer}`,i=(await(await fetch(e)).json()).features.map((s,a)=>({geometry:{type:"polyline",paths:[s.geometry.coordinates]},attributes:{ObjectID:a+1,id:s.properties.id,color:"hide"}}));this.phaseLineLayer=new p({source:i,geometryType:"polyline",objectIdField:"ObjectID",outFields:["*"],fields:[{name:"ObjectID",alias:"ObjectID",type:"oid"},{name:"color",alias:"color",type:"string"}],renderer:{type:"unique-value",field:"color",defaultSymbol:{type:"simple-line",color:"lightblue",width:"2px",style:"none"},uniqueValueInfos:[{value:"green",symbol:{type:"line-3d",symbolLayers:[{type:"path",profile:"quad",material:{color:[19,255,69,.8]},width:1,height:.5}]}},{value:"red",symbol:{type:"line-3d",symbolLayers:[{type:"path",profile:"quad",material:{color:[254,5,9,.8]},width:1,height:.5}]}},{value:"yellow",symbol:{type:"line-3d",symbolLayers:[{type:"path",profile:"quad",material:{color:[255,215,0,.8]},width:1,height:.5}]}}]}}),this.view.map.add(this.phaseLineLayer)}}async handleSignalData(e){const{crossId:t,lat:n,lon:i,rtStage:s,channelsConfig:a}=e;await this.updateCountdown(t,n,i,s),!(!this.phaseLineLayer||!a)&&((!this.currentPhaseMap.has(t)||this.currentPhaseMap.get(t)!==s.stagePhase)&&await this.updatePhaseLine(t,s.channelsConfig,a),this.currentPhaseMap.set(t,s.stagePhase))}clearSignal(){this.phaseLineLayer&&(this.phaseLineLayer.visible=!1),this.countdownWatchHandel&&(this.countdownWatchHandel.remove(),this.countdownWatchHandel=void 0),this.countdownCanvasMap.forEach(e=>{this.view.container.removeChild(e.backgroundCanvas),this.view.container.removeChild(e.countdownCanvas)}),this.countdownCanvasMap.clear()}async updateCountdown(e,t,n,i){if(this.isDeletingCanvas)return;const s=this.countdownCanvasMap.get(e);if(s)this.drawCountdownText(s.countdownCanvas,i);else try{const a=new u.Point({longitude:n,latitude:t,z:10}),o=this.view.toScreen(a),r=await this.createCountdownCanvas(),c=r[0],h=r[1];c.style.left=o.x+"px",c.style.top=o.y+"px",h.style.left=o.x+"px",h.style.top=o.y+"px",this.countdownCanvasMap.set(e,{backgroundCanvas:c,countdownCanvas:h,mapPoint:a}),this.drawCountdownText(h,i)}catch(a){console.log("倒计时canvas创建失败",e,a)}this.countdownWatchHandel||(this.countdownWatchHandel=w.watch(()=>this.view.extent,()=>{this.countdownCanvasMap.forEach(a=>{const o=this.view.toScreen(a.mapPoint);a.backgroundCanvas.style.left=o.x+"px",a.backgroundCanvas.style.top=o.y+"px",a.countdownCanvas.style.left=o.x+"px",a.countdownCanvas.style.top=o.y+"px"})}))}drawCountdownText(e,t){const n=e.getContext("2d");n.clearRect(0,0,e.width,e.height),n.font="24px Digital",n.textBaseline="middle",n.textAlign="center",n.fillStyle=t.stageRemainingTime<=t.stageAllRedTime?"red":t.stageRemainingTime<=t.stageAllRedTime+t.stageYellowTime?"yellow":"lime",n.fillText(`${t.stageID} ${t.stageRemainingTime.toFixed(0)}`,e.width/2,e.height/2)}drawCircle(e,t){console.log(t);const n=e.getContext("2d");n.clearRect(0,0,e.width,e.height),this.ctxDraw(n,"lime",e.width/2,e.height/2,20,-Math.PI/2,-Math.PI/2+2*.6*Math.PI)}ctxDraw(e,t,n,i,s,a,o){e.save,e.beginPath(),e.lineWidth=4,e.strokeStyle=t,e.arc(n,i,s,a,o),e.stroke(),e.closePath(),e.font="26px Digital",e.textBaseline="middle",e.textAlign="center",e.fillText("A",n,i),e.restore()}async updatePhaseLine(e,t,n){const i=this.phaseLineLayer.source.filter(s=>s.getAttribute("id").includes(e));i.forEach(s=>{const a=s.getAttribute("id");this.isLaneInChannels(a,t)?s.setAttribute("color","green"):this.isLaneInChannels(a,n)?s.setAttribute("color","red"):s.setAttribute("color","green")}),await this.phaseLineLayer.applyEdits({updateFeatures:i})}isLaneInChannels(e,t){const n=e.split("+"),i=n[1],s=n[2];for(let a=0;a<t.length;a++)for(let o=0;o<t[a].laneSnList.length;o++){const r=t[a].laneSnList[o].toFixed(0);if(i===r[0]&&s===r[1])return!0}return!1}createCountdownCanvas(){return new Promise((e,t)=>{const n=new Image;n.src=`${this.mapConfig.assetsRoot}/Images/timeboard/CountdownBG.png`,n.onload=()=>{const i=document.createElement("canvas");i.width=this.canvasWidth,i.height=this.canvasHeight,i.style.position="absolute",i.style.transform="translate(-50%, -50%)",i.getContext("2d").drawImage(n,0,0,this.canvasWidth,this.canvasHeight),this.view.container.appendChild(i);const a=document.createElement("canvas");a.width=this.canvasWidth-10,a.height=this.canvasHeight-10,a.style.position="absolute",a.style.transform="translate(-50%, -50%)",this.view.container.appendChild(a),e([i,a])},n.onerror=i=>{t(i)}})}}exports.default=m;

package/lib/src/gis-map/utils/holo-flow/trace-holo-flow.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("@arcgis/core/views/3d/externalRenderers"),g=require("../../stores/index.js"),m=require("./trace-renderer-layer.js"),T=require("./trace-renderer-webgl.js");function b(o){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const r in o)if(r!=="default"){const n=Object.getOwnPropertyDescriptor(o,r);Object.defineProperty(e,r,n.get?n:{enumerable:!0,get:()=>o[r]})}}return e.default=o,Object.freeze(e)}const R=b(f);class V{constructor(e){this.lastDataTime=0,this.view=e;const r=g.default.useAppDataStore;this.mapConfig=JSON.parse(JSON.stringify(r.mapConfig)),e.type==="3d"?(this.traceRenderer=new T.default(e),R.add(e,this.traceRenderer)):this.traceRenderer=new m.default(e)}handleVehicleTraceData(e){const r=new Date().getTime(),{newVehList:n,updateVehList:a,deleteVehList:i,jgsj:s}=e,l=e.crossId||"",d=[],h=[];if(n&&n.length>0){for(const t of n){t.localTimestamp||(t.localTimestamp=s||r);const c=this.buildVehicleTrackData(t,l);c&&d.push(c)}this.traceRenderer.addVehicles(d)}if(a&&a.length>0){for(const t of a){const c=this.buildVehicleTrackData(t,l);c&&h.push(c)}this.traceRenderer.updateVehicles(h)}if(i&&i.length>0){const t=i.map(c=>l+"-"+(c.ptcId||c.vehno||c.vehNo));this.traceRenderer.deleteVehicles(t)}}toggleTrafficInfo(e){this.traceRenderer.toggleTrafficInfo(e)}clearTrace(){this.traceRenderer.clearVehicles()}updatePanelContent(e){this.traceRenderer.updatePanelContent(e)}toggleGroundVehicle(e){this.traceRenderer.toggleGroundVehicle(e)}toggleElevatedVehicle(e){this.traceRenderer.toggleElevatedVehicle(e)}setInterpolate(e){this.traceRenderer.setInterpolate(e)}buildVehicleTrackData(e,r){const n=e.longitude,a=e.latitude,i=e.ptcId,s=Number(e.ptcType),l=e.heading,d=Number(e.vehicleType),h=Number(e.vehicleColor),t=e.plateNo||e.plateno,c=Number(e.plateColor),u=e.timestamp,p=String(e.roadLayer)||"1";if(!(s<0||s>8))return{ptcId:i,crossId:r,vehicleId:r+"-"+i,x:n,y:a,ptcType:s,vehicleType:d,heading:s===2?-l:l,vehicleColor:h,showName:t&&t!==""&&t!=="0"&&t!=="000000"?t:"",plateNo:t,plateColor:c,timestamp:u,localTimestamp:Date.now(),roadLayer:p}}}exports.default=V;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const g=require("@arcgis/core/views/3d/externalRenderers"),m=require("../../stores/index.js"),T=require("./trace-renderer-external.js"),b=require("./trace-renderer-layer.js");function R(o){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const r in o)if(r!=="default"){const n=Object.getOwnPropertyDescriptor(o,r);Object.defineProperty(e,r,n.get?n:{enumerable:!0,get:()=>o[r]})}}return e.default=o,Object.freeze(e)}const V=R(g);class y{constructor(e){this.lastDataTime=0,this.view=e;const r=m.default.useAppDataStore;this.mapConfig=JSON.parse(JSON.stringify(r.mapConfig)),e.type==="3d"?(this.traceRenderer=new T.default(e),V.add(e,this.traceRenderer)):this.traceRenderer=new b.default(e)}handleVehicleTraceData(e){const r=new Date().getTime(),{newVehList:n,updateVehList:a,deleteVehList:i,jgsj:s}=e,l=e.crossId||"",d=[],h=[];if(n&&n.length>0){for(const t of n){t.localTimestamp||(t.localTimestamp=s||r);const c=this.buildVehicleTrackData(t,l);c&&d.push(c)}this.traceRenderer.addVehicles(d)}if(a&&a.length>0){for(const t of a){const c=this.buildVehicleTrackData(t,l);c&&h.push(c)}this.traceRenderer.updateVehicles(h)}if(i&&i.length>0){const t=i.map(c=>l+"-"+(c.ptcId||c.vehno||c.vehNo));this.traceRenderer.deleteVehicles(t)}}toggleTrafficInfo(e){this.traceRenderer.toggleTrafficInfo(e)}clearTrace(){this.traceRenderer.clearVehicles()}updatePanelContent(e){this.traceRenderer.updatePanelContent(e)}toggleGroundVehicle(e){this.traceRenderer.toggleGroundVehicle(e)}toggleElevatedVehicle(e){this.traceRenderer.toggleElevatedVehicle(e)}setInterpolate(e){this.traceRenderer.setInterpolate(e)}buildVehicleTrackData(e,r){const n=e.longitude,a=e.latitude,i=e.ptcId,s=Number(e.ptcType),l=e.heading,d=Number(e.vehicleType),h=Number(e.vehicleColor),t=e.plateNo||e.plateno,c=Number(e.plateColor),u=e.timestamp,p=e.localTimestamp,f=String(e.roadLayer)||"1";if(!(s<0||s>8))return{ptcId:i,crossId:r,vehicleId:r+"-"+i,x:n,y:a,ptcType:s,vehicleType:d,heading:s===2?-l:l,vehicleColor:h,showName:t&&t!==""&&t!=="0"&&t!=="000000"?t:"",plateNo:t,plateColor:c,timestamp:u,localTimestamp:p,roadLayer:f}}}exports.default=y;

package/lib/src/gis-map/utils/holo-flow/{trace-renderer-webgl.d.ts → trace-renderer-external.d.ts}

@@ -1,5 +1,5 @@
 import { EVehiclePlateState, IToggleTrafficInfoParams, ITraceRendererInterface, IVehicleTrack } from '../../../types';
-export default class TraceRendererWebgl implements ITraceRendererInterface {
+export default class TraceRendererExternal implements ITraceRendererInterface {
     private renderer;
     private scene;
     private camera;
@@ -25,27 +25,29 @@ export default class TraceRendererWebgl implements ITraceRendererInterface {
     private historyPositionMap;
     private vehicleObjectMap;
     private needInterpolate;
+    private mesh;
+    private sprite;
     constructor(view: __esri.SceneView);
     setInterpolate(needInterpolate: boolean): void;
     private context;
     setup(context: any): Promise<void>;
-    private lastRenderTime;
+    private geometryTest;
     render(context: any): Promise<void>;
     /**
      * 新增车辆
      * */
-    addVehicles(objects: IVehicleTrack[]): void;
+    addVehicles(objects: IVehicleTrack[]): Promise<void>;
     /**
      * 更新车辆
      * */
-    updateVehicles(objects: IVehicleTrack[]): void;
+    updateVehicles(objects: IVehicleTrack[]): Promise<void>;
     private toRenderCoordinates;
     /**
      * 删除车辆
      * */
     deleteVehicles(idList: string[]): void;
     private deleteVehicle;
-    toggleTrafficInfo(params: IToggleTrafficInfoParams): void;
+    toggleTrafficInfo(params: IToggleTrafficInfoParams): Promise<void>;
     /**
      * 清除全部车辆
      * */
@@ -55,7 +57,7 @@ export default class TraceRendererWebgl implements ITraceRendererInterface {
      * @param contentType
      * @returns
      */
-    updatePanelContent(contentType: EVehiclePlateState): void;
+    updatePanelContent(contentType: EVehiclePlateState): Promise<void>;
     toggleGroundVehicle(visible: boolean): void;
     toggleElevatedVehicle(visible: boolean): void;
     /**

package/lib/src/gis-map/utils/holo-flow/trace-renderer-external.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const S=require("@arcgis/core/geometry/SpatialReference"),P=require("@arcgis/core/views/3d/externalRenderers"),T=require("three"),g=require("three/examples/jsm/loaders/GLTFLoader.js"),p=require("../../../types/index.js"),C=require("../../stores/index.js");function y(f){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(f){for(const e in f)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(f,e);Object.defineProperty(i,e,t.get?t:{enumerable:!0,get:()=>f[e]})}}return i.default=f,Object.freeze(i)}const b=y(P),o=y(T);class V{constructor(i){this.defaultMaterial=new o.MeshBasicMaterial({color:6908265}),this.materialMap=new Map([[1,new o.MeshBasicMaterial({color:16777215})],[2,new o.MeshBasicMaterial({color:7833753})],[3,new o.MeshBasicMaterial({color:16766720})],[4,new o.MeshBasicMaterial({color:16758465})],[5,new o.MeshBasicMaterial({color:14423100})],[6,new o.MeshBasicMaterial({color:3329330})],[7,new o.MeshBasicMaterial({color:2003183})],[8,new o.MeshBasicMaterial({color:16032864})],[9,new o.MeshBasicMaterial({color:2105376})],[10,new o.MeshBasicMaterial({color:9662683})],[99,new o.MeshBasicMaterial({color:6908265})]]),this.carModelReady=!1,this.vanModelReady=!1,this.truckModelReady=!1,this.busModelReady=!1,this.bicycleModelReady=!1,this.currentSpriteContent=p.EVehiclePlateState.None,this.historyPositionMap=new Map,this.vehicleObjectMap=new Map,this.needInterpolate=!0;const e=C.default.useAppDataStore;this.assetsRoot=JSON.parse(JSON.stringify(e.mapConfig)).assetsRoot,this.view=i;const t=new g.GLTFLoader;t.load(`${this.assetsRoot}/3DModels/car.glb`,s=>{this.carModel=s.scene,this.carModel.rotation.x=o.MathUtils.degToRad(90),this.carModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/van.glb`,s=>{this.vanModel=s.scene,this.vanModel.rotation.x=o.MathUtils.degToRad(90),this.vanModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/truck.glb`,s=>{this.truckModel=s.scene,this.truckModel.scale.set(1.2,1,1.5),this.truckModel.rotation.x=o.MathUtils.degToRad(90),this.truckModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/bus.glb`,s=>{this.busModel=s.scene,this.busModel.rotation.x=o.MathUtils.degToRad(90),this.busModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/bicycle.glb`,s=>{this.bicycleModel=s.scene,this.bicycleModel.rotation.x=o.MathUtils.degToRad(90),this.bicycleModel.rotation.y=o.MathUtils.degToRad(180),this.bicycleModelReady=!0}),document.addEventListener("visibilitychange",()=>{this.clearVehicles(),this.needInterpolate=!document.hidden},!1)}setInterpolate(i){this.clearVehicles(),this.needInterpolate=i}async setup(i){this.context=i,this.renderer=new o.WebGLRenderer({context:i.gl,premultipliedAlpha:!0,logarithmicDepthBuffer:!0,antialias:!0,powerPreference:"high-performance"}),this.renderer.setPixelRatio(window.devicePixelRatio),this.renderer.setViewport(0,0,this.view.width,this.view.height),this.renderer.autoClearDepth=!1,this.renderer.autoClearStencil=!1,this.renderer.autoClearColor=!1;const e=this.renderer.setRenderTarget.bind(this.renderer);this.renderer.setRenderTarget=t=>{e(t),t==null&&i.bindRenderTarget()},this.scene=new o.Scene,this.camera=new o.PerspectiveCamera,this.ambient=new o.AmbientLight(16777215,.5),this.scene.add(this.ambient),this.sun=new o.DirectionalLight(16777215,.5),this.scene.add(this.sun),i.resetWebGLState()}geometryTest(){new g.GLTFLoader().load(`${this.assetsRoot}/3DModels/car.glb`,e=>{this.mesh=e.scene,this.mesh.rotation.x=o.MathUtils.degToRad(90);const t=[121.46892831020403,31.239681632841354,0],s=this.toRenderCoordinates(t);this.mesh.position.set(s[0],s[1],s[2]),this.scene.add(this.mesh),new o.TextureLoader().load(`${this.assetsRoot}/Images/PlateBG/grey.png`,r=>{const n=new o.SpriteMaterial({map:r,transparent:!1}),a=new o.Sprite(n);a.scale.set(5,2.5,1),a.position.set(0,5,-4),this.mesh.add(a),console.log(this.mesh.visible,a.visible)})})}async render(i){var s;const e=i.camera;if(this.camera.position.set(e.eye[0],e.eye[1],e.eye[2]),this.camera.up.set(e.up[0],e.up[1],e.up[2]),this.camera.lookAt(new o.Vector3(e.center[0],e.center[1],e.center[2])),this.camera.projectionMatrix.fromArray(e.projectionMatrix),this.needInterpolate)for(const l of this.vehicleObjectMap.keys()){const r=(s=this.vehicleObjectMap.get(l))==null?void 0:s.model;if(!r)continue;const n=this.computeVehiclePosition(l);if(n){const a=this.toRenderCoordinates(n);r.position.set(a[0],a[1],a[2]),r.rotation.y=o.MathUtils.degToRad(-n[3])}}const t=i.sunLight;this.sun.position.set(t.direction[0],t.direction[1],t.direction[2]),this.sun.intensity=t.diffuse.intensity,this.sun.color=new o.Color(t.diffuse.color[0],t.diffuse.color[1],t.diffuse.color[2]),this.ambient.intensity=t.ambient.intensity,this.ambient.color=new o.Color(t.ambient.color[0],t.ambient.color[1],t.ambient.color[2]),this.renderer.resetState(),i.bindRenderTarget(),this.renderer.render(this.scene,this.camera),b.requestRender(this.view),i.resetWebGLState()}async addVehicles(i){if(!(!this.carModelReady||!this.vanModelReady||!this.truckModelReady||!this.busModelReady||!this.bicycleModelReady))for(const e of i){const{vehicleId:t,localTimestamp:s}=e,l=Number(e.x),r=Number(e.y),n=Number(e.heading);this.historyPositionMap.set(t,[{pos:[l,r,0],heading:n,time:s}]);const a=this.getVehicleModel(e);a.name=t,a.visible=!this.needInterpolate;try{const c=await this.createPlateSprite(e);c&&(a.add(c),c.position.set(0,5,-4)),this.scene.add(a),this.vehicleObjectMap.set(t,{model:a,data:e,waitForDelete:!1,isMoving:!1})}catch(c){console.log("createPlateSprite error:",c)}}}async updateVehicles(i){if(!this.carModelReady||!this.vanModelReady||!this.truckModelReady||!this.busModelReady||!this.bicycleModelReady)return;const e=[];for(const t of i){const{vehicleId:s,localTimestamp:l}=t,r=Number(t.x),n=Number(t.y);let a=Number(t.heading);const c=this.vehicleObjectMap.get(s);if(!c)e.push(t);else{if(c.data.vehicleColor!==t.vehicleColor||c.data.vehicleType!==t.vehicleType){this.scene.remove(c.model),this.disposeModel(c.model),c.model=this.getVehicleModel(t);const h=await this.createPlateSprite(t);h&&(c.model.add(h),h.position.set(0,5,-4)),this.scene.add(c.model)}if(c.data.showName!==t.showName||c.data.plateColor!==t.plateColor){const h=c.model.getObjectByName("VehiclePlate");h&&(c.model.remove(h),this.disposeModel(h));const d=await this.createPlateSprite(t);d&&(c.model.add(d),d.position.set(0,5,-4))}if(c.data=t,this.needInterpolate){const h=this.historyPositionMap.get(s),d=h[h.length-1];Math.abs(a-d.heading)>=180&&(a>d.heading?d.heading+=360:a+=360),h.push({pos:[r,n,0],heading:a,time:l})}else{this.historyPositionMap.set(s,[{pos:[r,n,0],heading:a,time:l}]);const h=this.toRenderCoordinates([r,n,0]);c.model.position.set(h[0],h[1],h[2]),c.model.rotation.y=o.MathUtils.degToRad(-a)}}}this.addVehicles(e),this.needInterpolate||this.render(this.context)}toRenderCoordinates(i){const e=[0,0,0];return b.toRenderCoordinates(this.view,i,0,S.WGS84,e,0,1),e}deleteVehicles(i){i.forEach(e=>{const t=this.vehicleObjectMap.get(e);t&&(this.needInterpolate?t.isMoving?t.waitForDelete=!0:this.deleteVehicle(t):this.deleteVehicle(t))})}deleteVehicle(i){this.scene.remove(i.model),this.disposeModel(i.model);const e=i.data.vehicleId;this.vehicleObjectMap.delete(e),this.historyPositionMap.delete(e)}async toggleTrafficInfo(i){i.name==="vehiclePlate"&&(i.visible===!0&&this.currentSpriteContent===p.EVehiclePlateState.None?await this.updatePanelContent(p.EVehiclePlateState.Id):await this.updatePanelContent(i.visible?this.currentSpriteContent:p.EVehiclePlateState.None))}clearVehicles(){for(const i of this.vehicleObjectMap.keys()){const e=this.vehicleObjectMap.get(i);e&&(this.disposeModel(e.model),this.scene.remove(e.model))}this.vehicleObjectMap.clear(),this.historyPositionMap.clear()}async updatePanelContent(i){if(i!==this.currentSpriteContent){this.currentSpriteContent=i;for(const e of this.vehicleObjectMap.keys()){const t=this.vehicleObjectMap.get(e);if(t){const s=t.model.getObjectByName("VehiclePlate");if(s&&(t.model.remove(s),this.disposeModel(s)),i!==p.EVehiclePlateState.None){const l=await this.createPlateSprite(t.data);l&&(t.model.add(l),l.position.set(0,5,-4))}}}}}toggleGroundVehicle(i){}toggleElevatedVehicle(i){}disposeModel(i){i.traverse(e=>{e instanceof o.Mesh&&(e.geometry.dispose(),e.material.dispose())})}computeVehiclePosition(i){const e=this.historyPositionMap.get(i),t=this.vehicleObjectMap.get(i);if(!t||!e||!t.isMoving&&e.length<=2)return;const s=Date.now();t.model.visible=!0,t.isMoving=!0,t.segmentStartTime||(t.segmentStartTime=s,t.segmentTotalTime=e[1].time-e[0].time);const l=s-t.segmentStartTime,r=Math.min(l/t.segmentTotalTime,1);if(r===1)if(e.shift(),e.length===1){t.waitForDelete===!0?this.deleteVehicle(t):(t.segmentStartTime=void 0,t.segmentTotalTime=void 0,t.model.visible=!1,t.isMoving=!1,console.log("pause vehicle",i));return}else return t.segmentStartTime=Date.now(),t.segmentTotalTime=e[1].time-e[0].time,(e[1].heading>=270&&e[0].heading<=90||e[1].heading<=90&&e[0].heading>=270)&&(e[1].heading>e[0].heading?e[0].heading+=360:e[1].heading+=360),e[0].pos.concat(e[0].heading);else{const n=e[0].pos[0]+(e[1].pos[0]-e[0].pos[0])*r,a=e[0].pos[1]+(e[1].pos[1]-e[0].pos[1])*r,c=e[0].heading+(e[1].heading-e[0].heading)*r;return[n,a,0,c]}}getVehicleModel(i){let e;if(i.ptcType===2)e=this.bicycleModel.clone();else{switch(i.vehicleType){case 10:e=this.carModel.clone();break;case 20:e=this.vanModel.clone();break;case 25:e=this.truckModel.clone();break;case 50:e=this.busModel.clone();break;default:e=this.carModel.clone();break}const t=this.materialMap.get(i.vehicleColor)||this.defaultMaterial;let s=!1;e.traverse(l=>{!s&&l instanceof o.Mesh&&(l.material=t,s=!0)})}return e}createCanvas(i,e,t){const s=document.createElement("canvas"),l=i.width,r=i.height;s.width=l,s.height=r;const n=s.getContext("2d");if(!n){console.log("canvas创建失败");return}return n.fillStyle="rgba(0,0,0,0.0)",n.fillRect(0,0,l,r),n.drawImage(i,0,0,l,r),n.beginPath(),n.translate(l/2,r/2),n.fillStyle=t,n.font="bold 32px 宋体",n.textBaseline="middle",n.textAlign="center",n.fillText(e,0,0),s}createPlateSprite(i){return new Promise((e,t)=>{var c,h;const s=!i.plateNo||i.plateNo==="0"||i.plateNo==="000000";if(this.currentSpriteContent===p.EVehiclePlateState.None||this.currentSpriteContent===p.EVehiclePlateState.PlateNumber&&s){e(void 0);return}const l=new Image;let r="",n="",a="";if(this.currentSpriteContent===p.EVehiclePlateState.PlateNumber||this.currentSpriteContent===p.EVehiclePlateState.Mix)if(s)r="grey",n=i.ptcId,a="#ffffff";else switch(n=((c=i.showName)==null?void 0:c.substring(0,2))+"•"+((h=i.showName)==null?void 0:h.substring(2)),i.plateColor){case 1:r="blue",a="#ffffff";break;case 2:r="yellow",a="#000000";break;case 3:r="white",a="#000000";break;case 4:r="black";break;case 5:r="neo_yellow",a="#000000";break;case 6:r="neo_green",a="#000000";break;default:r="grey",n=i.plateNo,a="#ffffff";break}else this.currentSpriteContent===p.EVehiclePlateState.Id&&(r="grey",n=i.ptcId,a="#ffffff");l.src=`${this.assetsRoot}/Images/PlateBG/${r}.png`,l.onload=()=>{const d=this.createCanvas(l,n,a);if(!d)t("canvas创建失败");else{const u=new o.CanvasTexture(d),v=new o.SpriteMaterial({map:u,transparent:!1}),M=new o.Sprite(v),m=.05,w=d.width*m,R=d.height*m;M.scale.set(w,R,1),M.name="VehiclePlate",e(M)}l.onerror=u=>{console.log(`号牌背景加载失败: ${l.src}`,u),t(u)}}})}}exports.default=V;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gisviewer-vue3-arcgis",
-  "version": "1.0.102",
+  "version": "1.0.103",
   "main": "lib/index.js",
   "module": "es/index.mjs",
   "files": [

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

@@ -1,343 +0,0 @@
-import y from "@arcgis/core/geometry/SpatialReference";
-import * as g from "@arcgis/core/views/3d/externalRenderers";
-import * as a from "three";
-import { GLTFLoader as b } from "three/examples/jsm/loaders/GLTFLoader.js";
-import { EVehiclePlateState as d } from "../../../types/index.mjs";
-import w from "../../stores/index.mjs";
-class k {
-  constructor(i) {
-    this.defaultMaterial = new a.MeshBasicMaterial({
-      color: 6908265
-    }), this.materialMap = /* @__PURE__ */ new Map([
-      [1, new a.MeshBasicMaterial({ color: 16777215 })],
-      [2, new a.MeshBasicMaterial({ color: 7833753 })],
-      [3, new a.MeshBasicMaterial({ color: 16766720 })],
-      [4, new a.MeshBasicMaterial({ color: 16758465 })],
-      [5, new a.MeshBasicMaterial({ color: 14423100 })],
-      [6, new a.MeshBasicMaterial({ color: 3329330 })],
-      [7, new a.MeshBasicMaterial({ color: 2003183 })],
-      [8, new a.MeshBasicMaterial({ color: 16032864 })],
-      [9, new a.MeshBasicMaterial({ color: 2105376 })],
-      [10, new a.MeshBasicMaterial({ color: 9662683 })],
-      [99, new a.MeshBasicMaterial({ color: 6908265 })]
-    ]), this.carModelReady = !1, this.vanModelReady = !1, this.truckModelReady = !1, this.busModelReady = !1, this.bicycleModelReady = !1, this.currentSpriteContent = d.None, this.historyPositionMap = /* @__PURE__ */ new Map(), this.vehicleObjectMap = /* @__PURE__ */ new Map(), this.needInterpolate = !0, this.lastRenderTime = Date.now();
-    const e = w.useAppDataStore;
-    this.assetsRoot = JSON.parse(
-      JSON.stringify(e.mapConfig)
-    ).assetsRoot, this.view = i;
-    const t = new b();
-    t.load(`${this.assetsRoot}/3DModels/car.glb`, (s) => {
-      this.carModel = s.scene, this.carModel.rotation.x = a.MathUtils.degToRad(90), this.carModelReady = !0;
-    }), t.load(`${this.assetsRoot}/3DModels/van.glb`, (s) => {
-      this.vanModel = s.scene, this.vanModel.rotation.x = a.MathUtils.degToRad(90), this.vanModelReady = !0;
-    }), t.load(`${this.assetsRoot}/3DModels/truck.glb`, (s) => {
-      this.truckModel = s.scene, this.truckModel.scale.set(1.2, 1, 1.5), this.truckModel.rotation.x = a.MathUtils.degToRad(90), this.truckModelReady = !0;
-    }), t.load(`${this.assetsRoot}/3DModels/bus.glb`, (s) => {
-      this.busModel = s.scene, this.busModel.rotation.x = a.MathUtils.degToRad(90), this.busModelReady = !0;
-    }), t.load(`${this.assetsRoot}/3DModels/bicycle.glb`, (s) => {
-      this.bicycleModel = s.scene, this.bicycleModel.rotation.x = a.MathUtils.degToRad(90), this.bicycleModel.rotation.y = a.MathUtils.degToRad(180), this.bicycleModelReady = !0;
-    }), document.addEventListener(
-      "visibilitychange",
-      () => {
-        this.clearVehicles(), this.needInterpolate = !document.hidden;
-      },
-      !1
-    );
-  }
-  setInterpolate(i) {
-    this.clearVehicles(), this.needInterpolate = i;
-  }
-  async setup(i) {
-    this.context = i, this.renderer = new a.WebGLRenderer({
-      context: i.gl,
-      premultipliedAlpha: !1,
-      antialias: !0,
-      powerPreference: "high-performance"
-    }), this.renderer.setPixelRatio(window.devicePixelRatio), this.renderer.setViewport(0, 0, this.view.width, this.view.height), this.renderer.autoClearDepth = !1, this.renderer.autoClearStencil = !1, this.renderer.autoClearColor = !1;
-    const e = this.renderer.setRenderTarget.bind(
-      this.renderer
-    );
-    this.renderer.setRenderTarget = (t) => {
-      e(t), t == null && i.bindRenderTarget();
-    }, this.scene = new a.Scene(), this.camera = new a.PerspectiveCamera(), this.ambient = new a.AmbientLight(16777215, 0.5), this.scene.add(this.ambient), this.sun = new a.DirectionalLight(16777215, 0.5), this.scene.add(this.sun), i.resetWebGLState();
-  }
-  async render(i) {
-    var n;
-    const e = Date.now();
-    this.lastRenderTime = e;
-    const t = i.camera;
-    if (this.camera.position.set(t.eye[0], t.eye[1], t.eye[2]), this.camera.up.set(t.up[0], t.up[1], t.up[2]), this.camera.lookAt(
-      new a.Vector3(t.center[0], t.center[1], t.center[2])
-    ), this.camera.projectionMatrix.fromArray(t.projectionMatrix), this.needInterpolate)
-      for (const l of this.vehicleObjectMap.keys()) {
-        const o = (n = this.vehicleObjectMap.get(l)) == null ? void 0 : n.model;
-        if (!o)
-          continue;
-        const h = this.computeVehiclePosition(l);
-        if (h) {
-          const r = this.toRenderCoordinates(h);
-          o.position.set(r[0], r[1], r[2]), o.rotation.y = a.MathUtils.degToRad(-h[3]);
-        }
-      }
-    const s = i.sunLight;
-    this.sun.position.set(s.direction[0], s.direction[1], s.direction[2]), this.sun.intensity = s.diffuse.intensity, this.sun.color = new a.Color(
-      s.diffuse.color[0],
-      s.diffuse.color[1],
-      s.diffuse.color[2]
-    ), this.ambient.intensity = s.ambient.intensity, this.ambient.color = new a.Color(
-      s.ambient.color[0],
-      s.ambient.color[1],
-      s.ambient.color[2]
-    ), this.renderer.resetState(), i.bindRenderTarget(), this.renderer.render(this.scene, this.camera), g.requestRender(this.view), i.resetWebGLState();
-  }
-  /**
-   * 新增车辆
-   * */
-  addVehicles(i) {
-    !this.carModelReady || !this.vanModelReady || !this.truckModelReady || !this.busModelReady || !this.bicycleModelReady || i.forEach((e) => {
-      const { vehicleId: t, localTimestamp: s } = e, n = Number(e.x), l = Number(e.y), o = Number(e.heading);
-      this.historyPositionMap.set(t, [
-        { pos: [n, l, 0], heading: o, time: s }
-      ]);
-      const h = this.getVehicleModel(e);
-      h.name = t, h.visible = !this.needInterpolate, this.createPlateSprite(e, (r) => {
-        h.add(r), r.position.set(0, 5, -4);
-      }), this.scene.add(h), this.vehicleObjectMap.set(t, {
-        model: h,
-        data: e,
-        waitForDelete: !1,
-        isMoving: !1
-      });
-    });
-  }
-  /**
-   * 更新车辆
-   * */
-  updateVehicles(i) {
-    if (!this.carModelReady || !this.vanModelReady || !this.truckModelReady || !this.busModelReady || !this.bicycleModelReady)
-      return;
-    const e = [];
-    i.forEach((t) => {
-      const { vehicleId: s, localTimestamp: n } = t, l = Number(t.x), o = Number(t.y);
-      let h = Number(t.heading);
-      const r = this.vehicleObjectMap.get(s);
-      if (!r)
-        e.push(t);
-      else {
-        if ((r.data.vehicleColor !== t.vehicleColor || r.data.vehicleType !== t.vehicleType) && (this.scene.remove(r.model), this.disposeModel(r.model), r.model = this.getVehicleModel(t), this.scene.add(r.model)), r.data.showName !== t.showName || r.data.plateColor !== t.plateColor) {
-          const c = r.model.getObjectByName("VehiclePlate");
-          c && (r.model.remove(c), this.disposeModel(c)), this.createPlateSprite(t, (p) => {
-            r.model.add(p), p.position.set(0, 5, -4);
-          });
-        }
-        if (r.data = t, this.needInterpolate) {
-          const c = this.historyPositionMap.get(
-            s
-          ), p = c[c.length - 1];
-          Math.abs(h - p.heading) >= 180 && (h > p.heading ? p.heading += 360 : h += 360), c.push({
-            pos: [l, o, 0],
-            heading: h,
-            time: n
-          });
-        } else {
-          this.historyPositionMap.set(s, [
-            { pos: [l, o, 0], heading: h, time: n }
-          ]);
-          const c = this.toRenderCoordinates([l, o, 0]);
-          r.model.position.set(c[0], c[1], c[2]), r.model.rotation.y = a.MathUtils.degToRad(-h);
-        }
-      }
-    }), this.addVehicles(e), this.needInterpolate || this.render(this.context);
-  }
-  toRenderCoordinates(i) {
-    const e = [0, 0, 0];
-    return g.toRenderCoordinates(
-      this.view,
-      i,
-      0,
-      y.WGS84,
-      e,
-      0,
-      1
-    ), e;
-  }
-  /**
-   * 删除车辆
-   * */
-  deleteVehicles(i) {
-    i.forEach((e) => {
-      const t = this.vehicleObjectMap.get(e);
-      t && (this.needInterpolate ? t.isMoving ? t.waitForDelete = !0 : this.deleteVehicle(t) : this.deleteVehicle(t));
-    });
-  }
-  deleteVehicle(i) {
-    this.scene.remove(i.model), this.disposeModel(i.model);
-    const e = i.data.vehicleId;
-    this.vehicleObjectMap.delete(e), this.historyPositionMap.delete(e);
-  }
-  toggleTrafficInfo(i) {
-    i.name === "vehiclePlate" && (i.visible === !0 && this.currentSpriteContent === d.None ? this.updatePanelContent(d.Id) : this.updatePanelContent(
-      i.visible ? this.currentSpriteContent : d.None
-    ));
-  }
-  /**
-   * 清除全部车辆
-   * */
-  clearVehicles() {
-    for (const i of this.vehicleObjectMap.keys()) {
-      const e = this.vehicleObjectMap.get(i);
-      e && (this.disposeModel(e.model), this.scene.remove(e.model));
-    }
-    this.vehicleObjectMap.clear(), this.historyPositionMap.clear();
-  }
-  /**
-   * 设置号牌显示状态
-   * @param contentType
-   * @returns
-   */
-  updatePanelContent(i) {
-    if (i !== this.currentSpriteContent) {
-      this.currentSpriteContent = i;
-      for (const e of this.vehicleObjectMap.keys()) {
-        const t = this.vehicleObjectMap.get(e);
-        if (t) {
-          const s = t.model.getObjectByName("VehiclePlate");
-          s && (t.model.remove(s), this.disposeModel(s)), i !== d.None && this.createPlateSprite(t.data, (n) => {
-            t.model.add(n), n.position.set(0, 5, -4);
-          });
-        }
-      }
-    }
-  }
-  toggleGroundVehicle(i) {
-  }
-  toggleElevatedVehicle(i) {
-  }
-  /**
-   * 释放模型资源
-   * */
-  disposeModel(i) {
-    i.traverse((e) => {
-      e instanceof a.Mesh && (e.geometry.dispose(), e.material.dispose());
-    });
-  }
-  /**
-   * 计算车辆位置
-   * */
-  computeVehiclePosition(i) {
-    const e = this.historyPositionMap.get(i), t = this.vehicleObjectMap.get(i);
-    if (!t || !e || !t.isMoving && e.length <= 2)
-      return;
-    const s = Date.now();
-    t.model.visible = !0, t.isMoving = !0, t.segmentStartTime || (t.segmentStartTime = s, t.segmentTotalTime = e[1].time - e[0].time);
-    const n = s - t.segmentStartTime, l = Math.min(
-      n / t.segmentTotalTime,
-      1
-    );
-    if (l === 1)
-      if (e.shift(), e.length === 1) {
-        t.waitForDelete === !0 ? (this.deleteVehicle(t), console.log("delete vehicle", i)) : (t.segmentStartTime = void 0, t.segmentTotalTime = void 0, t.model.visible = !1, t.isMoving = !1, console.log("pause vehicle", i));
-        return;
-      } else
-        return t.segmentStartTime = Date.now(), t.segmentTotalTime = e[1].time - e[0].time, (e[1].heading >= 270 && e[0].heading <= 90 || e[1].heading <= 90 && e[0].heading >= 270) && (e[1].heading > e[0].heading ? e[0].heading += 360 : e[1].heading += 360), e[0].pos.concat(e[0].heading);
-    else {
-      const o = e[0].pos[0] + (e[1].pos[0] - e[0].pos[0]) * l, h = e[0].pos[1] + (e[1].pos[1] - e[0].pos[1]) * l, r = e[0].heading + (e[1].heading - e[0].heading) * l;
-      return [o, h, 0, r];
-    }
-  }
-  /**
-   * 根据车辆类型、车身颜色获取模型
-   * */
-  getVehicleModel(i) {
-    let e;
-    if (i.ptcType === 2)
-      e = this.bicycleModel.clone();
-    else {
-      switch (i.vehicleType) {
-        case 10:
-          e = this.carModel.clone();
-          break;
-        case 20:
-          e = this.vanModel.clone();
-          break;
-        case 25:
-          e = this.truckModel.clone();
-          break;
-        case 50:
-          e = this.busModel.clone();
-          break;
-        default:
-          e = this.carModel.clone();
-          break;
-      }
-      const t = this.materialMap.get(i.vehicleColor) || this.defaultMaterial;
-      let s = !1;
-      e.traverse((n) => {
-        !s && n instanceof a.Mesh && (n.material = t, s = !0);
-      });
-    }
-    return e;
-  }
-  /**
-   * 创建号牌canvas
-   * */
-  createCanvas(i, e, t) {
-    const s = document.createElement("canvas"), n = i.width, l = i.height;
-    s.width = n, s.height = l;
-    const o = s.getContext("2d");
-    if (!o) {
-      console.log("canvas创建失败");
-      return;
-    }
-    return o.fillStyle = "rgba(0,0,0,0.0)", o.fillRect(0, 0, n, l), o.drawImage(i, 0, 0, n, l), o.beginPath(), o.translate(n / 2, l / 2), o.fillStyle = t, o.font = "bold 32px 宋体", o.textBaseline = "middle", o.textAlign = "center", o.fillText(e, 0, 0), s;
-  }
-  createPlateSprite(i, e) {
-    var h, r;
-    const t = !i.plateNo || i.plateNo === "0" || i.plateNo === "000000";
-    if (this.currentSpriteContent === d.None || this.currentSpriteContent === d.PlateNumber && t)
-      return;
-    const s = new Image();
-    let n = "", l = "", o = "";
-    if (this.currentSpriteContent === d.PlateNumber || this.currentSpriteContent === d.Mix)
-      if (t)
-        n = "grey", l = i.ptcId, o = "#ffffff";
-      else
-        switch (l = ((h = i.showName) == null ? void 0 : h.substring(0, 2)) + "•" + ((r = i.showName) == null ? void 0 : r.substring(2)), i.plateColor) {
-          case 1:
-            n = "blue", o = "#ffffff";
-            break;
-          case 2:
-            n = "yellow", o = "#000000";
-            break;
-          case 3:
-            n = "white", o = "#000000";
-            break;
-          case 4:
-            n = "black";
-            break;
-          case 5:
-            n = "neo_yellow", o = "#000000";
-            break;
-          case 6:
-            n = "neo_green", o = "#000000";
-            break;
-          default:
-            n = "grey", l = i.plateNo, o = "#ffffff";
-            break;
-        }
-    else
-      this.currentSpriteContent === d.Id && (n = "grey", l = i.ptcId, o = "#ffffff");
-    s.src = `${this.assetsRoot}/Images/PlateBG/${n}.png`, s.onload = () => {
-      const c = this.createCanvas(s, l, o);
-      if (!c)
-        return;
-      const p = new a.CanvasTexture(c), m = new a.SpriteMaterial({
-        map: p
-      }), f = new a.Sprite(m), M = 0.05, u = c.width * M, v = c.height * M;
-      f.scale.set(u, v, 1), f.name = "VehiclePlate", e(f);
-    };
-  }
-}
-export {
-  k as default
-};

package/lib/src/gis-map/utils/holo-flow/trace-renderer-webgl.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const w=require("@arcgis/core/geometry/SpatialReference"),R=require("@arcgis/core/views/3d/externalRenderers"),P=require("three"),S=require("three/examples/jsm/loaders/GLTFLoader.js"),d=require("../../../types/index.js"),T=require("../../stores/index.js");function v(u){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const e in u)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(u,e);Object.defineProperty(i,e,t.get?t:{enumerable:!0,get:()=>u[e]})}}return i.default=u,Object.freeze(i)}const g=v(R),o=v(P);class C{constructor(i){this.defaultMaterial=new o.MeshBasicMaterial({color:6908265}),this.materialMap=new Map([[1,new o.MeshBasicMaterial({color:16777215})],[2,new o.MeshBasicMaterial({color:7833753})],[3,new o.MeshBasicMaterial({color:16766720})],[4,new o.MeshBasicMaterial({color:16758465})],[5,new o.MeshBasicMaterial({color:14423100})],[6,new o.MeshBasicMaterial({color:3329330})],[7,new o.MeshBasicMaterial({color:2003183})],[8,new o.MeshBasicMaterial({color:16032864})],[9,new o.MeshBasicMaterial({color:2105376})],[10,new o.MeshBasicMaterial({color:9662683})],[99,new o.MeshBasicMaterial({color:6908265})]]),this.carModelReady=!1,this.vanModelReady=!1,this.truckModelReady=!1,this.busModelReady=!1,this.bicycleModelReady=!1,this.currentSpriteContent=d.EVehiclePlateState.None,this.historyPositionMap=new Map,this.vehicleObjectMap=new Map,this.needInterpolate=!0,this.lastRenderTime=Date.now();const e=T.default.useAppDataStore;this.assetsRoot=JSON.parse(JSON.stringify(e.mapConfig)).assetsRoot,this.view=i;const t=new S.GLTFLoader;t.load(`${this.assetsRoot}/3DModels/car.glb`,s=>{this.carModel=s.scene,this.carModel.rotation.x=o.MathUtils.degToRad(90),this.carModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/van.glb`,s=>{this.vanModel=s.scene,this.vanModel.rotation.x=o.MathUtils.degToRad(90),this.vanModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/truck.glb`,s=>{this.truckModel=s.scene,this.truckModel.scale.set(1.2,1,1.5),this.truckModel.rotation.x=o.MathUtils.degToRad(90),this.truckModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/bus.glb`,s=>{this.busModel=s.scene,this.busModel.rotation.x=o.MathUtils.degToRad(90),this.busModelReady=!0}),t.load(`${this.assetsRoot}/3DModels/bicycle.glb`,s=>{this.bicycleModel=s.scene,this.bicycleModel.rotation.x=o.MathUtils.degToRad(90),this.bicycleModel.rotation.y=o.MathUtils.degToRad(180),this.bicycleModelReady=!0}),document.addEventListener("visibilitychange",()=>{this.clearVehicles(),this.needInterpolate=!document.hidden},!1)}setInterpolate(i){this.clearVehicles(),this.needInterpolate=i}async setup(i){this.context=i,this.renderer=new o.WebGLRenderer({context:i.gl,premultipliedAlpha:!1,antialias:!0,powerPreference:"high-performance"}),this.renderer.setPixelRatio(window.devicePixelRatio),this.renderer.setViewport(0,0,this.view.width,this.view.height),this.renderer.autoClearDepth=!1,this.renderer.autoClearStencil=!1,this.renderer.autoClearColor=!1;const e=this.renderer.setRenderTarget.bind(this.renderer);this.renderer.setRenderTarget=t=>{e(t),t==null&&i.bindRenderTarget()},this.scene=new o.Scene,this.camera=new o.PerspectiveCamera,this.ambient=new o.AmbientLight(16777215,.5),this.scene.add(this.ambient),this.sun=new o.DirectionalLight(16777215,.5),this.scene.add(this.sun),i.resetWebGLState()}async render(i){var n;const e=Date.now();this.lastRenderTime=e;const t=i.camera;if(this.camera.position.set(t.eye[0],t.eye[1],t.eye[2]),this.camera.up.set(t.up[0],t.up[1],t.up[2]),this.camera.lookAt(new o.Vector3(t.center[0],t.center[1],t.center[2])),this.camera.projectionMatrix.fromArray(t.projectionMatrix),this.needInterpolate)for(const r of this.vehicleObjectMap.keys()){const a=(n=this.vehicleObjectMap.get(r))==null?void 0:n.model;if(!a)continue;const c=this.computeVehiclePosition(r);if(c){const l=this.toRenderCoordinates(c);a.position.set(l[0],l[1],l[2]),a.rotation.y=o.MathUtils.degToRad(-c[3])}}const s=i.sunLight;this.sun.position.set(s.direction[0],s.direction[1],s.direction[2]),this.sun.intensity=s.diffuse.intensity,this.sun.color=new o.Color(s.diffuse.color[0],s.diffuse.color[1],s.diffuse.color[2]),this.ambient.intensity=s.ambient.intensity,this.ambient.color=new o.Color(s.ambient.color[0],s.ambient.color[1],s.ambient.color[2]),this.renderer.resetState(),i.bindRenderTarget(),this.renderer.render(this.scene,this.camera),g.requestRender(this.view),i.resetWebGLState()}addVehicles(i){!this.carModelReady||!this.vanModelReady||!this.truckModelReady||!this.busModelReady||!this.bicycleModelReady||i.forEach(e=>{const{vehicleId:t,localTimestamp:s}=e,n=Number(e.x),r=Number(e.y),a=Number(e.heading);this.historyPositionMap.set(t,[{pos:[n,r,0],heading:a,time:s}]);const c=this.getVehicleModel(e);c.name=t,c.visible=!this.needInterpolate,this.createPlateSprite(e,l=>{c.add(l),l.position.set(0,5,-4)}),this.scene.add(c),this.vehicleObjectMap.set(t,{model:c,data:e,waitForDelete:!1,isMoving:!1})})}updateVehicles(i){if(!this.carModelReady||!this.vanModelReady||!this.truckModelReady||!this.busModelReady||!this.bicycleModelReady)return;const e=[];i.forEach(t=>{const{vehicleId:s,localTimestamp:n}=t,r=Number(t.x),a=Number(t.y);let c=Number(t.heading);const l=this.vehicleObjectMap.get(s);if(!l)e.push(t);else{if((l.data.vehicleColor!==t.vehicleColor||l.data.vehicleType!==t.vehicleType)&&(this.scene.remove(l.model),this.disposeModel(l.model),l.model=this.getVehicleModel(t),this.scene.add(l.model)),l.data.showName!==t.showName||l.data.plateColor!==t.plateColor){const h=l.model.getObjectByName("VehiclePlate");h&&(l.model.remove(h),this.disposeModel(h)),this.createPlateSprite(t,p=>{l.model.add(p),p.position.set(0,5,-4)})}if(l.data=t,this.needInterpolate){const h=this.historyPositionMap.get(s),p=h[h.length-1];Math.abs(c-p.heading)>=180&&(c>p.heading?p.heading+=360:c+=360),h.push({pos:[r,a,0],heading:c,time:n})}else{this.historyPositionMap.set(s,[{pos:[r,a,0],heading:c,time:n}]);const h=this.toRenderCoordinates([r,a,0]);l.model.position.set(h[0],h[1],h[2]),l.model.rotation.y=o.MathUtils.degToRad(-c)}}}),this.addVehicles(e),this.needInterpolate||this.render(this.context)}toRenderCoordinates(i){const e=[0,0,0];return g.toRenderCoordinates(this.view,i,0,w.WGS84,e,0,1),e}deleteVehicles(i){i.forEach(e=>{const t=this.vehicleObjectMap.get(e);t&&(this.needInterpolate?t.isMoving?t.waitForDelete=!0:this.deleteVehicle(t):this.deleteVehicle(t))})}deleteVehicle(i){this.scene.remove(i.model),this.disposeModel(i.model);const e=i.data.vehicleId;this.vehicleObjectMap.delete(e),this.historyPositionMap.delete(e)}toggleTrafficInfo(i){i.name==="vehiclePlate"&&(i.visible===!0&&this.currentSpriteContent===d.EVehiclePlateState.None?this.updatePanelContent(d.EVehiclePlateState.Id):this.updatePanelContent(i.visible?this.currentSpriteContent:d.EVehiclePlateState.None))}clearVehicles(){for(const i of this.vehicleObjectMap.keys()){const e=this.vehicleObjectMap.get(i);e&&(this.disposeModel(e.model),this.scene.remove(e.model))}this.vehicleObjectMap.clear(),this.historyPositionMap.clear()}updatePanelContent(i){if(i!==this.currentSpriteContent){this.currentSpriteContent=i;for(const e of this.vehicleObjectMap.keys()){const t=this.vehicleObjectMap.get(e);if(t){const s=t.model.getObjectByName("VehiclePlate");s&&(t.model.remove(s),this.disposeModel(s)),i!==d.EVehiclePlateState.None&&this.createPlateSprite(t.data,n=>{t.model.add(n),n.position.set(0,5,-4)})}}}}toggleGroundVehicle(i){}toggleElevatedVehicle(i){}disposeModel(i){i.traverse(e=>{e instanceof o.Mesh&&(e.geometry.dispose(),e.material.dispose())})}computeVehiclePosition(i){const e=this.historyPositionMap.get(i),t=this.vehicleObjectMap.get(i);if(!t||!e||!t.isMoving&&e.length<=2)return;const s=Date.now();t.model.visible=!0,t.isMoving=!0,t.segmentStartTime||(t.segmentStartTime=s,t.segmentTotalTime=e[1].time-e[0].time);const n=s-t.segmentStartTime,r=Math.min(n/t.segmentTotalTime,1);if(r===1)if(e.shift(),e.length===1){t.waitForDelete===!0?(this.deleteVehicle(t),console.log("delete vehicle",i)):(t.segmentStartTime=void 0,t.segmentTotalTime=void 0,t.model.visible=!1,t.isMoving=!1,console.log("pause vehicle",i));return}else return t.segmentStartTime=Date.now(),t.segmentTotalTime=e[1].time-e[0].time,(e[1].heading>=270&&e[0].heading<=90||e[1].heading<=90&&e[0].heading>=270)&&(e[1].heading>e[0].heading?e[0].heading+=360:e[1].heading+=360),e[0].pos.concat(e[0].heading);else{const a=e[0].pos[0]+(e[1].pos[0]-e[0].pos[0])*r,c=e[0].pos[1]+(e[1].pos[1]-e[0].pos[1])*r,l=e[0].heading+(e[1].heading-e[0].heading)*r;return[a,c,0,l]}}getVehicleModel(i){let e;if(i.ptcType===2)e=this.bicycleModel.clone();else{switch(i.vehicleType){case 10:e=this.carModel.clone();break;case 20:e=this.vanModel.clone();break;case 25:e=this.truckModel.clone();break;case 50:e=this.busModel.clone();break;default:e=this.carModel.clone();break}const t=this.materialMap.get(i.vehicleColor)||this.defaultMaterial;let s=!1;e.traverse(n=>{!s&&n instanceof o.Mesh&&(n.material=t,s=!0)})}return e}createCanvas(i,e,t){const s=document.createElement("canvas"),n=i.width,r=i.height;s.width=n,s.height=r;const a=s.getContext("2d");if(!a){console.log("canvas创建失败");return}return a.fillStyle="rgba(0,0,0,0.0)",a.fillRect(0,0,n,r),a.drawImage(i,0,0,n,r),a.beginPath(),a.translate(n/2,r/2),a.fillStyle=t,a.font="bold 32px 宋体",a.textBaseline="middle",a.textAlign="center",a.fillText(e,0,0),s}createPlateSprite(i,e){var c,l;const t=!i.plateNo||i.plateNo==="0"||i.plateNo==="000000";if(this.currentSpriteContent===d.EVehiclePlateState.None||this.currentSpriteContent===d.EVehiclePlateState.PlateNumber&&t)return;const s=new Image;let n="",r="",a="";if(this.currentSpriteContent===d.EVehiclePlateState.PlateNumber||this.currentSpriteContent===d.EVehiclePlateState.Mix)if(t)n="grey",r=i.ptcId,a="#ffffff";else switch(r=((c=i.showName)==null?void 0:c.substring(0,2))+"•"+((l=i.showName)==null?void 0:l.substring(2)),i.plateColor){case 1:n="blue",a="#ffffff";break;case 2:n="yellow",a="#000000";break;case 3:n="white",a="#000000";break;case 4:n="black";break;case 5:n="neo_yellow",a="#000000";break;case 6:n="neo_green",a="#000000";break;default:n="grey",r=i.plateNo,a="#ffffff";break}else this.currentSpriteContent===d.EVehiclePlateState.Id&&(n="grey",r=i.ptcId,a="#ffffff");s.src=`${this.assetsRoot}/Images/PlateBG/${n}.png`,s.onload=()=>{const h=this.createCanvas(s,r,a);if(!h)return;const p=new o.CanvasTexture(h),M=new o.SpriteMaterial({map:p}),f=new o.Sprite(M),m=.05,b=h.width*m,y=h.height*m;f.scale.set(b,y,1),f.name="VehiclePlate",e(f)}}}exports.default=C;