gisviewer-vue3-arcgis 1.0.136 → 1.0.138

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

@@ -1,14 +1,14 @@
-import * as P from "@arcgis/core/core/promiseUtils.js";
-import * as b from "@arcgis/core/core/reactiveUtils.js";
+import * as M from "@arcgis/core/core/promiseUtils.js";
+import * as P from "@arcgis/core/core/reactiveUtils.js";
 import v from "@arcgis/core/geometry/SpatialReference";
 import * as u from "@arcgis/core/views/3d/externalRenderers";
-import * as l from "three";
+import * as a from "three";
 import { GLTFLoader as y } from "three/examples/jsm/loaders/GLTFLoader";
 import { EVehiclePlateState as m } from "../../../types/index.mjs";
 import T from "../../stores/index.mjs";
-class I {
-  constructor(i) {
-    this.cameraHeightThreshold = 1e3, this.roughness = 0.2, this.metalness = 0.8, this.defaultMaterial = new l.MeshPhongMaterial({
+class R {
+  constructor(s) {
+    this.cameraHeightThreshold = 1e3, this.roughness = 0.2, this.metalness = 0.8, this.defaultMaterial = new a.MeshPhongMaterial({
       color: 16777215
     }), this.materialMap = /* @__PURE__ */ new Map([
       [1, this.createCarMaterial(16777215)],
@@ -45,7 +45,7 @@ class I {
       ]
     ], this.assetsRoot = JSON.parse(
       JSON.stringify(this.appDataStore.mapConfig)
-    ).assetsRoot, this.view = i, b.watch(
+    ).assetsRoot, this.view = s, P.watch(
       () => this.view.camera.position.z,
       (e, t) => {
         (t <= this.cameraHeightThreshold && e > this.cameraHeightThreshold || t > this.cameraHeightThreshold && e <= this.cameraHeightThreshold) && (this.updateModel = !0);
@@ -53,9 +53,9 @@ class I {
     );
   }
   // private readonly vehiclePool = new VehiclePool();
-  createCarMaterial(i) {
-    return new l.MeshPhongMaterial({
-      color: i
+  createCarMaterial(s) {
+    return new a.MeshPhongMaterial({
+      color: s
       // // emissive: 0xc3c3c3,
       // roughness: this.roughness,
       // metalness: this.metalness
@@ -65,31 +65,37 @@ class I {
     return this.logTable;
   }
   async init() {
-    const i = new y();
-    await P.eachAlways([
+    const s = new y();
+    await M.eachAlways([
       new Promise((e) => {
-        i.load(`${this.assetsRoot}/3DModels/car.glb`, (t) => {
-          this.carModel = t.scene, this.carModel.rotation.x = l.MathUtils.degToRad(90), e();
+        s.load(`${this.assetsRoot}/3DModels/car.glb`, (t) => {
+          const i = t.scene, n = new a.Box3().setFromObject(i).getSize(new a.Vector3());
+          this.carModel = new a.Object3D(), this.carModel.rotation.x = a.MathUtils.degToRad(90), this.carModel.add(i), i.position.set(0, 0, n.z / 2), e();
         });
       }),
       new Promise((e) => {
-        i.load(`${this.assetsRoot}/3DModels/van.glb`, (t) => {
-          this.vanModel = t.scene, this.vanModel.rotation.x = l.MathUtils.degToRad(90), e();
+        s.load(`${this.assetsRoot}/3DModels/van.glb`, (t) => {
+          const i = t.scene, n = new a.Box3().setFromObject(i).getSize(new a.Vector3());
+          this.vanModel = new a.Object3D(), this.vanModel.rotation.x = a.MathUtils.degToRad(90), this.vanModel.add(i), i.position.set(0, 0, n.z / 2), e();
         });
       }),
       new Promise((e) => {
-        i.load(`${this.assetsRoot}/3DModels/truck.glb`, (t) => {
-          this.truckModel = t.scene, this.truckModel.scale.set(1.2, 1, 1.5), this.truckModel.rotation.x = l.MathUtils.degToRad(90), e();
+        s.load(`${this.assetsRoot}/3DModels/truck.glb`, (t) => {
+          const i = t.scene;
+          i.scale.set(1.2, 1, 1.5);
+          const n = new a.Box3().setFromObject(i).getSize(new a.Vector3());
+          this.truckModel = new a.Object3D(), this.truckModel.rotation.x = a.MathUtils.degToRad(90), this.truckModel.add(i), i.position.set(0, 0, n.z / 2), e();
         });
       }),
       new Promise((e) => {
-        i.load(`${this.assetsRoot}/3DModels/bus.glb`, (t) => {
-          this.busModel = t.scene, this.busModel.rotation.x = l.MathUtils.degToRad(90), e();
+        s.load(`${this.assetsRoot}/3DModels/bus.glb`, (t) => {
+          const i = t.scene, n = new a.Box3().setFromObject(i).getSize(new a.Vector3());
+          this.busModel = new a.Object3D(), this.busModel.rotation.x = a.MathUtils.degToRad(90), this.busModel.add(i), i.position.set(0, 0, n.z / 2), e();
         });
       }),
       new Promise((e) => {
-        i.load(`${this.assetsRoot}/3DModels/bicycle.glb`, (t) => {
-          this.bicycleModel = t.scene, this.bicycleModel.rotation.x = l.MathUtils.degToRad(90), this.bicycleModel.rotation.y = l.MathUtils.degToRad(180), e();
+        s.load(`${this.assetsRoot}/3DModels/bicycle.glb`, (t) => {
+          this.bicycleModel = t.scene, this.bicycleModel.rotation.x = a.MathUtils.degToRad(90), this.bicycleModel.rotation.y = a.MathUtils.degToRad(180), e();
         });
       }),
       new Promise((e) => {
@@ -129,12 +135,12 @@ class I {
       })
     ]), this.isInitialized = !0;
   }
-  setInterpolate(i) {
-    this.clearVehicles(), this.needInterpolate = i;
+  setInterpolate(s) {
+    this.clearVehicles(), this.needInterpolate = s;
   }
-  async setup(i) {
-    this.context = i, this.renderer = new l.WebGLRenderer({
-      context: i.gl,
+  async setup(s) {
+    this.context = s, this.renderer = new a.WebGLRenderer({
+      context: s.gl,
       premultipliedAlpha: !0,
       logarithmicDepthBuffer: !0,
       antialias: !0,
@@ -143,52 +149,52 @@ class I {
     const e = this.renderer.setRenderTarget.bind(
       this.renderer
     );
-    this.renderer.setRenderTarget = (s) => {
-      e(s), s == null && i.bindRenderTarget();
-    }, this.scene = new l.Scene();
-    const { camera: t } = i;
-    this.camera = new l.PerspectiveCamera(
+    this.renderer.setRenderTarget = (i) => {
+      e(i), i == null && s.bindRenderTarget();
+    }, this.scene = new a.Scene();
+    const { camera: t } = s;
+    this.camera = new a.PerspectiveCamera(
       t.fovY,
       t.aspect,
       0.1,
       1e5
-    ), this.ambient = new l.AmbientLight(16777215, 2), this.scene.add(this.ambient), this.sun = new l.DirectionalLight(16777215, 2), this.scene.add(this.sun), i.resetWebGLState();
+    ), this.ambient = new a.AmbientLight(16777215, 2), this.scene.add(this.ambient), this.sun = new a.DirectionalLight(16777215, 2), this.scene.add(this.sun), s.resetWebGLState();
   }
-  async render(i) {
-    var s;
-    const e = i.camera;
+  async render(s) {
+    var i;
+    const e = s.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 l.Vector3(e.center[0], e.center[1], e.center[2])
+      new a.Vector3(e.center[0], e.center[1], e.center[2])
     ), this.camera.projectionMatrix.fromArray(e.projectionMatrix), !this.isPaused && this.needInterpolate)
-      for (const a of this.vehicleObjectMap.keys()) {
-        const n = (s = this.vehicleObjectMap.get(a)) == null ? void 0 : s.model;
+      for (const o of this.vehicleObjectMap.keys()) {
+        const n = (i = this.vehicleObjectMap.get(o)) == null ? void 0 : i.model;
         if (!n)
           continue;
-        const o = this.computeVehiclePosition(a);
-        if (o) {
-          const d = this.toRenderCoordinates(o);
-          n.position.set(d[0], d[1], d[2]), n.rotation.y = l.MathUtils.degToRad(-o[3]);
+        const r = this.computeVehiclePosition(o);
+        if (r) {
+          const d = this.toRenderCoordinates(r);
+          n.position.set(d[0], d[1], d[2]), n.rotation.y = a.MathUtils.degToRad(-r[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 l.Color(
+    const t = s.sunLight;
+    this.sun.position.set(t.direction[0], t.direction[1], t.direction[2]), this.sun.intensity = t.diffuse.intensity, this.sun.color = new a.Color(
       t.diffuse.color[0],
       t.diffuse.color[1],
       t.diffuse.color[2]
-    ), this.ambient.intensity = t.ambient.intensity, this.ambient.color = new l.Color(
+    ), this.ambient.intensity = t.ambient.intensity, this.ambient.color = new a.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), u.requestRender(this.view), i.resetWebGLState();
+    ), this.renderer.resetState(), s.bindRenderTarget(), this.renderer.render(this.scene, this.camera), u.requestRender(this.view), s.resetWebGLState();
   }
   /**
    * 新增车辆
    * */
-  async addVehicles(i) {
+  async addVehicles(s) {
     if (this.isPaused || !this.isInitialized)
       return;
     const e = Date.now();
-    for (const t of i) {
+    for (const t of s) {
       this.appDataStore.saveTrackLog && this.logTable.push([
         t.ptcId,
         t.plateNo,
@@ -209,19 +215,19 @@ class I {
         0,
         0
       ]);
-      const { vehicleId: s, localTimestamp: a } = t, n = Number(t.x), o = Number(t.y), d = Number(t.heading);
-      this.historyPositionMap.set(s, [
-        { pos: [n, o, 0], heading: d, time: a }
+      const { vehicleId: i, localTimestamp: o } = t, n = Number(t.x), r = Number(t.y), d = Number(t.heading);
+      this.historyPositionMap.set(i, [
+        { pos: [n, r, 0], heading: d, time: o }
       ]);
       const h = this.getVehicleModel(t);
-      h.name = s, h.visible = !1;
+      h.name = i, h.visible = !1;
       try {
-        const r = await this.createPlateSprite(t);
-        r && (h.add(r), r.position.set(0, 5, -4));
-      } catch (r) {
-        console.log("createPlateSprite error:", r);
+        const l = await this.createPlateSprite(t);
+        l && (h.add(l), l.position.set(0, 5, -4));
+      } catch (l) {
+        console.log("createPlateSprite error:", l);
       }
-      this.scene.add(h), this.vehicleObjectMap.set(s, {
+      this.scene.add(h), this.vehicleObjectMap.set(i, {
         model: h,
         data: t,
         waitForDelete: !1,
@@ -232,73 +238,73 @@ class I {
   /**
    * 更新车辆
    * */
-  async updateVehicles(i) {
+  async updateVehicles(s) {
     if (this.isPaused || !this.isInitialized)
       return;
     const e = [], t = Date.now();
-    for (const s of i) {
-      const { vehicleId: a, localTimestamp: n } = s, o = Number(s.x), d = Number(s.y);
-      let h = Number(s.heading);
-      const r = this.vehicleObjectMap.get(a), p = this.historyPositionMap.get(
-        a
+    for (const i of s) {
+      const { vehicleId: o, localTimestamp: n } = i, r = Number(i.x), d = Number(i.y);
+      let h = Number(i.heading);
+      const l = this.vehicleObjectMap.get(o), p = this.historyPositionMap.get(
+        o
       );
-      if (!r || !p)
-        e.push(s);
+      if (!l || !p)
+        e.push(i);
       else {
         if (this.appDataStore.saveTrackLog && this.logTable.push([
-          s.ptcId,
-          s.plateNo,
-          s.timestamp,
-          s.localTimestamp,
-          s.speed,
-          s.x,
-          s.y,
-          s.ptcType,
-          s.vehicleType,
-          s.vehicleColor,
-          s.plateColor,
-          s.heading,
-          s.fixAngle,
-          s.roadLayer,
-          s.step,
+          i.ptcId,
+          i.plateNo,
+          i.timestamp,
+          i.localTimestamp,
+          i.speed,
+          i.x,
+          i.y,
+          i.ptcType,
+          i.vehicleType,
+          i.vehicleColor,
+          i.plateColor,
+          i.heading,
+          i.fixAngle,
+          i.roadLayer,
+          i.step,
           t,
           p.length,
           1
-        ]), this.updateModel || r.data.vehicleColor !== s.vehicleColor || r.data.vehicleType !== s.vehicleType) {
-          this.scene.remove(r.model), this.disposeModel(r.model), r.model = this.getVehicleModel(s), r.model.visible = !0;
-          const c = await this.createPlateSprite(s);
-          c && (r.model.add(c), c.position.set(0, 5, -4)), this.scene.add(r.model);
+        ]), this.updateModel || l.data.vehicleColor !== i.vehicleColor || l.data.vehicleType !== i.vehicleType) {
+          this.scene.remove(l.model), this.disposeModel(l.model), l.model = this.getVehicleModel(i), l.model.visible = !0;
+          const c = await this.createPlateSprite(i);
+          c && (l.model.add(c), c.position.set(0, 5, -4)), this.scene.add(l.model);
         }
-        if (r.data.showName !== s.showName || r.data.plateColor !== s.plateColor) {
-          const c = r.model.getObjectByName("VehiclePlate");
-          c && (r.model.remove(c), this.disposeModel(c));
-          const g = await this.createPlateSprite(s);
-          g && (r.model.add(g), g.position.set(0, 5, -4));
+        if (l.data.showName !== i.showName || l.data.plateColor !== i.plateColor) {
+          const c = l.model.getObjectByName("VehiclePlate");
+          c && (l.model.remove(c), this.disposeModel(c));
+          const g = await this.createPlateSprite(i);
+          g && (l.model.add(g), g.position.set(0, 5, -4));
         }
-        if (r.data = s, this.needInterpolate) {
+        if (l.data = i, this.needInterpolate) {
           const c = p[p.length - 1];
           Math.abs(h - c.heading) >= 180 && (h > c.heading ? c.heading += 360 : h += 360), p.push({
-            pos: [o, d, 0],
+            pos: [r, d, 0],
             heading: h,
             time: n
           });
         } else {
-          this.historyPositionMap.set(a, [
-            { pos: [o, d, 0], heading: h, time: n }
+          this.historyPositionMap.set(o, [
+            { pos: [r, d, 0], heading: h, time: n }
           ]);
-          const c = this.toRenderCoordinates([o, d, 0]);
-          r.model.position.set(c[0], c[1], c[2]), r.model.rotation.y = l.MathUtils.degToRad(-h);
+          const c = this.toRenderCoordinates([r, d, 0]);
+          l.model.position.set(c[0], c[1], c[2]), l.model.rotation.y = a.MathUtils.degToRad(-h);
         }
       }
     }
     await this.addVehicles(e), this.updateModel = !1, this.needInterpolate || this.render(this.context);
   }
-  toRenderCoordinates(i) {
+  toRenderCoordinates(s) {
     const e = [0, 0, 0];
     return u.toRenderCoordinates(
       // @ts-ignore
       this.view,
-      i,
+      s,
       0,
       v.WGS84,
       e,
@@ -309,13 +315,13 @@ class I {
   /**
    * 删除车辆
    * */
-  deleteVehicles(i) {
+  deleteVehicles(s) {
     if (this.isPaused)
       return;
     const e = Date.now();
-    i.forEach((t) => {
+    s.forEach((t) => {
       if (this.appDataStore.saveTrackLog) {
-        const a = this.historyPositionMap.get(t);
+        const o = this.historyPositionMap.get(t);
         this.logTable.push([
           t,
           "",
@@ -333,33 +339,33 @@ class I {
           "",
           "",
           e,
-          a ? a.length : 0,
+          o ? o.length : 0,
           2
         ]);
       }
-      const s = this.vehicleObjectMap.get(t);
-      s && (this.needInterpolate ? s.isMoving ? s.waitForDelete = !0 : this.deleteVehicle(s) : this.deleteVehicle(s));
+      const i = this.vehicleObjectMap.get(t);
+      i && (this.needInterpolate ? i.isMoving ? i.waitForDelete = !0 : this.deleteVehicle(i) : this.deleteVehicle(i));
     });
   }
-  deleteVehicle(i) {
-    this.scene.remove(i.model), this.disposeModel(i.model);
-    const e = i.data.vehicleId;
+  deleteVehicle(s) {
+    this.scene.remove(s.model), this.disposeModel(s.model);
+    const e = s.data.vehicleId;
     this.vehicleObjectMap.delete(e), this.historyPositionMap.delete(e);
   }
-  async toggleTrafficInfo(i) {
-    i.name === "vehiclePlate" && (i.visible === !0 && this.currentSpriteContent === m.None ? await this.updatePanelContent(m.PlateNumber) : await this.updatePanelContent(
-      i.visible ? this.currentSpriteContent : m.None
+  async toggleTrafficInfo(s) {
+    s.name === "vehiclePlate" && (s.visible === !0 && this.currentSpriteContent === m.None ? await this.updatePanelContent(m.PlateNumber) : await this.updatePanelContent(
+      s.visible ? this.currentSpriteContent : m.None
     ));
   }
-  togglePause(i) {
-    this.isPaused = i;
+  togglePause(s) {
+    this.isPaused = s;
   }
   /**
    * 清除全部车辆
    * */
   clearVehicles() {
-    for (const i of this.vehicleObjectMap.keys()) {
-      const e = this.vehicleObjectMap.get(i);
+    for (const s of this.vehicleObjectMap.keys()) {
+      const e = this.vehicleObjectMap.get(s);
       e && (this.scene.remove(e.model), this.disposeModel(e.model));
     }
     this.vehicleObjectMap.clear(), this.historyPositionMap.clear();
@@ -369,81 +375,81 @@ class I {
    * @param contentType
    * @returns
    */
-  async updatePanelContent(i) {
-    if (i !== this.currentSpriteContent) {
-      this.currentSpriteContent = i;
+  async updatePanelContent(s) {
+    if (s !== this.currentSpriteContent) {
+      this.currentSpriteContent = s;
       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 !== m.None) {
-            const a = await this.createPlateSprite(t.data);
-            a && (t.model.add(a), a.position.set(0, 5, -4));
+          const i = t.model.getObjectByName("VehiclePlate");
+          if (i && (t.model.remove(i), this.disposeModel(i)), s !== m.None) {
+            const o = await this.createPlateSprite(t.data);
+            o && (t.model.add(o), o.position.set(0, 5, -4));
           }
         }
       }
     }
   }
-  toggleGroundVehicle(i) {
-    console.log("toggleGroundVehicle", i), this.showGroundVehicle = i;
+  toggleGroundVehicle(s) {
+    console.log("toggleGroundVehicle", s), this.showGroundVehicle = s;
   }
-  toggleElevatedVehicle(i) {
-    this.showElevatedVehicle = i;
+  toggleElevatedVehicle(s) {
+    this.showElevatedVehicle = s;
   }
   /**
    * 释放模型资源
    * */
-  disposeModel(i) {
-    i.traverse((e) => {
-      e instanceof l.Mesh && (e.geometry.dispose(), e.material.dispose());
+  disposeModel(s) {
+    s.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);
+  computeVehiclePosition(s) {
+    const e = this.historyPositionMap.get(s), t = this.vehicleObjectMap.get(s);
     if (!t || !e || !t.isMoving && e.length <= 2)
       return;
-    const s = Date.now();
-    t.isMoving = !0, t.data.roadLayer === "1" ? t.model.visible = this.showGroundVehicle : t.model.visible = this.showElevatedVehicle, t.segmentStartTime || (t.segmentStartTime = s, t.segmentTotalTime = e[1].time - e[0].time);
-    const a = s - t.segmentStartTime, n = Math.min(
-      a / t.segmentTotalTime,
+    const i = Date.now();
+    t.isMoving = !0, t.data.roadLayer === "1" ? t.model.visible = this.showGroundVehicle : t.model.visible = this.showElevatedVehicle, t.segmentStartTime || (t.segmentStartTime = i, t.segmentTotalTime = e[1].time - e[0].time);
+    const o = i - t.segmentStartTime, n = Math.min(
+      o / t.segmentTotalTime,
       1
     );
     if (n === 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("hide vehicle", i));
+        t.waitForDelete === !0 ? this.deleteVehicle(t) : (t.segmentStartTime = void 0, t.segmentTotalTime = void 0, t.model.visible = !1, t.isMoving = !1, console.log("hide vehicle", s));
         return;
       } else {
         t.segmentStartTime = Date.now();
-        const o = a - t.segmentTotalTime;
-        return t.segmentTotalTime = e[1].time - e[0].time - o, (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);
+        const r = o - t.segmentTotalTime;
+        return t.segmentTotalTime = e[1].time - e[0].time - r, (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 if (e.length >= 2) {
-      const o = e[0].pos[0] + (e[1].pos[0] - e[0].pos[0]) * n, d = e[0].pos[1] + (e[1].pos[1] - e[0].pos[1]) * n, h = e[0].heading + (e[1].heading - e[0].heading) * n;
-      return [o, d, 0, h];
+      const r = e[0].pos[0] + (e[1].pos[0] - e[0].pos[0]) * n, d = e[0].pos[1] + (e[1].pos[1] - e[0].pos[1]) * n, h = e[0].heading + (e[1].heading - e[0].heading) * n;
+      return [r, d, 0, h];
     } else
       return;
   }
   /**
    * 根据车辆类型、车身颜色获取模型
    * */
-  getVehicleModel(i) {
+  getVehicleModel(s) {
     if (this.view.camera.position.z >= this.cameraHeightThreshold) {
-      const e = new l.SphereGeometry(5, 32, 32), t = new l.MeshPhysicalMaterial({
+      const e = new a.SphereGeometry(5, 32, 32), t = new a.MeshPhysicalMaterial({
         color: 325253,
         emissive: 0,
         roughness: this.roughness,
         metalness: this.metalness
       });
-      return new l.Mesh(e, t);
+      return new a.Mesh(e, t);
     } else {
       let e;
-      if (i.ptcType === 2)
+      if (s.ptcType === 2)
         e = this.bicycleModel.clone();
       else {
-        switch (i.vehicleType) {
+        switch (s.vehicleType) {
           case 10:
             e = this.carModel.clone();
             break;
@@ -460,10 +466,10 @@ class I {
             e = this.carModel.clone();
             break;
         }
-        const t = this.materialMap.get(i.vehicleColor) || this.defaultMaterial;
-        let s = !1;
-        e.traverse((a) => {
-          !s && a instanceof l.Mesh && (a.material = t, s = !0);
+        const t = this.materialMap.get(s.vehicleColor) || this.defaultMaterial;
+        let i = !1;
+        e.traverse((o) => {
+          !i && o instanceof a.Mesh && (o.material = t, i = !0);
         });
       }
       return e;
@@ -472,71 +478,71 @@ class I {
   /**
    * 创建号牌canvas
    * */
-  createCanvas(i, e, t) {
-    const s = document.createElement("canvas"), a = i.width, n = i.height;
-    s.width = a, s.height = n;
-    const o = s.getContext("2d");
-    if (!o) {
+  createCanvas(s, e, t) {
+    const i = document.createElement("canvas"), o = s.width, n = s.height;
+    i.width = o, i.height = n;
+    const r = i.getContext("2d");
+    if (!r) {
       console.log("canvas创建失败");
       return;
     }
-    return o.fillStyle = "rgba(0,0,0,0.0)", o.fillRect(0, 0, a, n), o.drawImage(i, 0, 0, a, n), o.beginPath(), o.translate(a / 2, n / 2), o.fillStyle = t, o.font = "bold 32px 宋体", o.textBaseline = "middle", o.textAlign = "center", o.fillText(e, 0, 0), s;
+    return r.fillStyle = "rgba(0,0,0,0.0)", r.fillRect(0, 0, o, n), r.drawImage(s, 0, 0, o, n), r.beginPath(), r.translate(o / 2, n / 2), r.fillStyle = t, r.font = "bold 32px 宋体", r.textBaseline = "middle", r.textAlign = "center", r.fillText(e, 0, 0), i;
   }
-  createPlateSprite(i) {
+  createPlateSprite(s) {
     return new Promise((e, t) => {
-      var h, r;
-      const s = !i.plateNo || i.plateNo === "0" || i.plateNo === "000000";
-      if (this.currentSpriteContent === m.None || this.currentSpriteContent === m.PlateNumber && s) {
+      var h, l;
+      const i = !s.plateNo || s.plateNo === "0" || s.plateNo === "000000";
+      if (this.currentSpriteContent === m.None || this.currentSpriteContent === m.PlateNumber && i) {
         e(void 0);
         return;
       }
-      let a = new Image(), n = "", o = "";
+      let o = new Image(), n = "", r = "";
       if (this.currentSpriteContent === m.PlateNumber || this.currentSpriteContent === m.Mix)
-        if (s)
-          a = this.greyPlateBG, n = i.ptcId, o = "#ffffff";
+        if (i)
+          o = this.greyPlateBG, n = s.ptcId, r = "#ffffff";
         else
-          switch (n = ((h = i.showName) == null ? void 0 : h.substring(0, 2)) + "•" + ((r = i.showName) == null ? void 0 : r.substring(2)), i.plateColor) {
+          switch (n = ((h = s.showName) == null ? void 0 : h.substring(0, 2)) + "•" + ((l = s.showName) == null ? void 0 : l.substring(2)), s.plateColor) {
             case 1:
-              a = this.bluePlateBG, o = "#ffffff";
+              o = this.bluePlateBG, r = "#ffffff";
               break;
             case 2:
-              a = this.yellowPlateBG, o = "#000000";
+              o = this.yellowPlateBG, r = "#000000";
               break;
             case 3:
-              a = this.whitePlateBG, o = "#000000";
+              o = this.whitePlateBG, r = "#000000";
               break;
             case 4:
-              a = this.blackPlateBG, o = "#ffffff";
+              o = this.blackPlateBG, r = "#ffffff";
               break;
             case 5:
-              a = this.neoYellowPlateBG, o = "#000000";
+              o = this.neoYellowPlateBG, r = "#000000";
               break;
             case 6:
-              a = this.neoGreenPlateBG, o = "#000000";
+              o = this.neoGreenPlateBG, r = "#000000";
               break;
             default:
-              a = this.greyPlateBG, n = i.plateNo, o = "#ffffff";
+              o = this.greyPlateBG, n = s.plateNo, r = "#ffffff";
               break;
           }
       else
-        this.currentSpriteContent === m.Id && (a = this.greyPlateBG, n = i.ptcId, o = "#ffffff");
-      const d = this.createCanvas(a, n, o);
+        this.currentSpriteContent === m.Id && (o = this.greyPlateBG, n = s.ptcId, r = "#ffffff");
+      const d = this.createCanvas(o, n, r);
       if (d) {
-        const p = new l.CanvasTexture(d), c = new l.SpriteMaterial({
+        const p = new a.CanvasTexture(d), c = new a.SpriteMaterial({
           map: p,
           transparent: !1
-        }), g = new l.Sprite(c), f = 0.05, w = d.width * f, M = d.height * f;
-        g.scale.set(w, M, 1), g.name = "VehiclePlate", e(g);
+        }), g = new a.Sprite(c), f = 0.05, w = d.width * f, b = d.height * f;
+        g.scale.set(w, b, 1), g.name = "VehiclePlate", e(g);
       } else {
         t("canvas创建失败");
         return;
       }
-      a.onerror = (p) => {
-        console.log(`号牌背景加载失败: ${a.src}`, p), t(p);
+      o.onerror = (p) => {
+        console.log(`号牌背景加载失败: ${o.src}`, p), t(p);
       };
     });
   }
 }
 export {
-  I as default
+  R as default
 };

package/es/src/gis-map/utils/signal-control-area-controller/district-controller.d.ts

@@ -5,6 +5,7 @@ interface ICross {
     latitude: number;
     longitude: number;
     signalId: string;
+    isKey: boolean;
 }
 export default class DistrictController {
     id: string;

package/es/src/gis-map/utils/signal-control-area-controller/district-controller.mjs

@@ -16,7 +16,8 @@ class i {
           parentId: s.parentId,
           latitude: Number(s.latitude),
           longitude: Number(s.longitude),
-          signalId: s.signalId
+          signalId: s.signalId,
+          isKey: s.isKey === 1
         };
         this.crosses.push(o), this.crossCount++;
       }

package/es/src/gis-map/utils/signal-control-area-controller/index.mjs

@@ -1,10 +1,10 @@
-import * as m from "@arcgis/core/core/reactiveUtils.js";
-import n from "@arcgis/core/Graphic";
+import * as g from "@arcgis/core/core/reactiveUtils.js";
+import h from "@arcgis/core/Graphic";
 import a from "@arcgis/core/layers/GraphicsLayer";
-import u from "@turf/buffer";
+import m from "@turf/buffer";
 import d from "@turf/convex";
-import * as c from "@turf/helpers";
-import p from "./district-controller.mjs";
+import * as l from "@turf/helpers";
+import b from "./district-controller.mjs";
 class C {
   constructor(e) {
     this.crossScale = 3e3, this.view = e, this.view.popup.visibleElements = {
@@ -35,48 +35,51 @@ class C {
   showSignalControlArea(e) {
     this.districtControllerLayer.removeAll(), this.subDistrictControllerLayer.removeAll(), this.crossLayer.removeAll(), this.highlightLayer.removeAll(), this.districtControllerLayer.visible = !0, this.subDistrictControllerLayer.visible = !0;
     for (const t of e) {
-      const r = new p(t);
+      const r = new b(t);
       this.drawArea(r, !0);
     }
-    return this.watchHandle = m.watch(
+    return this.watchHandle = g.watch(
       () => this.view.scale,
       (t, r) => {
-        if (t > this.crossScale && r <= this.crossScale)
-          this.crossLayer.graphics.forEach((s) => {
-            s.symbol = {
-              type: "simple-marker",
-              color: s.getAttribute("color"),
-              size: 8,
-              outline: {
-                color: "white",
-                width: 1
-              }
-            };
-          }), this.highlightLayer.graphics.forEach((s) => {
-            s.getAttribute("type") === "cross" && (s.symbol = {
-              type: "simple-marker",
-              color: s.getAttribute("color"),
-              size: 8,
-              outline: {
-                color: "white",
-                width: 1
-              }
-            });
+        t > this.crossScale && r <= this.crossScale ? (this.crossLayer.graphics.forEach((i) => {
+          i.symbol = {
+            type: "simple-marker",
+            style: i.getAttribute("isKey") ? "diamond" : "circle",
+            color: i.getAttribute("color"),
+            size: i.getAttribute("isKey") ? 16 : 8,
+            outline: {
+              color: i.getAttribute("isKey") ? "red" : "white",
+              width: i.getAttribute("isKey") ? 2 : 1
+            }
+          };
+        }), this.highlightLayer.graphics.forEach((i) => {
+          i.getAttribute("type") === "cross" && (i.symbol = {
+            type: "simple-marker",
+            style: i.getAttribute("isKey") ? "diamond" : "circle",
+            color: i.getAttribute("color"),
+            size: i.getAttribute("isKey") ? 16 : 8,
+            outline: {
+              color: i.getAttribute("isKey") ? "red" : "white",
+              width: i.getAttribute("isKey") ? 2 : 1
+            }
           });
-        else if (t <= this.crossScale && r > this.crossScale) {
-          const s = {
+        })) : t <= this.crossScale && r > this.crossScale && (this.crossLayer.graphics.forEach((i) => {
+          i.symbol = {
             type: "picture-marker",
-            url: "/GisViewerAssets/Images/xhj_1.png",
-            width: "37px",
-            height: "57px",
-            yoffset: "25px"
+            url: `/GisViewerAssets/Images/xhj_${i.getAttribute("isKey") ? 4 : 1}.png`,
+            width: i.getAttribute("isKey") ? "55px" : "37px",
+            height: i.getAttribute("isKey") ? "85px" : "57px",
+            yoffset: i.getAttribute("isKey") ? "37px" : "25px"
           };
-          this.crossLayer.graphics.forEach((i) => {
-            i.symbol = s;
-          }), this.highlightLayer.graphics.forEach((i) => {
-            i.getAttribute("type") === "cross" && (i.symbol = s);
+        }), this.highlightLayer.graphics.forEach((i) => {
+          i.getAttribute("type") === "cross" && (i.symbol = {
+            type: "picture-marker",
+            url: `/GisViewerAssets/Images/xhj_${i.getAttribute("isKey") ? 4 : 1}.png`,
+            width: i.getAttribute("isKey") ? "55px" : "37px",
+            height: i.getAttribute("isKey") ? "85px" : "57px",
+            yoffset: i.getAttribute("isKey") ? "37px" : "25px"
           });
-        }
+        }));
       }
     ), { status: 0, message: "ok" };
   }
@@ -101,13 +104,13 @@ class C {
   }
   async highlightSignalControlArea(e) {
     this.highlightLayer.removeAll(), this.districtControllerLayer.visible = !1, this.subDistrictControllerLayer.visible = !1, this.crossLayer.visible = !1;
-    const t = this.districtControllerLayer.graphics.filter((i) => i.getAttribute("id") === e.id).toArray().map((i) => i.clone()), r = this.subDistrictControllerLayer.graphics.filter(
-      (i) => i.getAttribute("id") === e.id || i.getAttribute("parentId") === e.id
-    ).toArray().map((i) => i.clone()), s = this.crossLayer.graphics.filter(
-      (i) => i.getAttribute("id") === e.id || i.getAttribute("districtId") === e.id || i.getAttribute("subDistrictId") === e.id
-    ).toArray().map((i) => i.clone());
-    return t.length > 0 && this.highlightLayer.addMany(t), r.length > 0 && this.highlightLayer.addMany(r), s.length > 0 && this.highlightLayer.addMany(s), this.highlightLayer.graphics.length === 0 ? { status: 1, message: "未找到" } : (t.length > 0 ? await this.view.goTo(t) : r.length > 0 ? await this.view.goTo(r) : s.length > 1 ? await this.view.goTo(s) : await this.view.goTo({
-      target: s[0].geometry,
+    const t = this.districtControllerLayer.graphics.filter((s) => s.getAttribute("id") === e.id).toArray().map((s) => s.clone()), r = this.subDistrictControllerLayer.graphics.filter(
+      (s) => s.getAttribute("id") === e.id || s.getAttribute("parentId") === e.id
+    ).toArray().map((s) => s.clone()), i = this.crossLayer.graphics.filter(
+      (s) => s.getAttribute("id") === e.id || s.getAttribute("districtId") === e.id || s.getAttribute("subDistrictId") === e.id
+    ).toArray().map((s) => s.clone());
+    return t.length > 0 && this.highlightLayer.addMany(t), r.length > 0 && this.highlightLayer.addMany(r), i.length > 0 && this.highlightLayer.addMany(i), this.highlightLayer.graphics.length === 0 ? { status: 1, message: "未找到" } : (t.length > 0 ? await this.view.goTo(t) : r.length > 0 ? await this.view.goTo(r) : i.length > 1 ? await this.view.goTo(i) : await this.view.goTo({
+      target: i[0].geometry,
       scale: 1500
     }), { status: 0, message: "ok" });
   }
@@ -135,14 +138,20 @@ class C {
    */
   drawArea(e, t) {
     const r = e.getAllCrossCoordinates();
-    if (r.length > 2) {
-      const i = c.featureCollection(
-        r.map((y) => c.point(y))
-      ), l = d(i);
-      if (!l)
+    if (r.length >= 2) {
+      let s = null;
+      if (r.length === 2)
+        s = l.lineString(r);
+      else if (r.length > 2) {
+        const u = l.featureCollection(
+          r.map((c) => l.point(c))
+        );
+        s = d(u);
+      }
+      if (!s)
         return;
-      const g = u(
-        l.geometry,
+      const y = m(
+        s.geometry,
         // 区控面积更大，需要更大的缓冲半径
         t ? 200 : 30,
         {
@@ -166,21 +175,17 @@ class C {
       ] : o = [
         {
           fieldName: "parentName",
-          label: "区控名称"
-        },
-        {
-          fieldName: "id",
-          label: "子区编号"
+          label: "所属区控"
         },
         {
           fieldName: "crossCount",
           label: "路口数量"
         }
       ];
-      const h = new n({
+      const n = new h({
         geometry: {
           type: "polygon",
-          rings: g.geometry.coordinates
+          rings: y.geometry.coordinates
         },
         symbol: {
           type: "simple-fill",
@@ -201,7 +206,7 @@ class C {
           subDistrictCount: e.subDistrictCount
         },
         popupTemplate: {
-          title: e.name,
+          title: `${t ? "区控" : "子区"}  ${e.name}`,
           content: [
             {
               type: "fields",
@@ -210,38 +215,40 @@ class C {
           ]
         }
       });
-      t ? this.districtControllerLayer.add(h) : this.subDistrictControllerLayer.add(h);
+      t ? this.districtControllerLayer.add(n) : this.subDistrictControllerLayer.add(n);
     }
-    for (const i of e.subDistricts)
-      this.drawArea(i, !1);
-    const s = e.crosses.map((i) => new n({
+    for (const s of e.subDistricts)
+      this.drawArea(s, !1);
+    const i = e.crosses.map((s) => new h({
       geometry: {
         type: "point",
-        x: i.longitude,
-        y: i.latitude
+        x: s.longitude,
+        y: s.latitude
       },
       symbol: {
         type: "simple-marker",
+        style: s.isKey ? "diamond" : "circle",
         color: e.areaColor,
-        size: 8,
+        size: s.isKey ? 16 : 8,
         outline: {
-          color: "white",
-          width: 1
+          color: s.isKey ? "red" : "white",
+          width: s.isKey ? 2 : 1
         }
       },
       attributes: {
         type: "cross",
-        id: i.id,
-        name: i.name,
+        id: s.id,
+        name: s.name,
         color: e.areaColor,
-        signalId: i.signalId,
+        signalId: s.signalId,
         districtId: t ? e.id : e.parentId,
         districtName: t ? e.name : e.parentName,
         subDistrictId: t ? "" : e.id,
-        subDistrictName: t ? "" : e.name
+        subDistrictName: t ? "" : e.name,
+        isKey: s.isKey
       },
       popupTemplate: {
-        title: i.name,
+        title: s.name,
         content: [
           {
             type: "fields",
@@ -267,7 +274,7 @@ class C {
         ]
       }
     }));
-    this.crossLayer.addMany(s);
+    this.crossLayer.addMany(i);
   }
 }
 export {

package/es/src/types/index.d.ts

@@ -40,7 +40,7 @@ export interface IVehicleTrack {
     step?: number;
 }
 export interface IVehicleRecord {
-    model: Three.Group | Three.Mesh;
+    model: Three.Mesh | Three.Object3D;
     data: IVehicleTrack;
     segmentStartTime?: number;
     segmentTotalTime?: number;

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

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const v=require("@arcgis/core/core/promiseUtils.js"),y=require("@arcgis/core/core/reactiveUtils.js"),T=require("@arcgis/core/geometry/SpatialReference"),S=require("@arcgis/core/views/3d/externalRenderers"),C=require("three"),G=require("three/examples/jsm/loaders/GLTFLoader"),m=require("../../../types/index.js"),B=require("../../stores/index.js");function f(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 R=f(v),I=f(y),M=f(S),l=f(C);class V{constructor(i){this.cameraHeightThreshold=1e3,this.roughness=.2,this.metalness=.8,this.defaultMaterial=new l.MeshPhongMaterial({color:16777215}),this.materialMap=new Map([[1,this.createCarMaterial(16777215)],[2,this.createCarMaterial(7833753)],[3,this.createCarMaterial(16766720)],[4,this.createCarMaterial(16758465)],[5,this.createCarMaterial(14423100)],[6,this.createCarMaterial(3329330)],[7,this.createCarMaterial(2003183)],[8,this.createCarMaterial(16032864)],[9,this.createCarMaterial(2105376)],[10,this.createCarMaterial(9662683)],[99,this.createCarMaterial(6908265)]]),this.isInitialized=!1,this.showGroundVehicle=!0,this.showElevatedVehicle=!0,this.isPaused=!1,this.currentSpriteContent=m.EVehiclePlateState.None,this.historyPositionMap=new Map,this.vehicleObjectMap=new Map,this.needInterpolate=!0,this.updateModel=!1,this.appDataStore=B.default.useAppDataStore,this.logTable=[["ptcId","plateno","timestamp","localTimestamp","speed","longitude","latitude","ptcType","vehicleType","vehicleColor","plateColor","heading","fixAngle","roadLayer","step","receiveTimestamp","queueLength","status"]],this.assetsRoot=JSON.parse(JSON.stringify(this.appDataStore.mapConfig)).assetsRoot,this.view=i,I.watch(()=>this.view.camera.position.z,(e,t)=>{(t<=this.cameraHeightThreshold&&e>this.cameraHeightThreshold||t>this.cameraHeightThreshold&&e<=this.cameraHeightThreshold)&&(this.updateModel=!0)})}createCarMaterial(i){return new l.MeshPhongMaterial({color:i})}getLog(){return this.logTable}async init(){const i=new G.GLTFLoader;await R.eachAlways([new Promise(e=>{i.load(`${this.assetsRoot}/3DModels/car.glb`,t=>{this.carModel=t.scene,this.carModel.rotation.x=l.MathUtils.degToRad(90),e()})}),new Promise(e=>{i.load(`${this.assetsRoot}/3DModels/van.glb`,t=>{this.vanModel=t.scene,this.vanModel.rotation.x=l.MathUtils.degToRad(90),e()})}),new Promise(e=>{i.load(`${this.assetsRoot}/3DModels/truck.glb`,t=>{this.truckModel=t.scene,this.truckModel.scale.set(1.2,1,1.5),this.truckModel.rotation.x=l.MathUtils.degToRad(90),e()})}),new Promise(e=>{i.load(`${this.assetsRoot}/3DModels/bus.glb`,t=>{this.busModel=t.scene,this.busModel.rotation.x=l.MathUtils.degToRad(90),e()})}),new Promise(e=>{i.load(`${this.assetsRoot}/3DModels/bicycle.glb`,t=>{this.bicycleModel=t.scene,this.bicycleModel.rotation.x=l.MathUtils.degToRad(90),this.bicycleModel.rotation.y=l.MathUtils.degToRad(180),e()})}),new Promise(e=>{this.bluePlateBG=new Image,this.bluePlateBG.src=`${this.assetsRoot}/Images/PlateBG/blue.png`,this.bluePlateBG.onload=()=>{e()}}),new Promise(e=>{this.yellowPlateBG=new Image,this.yellowPlateBG.src=`${this.assetsRoot}/Images/PlateBG/yellow.png`,this.yellowPlateBG.onload=()=>{e()}}),new Promise(e=>{this.whitePlateBG=new Image,this.whitePlateBG.src=`${this.assetsRoot}/Images/PlateBG/white.png`,this.whitePlateBG.onload=()=>{e()}}),new Promise(e=>{this.blackPlateBG=new Image,this.blackPlateBG.src=`${this.assetsRoot}/Images/PlateBG/black.png`,this.blackPlateBG.onload=()=>{e()}}),new Promise(e=>{this.neoYellowPlateBG=new Image,this.neoYellowPlateBG.src=`${this.assetsRoot}/Images/PlateBG/neo_yellow.png`,this.neoYellowPlateBG.onload=()=>{e()}}),new Promise(e=>{this.neoGreenPlateBG=new Image,this.neoGreenPlateBG.src=`${this.assetsRoot}/Images/PlateBG/neo_green.png`,this.neoGreenPlateBG.onload=()=>{e()}}),new Promise(e=>{this.greyPlateBG=new Image,this.greyPlateBG.src=`${this.assetsRoot}/Images/PlateBG/grey.png`,this.greyPlateBG.onload=()=>{e()}})]),this.isInitialized=!0}setInterpolate(i){this.clearVehicles(),this.needInterpolate=i}async setup(i){this.context=i,this.renderer=new l.WebGLRenderer({context:i.gl,premultipliedAlpha:!0,logarithmicDepthBuffer:!0,antialias:!0,powerPreference:"high-performance"}),this.renderer.shadowMap.enabled=!0,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=s=>{e(s),s==null&&i.bindRenderTarget()},this.scene=new l.Scene;const{camera:t}=i;this.camera=new l.PerspectiveCamera(t.fovY,t.aspect,.1,1e5),this.ambient=new l.AmbientLight(16777215,2),this.scene.add(this.ambient),this.sun=new l.DirectionalLight(16777215,2),this.scene.add(this.sun),i.resetWebGLState()}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 l.Vector3(e.center[0],e.center[1],e.center[2])),this.camera.projectionMatrix.fromArray(e.projectionMatrix),!this.isPaused&&this.needInterpolate)for(const a of this.vehicleObjectMap.keys()){const n=(s=this.vehicleObjectMap.get(a))==null?void 0:s.model;if(!n)continue;const o=this.computeVehiclePosition(a);if(o){const d=this.toRenderCoordinates(o);n.position.set(d[0],d[1],d[2]),n.rotation.y=l.MathUtils.degToRad(-o[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 l.Color(t.diffuse.color[0],t.diffuse.color[1],t.diffuse.color[2]),this.ambient.intensity=t.ambient.intensity,this.ambient.color=new l.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),M.requestRender(this.view),i.resetWebGLState()}async addVehicles(i){if(this.isPaused||!this.isInitialized)return;const e=Date.now();for(const t of i){this.appDataStore.saveTrackLog&&this.logTable.push([t.ptcId,t.plateNo,t.timestamp,t.localTimestamp,t.speed,t.x,t.y,t.ptcType,t.vehicleType,t.vehicleColor,t.plateColor,t.heading,t.fixAngle,t.roadLayer,t.step,e,0,0]);const{vehicleId:s,localTimestamp:a}=t,n=Number(t.x),o=Number(t.y),d=Number(t.heading);this.historyPositionMap.set(s,[{pos:[n,o,0],heading:d,time:a}]);const h=this.getVehicleModel(t);h.name=s,h.visible=!1;try{const r=await this.createPlateSprite(t);r&&(h.add(r),r.position.set(0,5,-4))}catch(r){console.log("createPlateSprite error:",r)}this.scene.add(h),this.vehicleObjectMap.set(s,{model:h,data:t,waitForDelete:!1,isMoving:!1})}}async updateVehicles(i){if(this.isPaused||!this.isInitialized)return;const e=[],t=Date.now();for(const s of i){const{vehicleId:a,localTimestamp:n}=s,o=Number(s.x),d=Number(s.y);let h=Number(s.heading);const r=this.vehicleObjectMap.get(a),p=this.historyPositionMap.get(a);if(!r||!p)e.push(s);else{if(this.appDataStore.saveTrackLog&&this.logTable.push([s.ptcId,s.plateNo,s.timestamp,s.localTimestamp,s.speed,s.x,s.y,s.ptcType,s.vehicleType,s.vehicleColor,s.plateColor,s.heading,s.fixAngle,s.roadLayer,s.step,t,p.length,1]),this.updateModel||r.data.vehicleColor!==s.vehicleColor||r.data.vehicleType!==s.vehicleType){this.scene.remove(r.model),this.disposeModel(r.model),r.model=this.getVehicleModel(s),r.model.visible=!0;const c=await this.createPlateSprite(s);c&&(r.model.add(c),c.position.set(0,5,-4)),this.scene.add(r.model)}if(r.data.showName!==s.showName||r.data.plateColor!==s.plateColor){const c=r.model.getObjectByName("VehiclePlate");c&&(r.model.remove(c),this.disposeModel(c));const g=await this.createPlateSprite(s);g&&(r.model.add(g),g.position.set(0,5,-4))}if(r.data=s,this.needInterpolate){const c=p[p.length-1];Math.abs(h-c.heading)>=180&&(h>c.heading?c.heading+=360:h+=360),p.push({pos:[o,d,0],heading:h,time:n})}else{this.historyPositionMap.set(a,[{pos:[o,d,0],heading:h,time:n}]);const c=this.toRenderCoordinates([o,d,0]);r.model.position.set(c[0],c[1],c[2]),r.model.rotation.y=l.MathUtils.degToRad(-h)}}}await this.addVehicles(e),this.updateModel=!1,this.needInterpolate||this.render(this.context)}toRenderCoordinates(i){const e=[0,0,0];return M.toRenderCoordinates(this.view,i,0,T.WGS84,e,0,1),e}deleteVehicles(i){if(this.isPaused)return;const e=Date.now();i.forEach(t=>{if(this.appDataStore.saveTrackLog){const a=this.historyPositionMap.get(t);this.logTable.push([t,"","","","","","","","","","","","","","",e,a?a.length:0,2])}const s=this.vehicleObjectMap.get(t);s&&(this.needInterpolate?s.isMoving?s.waitForDelete=!0:this.deleteVehicle(s):this.deleteVehicle(s))})}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===m.EVehiclePlateState.None?await this.updatePanelContent(m.EVehiclePlateState.PlateNumber):await this.updatePanelContent(i.visible?this.currentSpriteContent:m.EVehiclePlateState.None))}togglePause(i){this.isPaused=i}clearVehicles(){for(const i of this.vehicleObjectMap.keys()){const e=this.vehicleObjectMap.get(i);e&&(this.scene.remove(e.model),this.disposeModel(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!==m.EVehiclePlateState.None){const a=await this.createPlateSprite(t.data);a&&(t.model.add(a),a.position.set(0,5,-4))}}}}}toggleGroundVehicle(i){console.log("toggleGroundVehicle",i),this.showGroundVehicle=i}toggleElevatedVehicle(i){this.showElevatedVehicle=i}disposeModel(i){i.traverse(e=>{e instanceof l.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.isMoving=!0,t.data.roadLayer==="1"?t.model.visible=this.showGroundVehicle:t.model.visible=this.showElevatedVehicle,t.segmentStartTime||(t.segmentStartTime=s,t.segmentTotalTime=e[1].time-e[0].time);const a=s-t.segmentStartTime,n=Math.min(a/t.segmentTotalTime,1);if(n===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("hide vehicle",i));return}else{t.segmentStartTime=Date.now();const o=a-t.segmentTotalTime;return t.segmentTotalTime=e[1].time-e[0].time-o,(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 if(e.length>=2){const o=e[0].pos[0]+(e[1].pos[0]-e[0].pos[0])*n,d=e[0].pos[1]+(e[1].pos[1]-e[0].pos[1])*n,h=e[0].heading+(e[1].heading-e[0].heading)*n;return[o,d,0,h]}else return}getVehicleModel(i){if(this.view.camera.position.z>=this.cameraHeightThreshold){const e=new l.SphereGeometry(5,32,32),t=new l.MeshPhysicalMaterial({color:325253,emissive:0,roughness:this.roughness,metalness:this.metalness});return new l.Mesh(e,t)}else{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(a=>{!s&&a instanceof l.Mesh&&(a.material=t,s=!0)})}return e}}createCanvas(i,e,t){const s=document.createElement("canvas"),a=i.width,n=i.height;s.width=a,s.height=n;const o=s.getContext("2d");if(!o){console.log("canvas创建失败");return}return o.fillStyle="rgba(0,0,0,0.0)",o.fillRect(0,0,a,n),o.drawImage(i,0,0,a,n),o.beginPath(),o.translate(a/2,n/2),o.fillStyle=t,o.font="bold 32px 宋体",o.textBaseline="middle",o.textAlign="center",o.fillText(e,0,0),s}createPlateSprite(i){return new Promise((e,t)=>{var h,r;const s=!i.plateNo||i.plateNo==="0"||i.plateNo==="000000";if(this.currentSpriteContent===m.EVehiclePlateState.None||this.currentSpriteContent===m.EVehiclePlateState.PlateNumber&&s){e(void 0);return}let a=new Image,n="",o="";if(this.currentSpriteContent===m.EVehiclePlateState.PlateNumber||this.currentSpriteContent===m.EVehiclePlateState.Mix)if(s)a=this.greyPlateBG,n=i.ptcId,o="#ffffff";else switch(n=((h=i.showName)==null?void 0:h.substring(0,2))+"•"+((r=i.showName)==null?void 0:r.substring(2)),i.plateColor){case 1:a=this.bluePlateBG,o="#ffffff";break;case 2:a=this.yellowPlateBG,o="#000000";break;case 3:a=this.whitePlateBG,o="#000000";break;case 4:a=this.blackPlateBG,o="#ffffff";break;case 5:a=this.neoYellowPlateBG,o="#000000";break;case 6:a=this.neoGreenPlateBG,o="#000000";break;default:a=this.greyPlateBG,n=i.plateNo,o="#ffffff";break}else this.currentSpriteContent===m.EVehiclePlateState.Id&&(a=this.greyPlateBG,n=i.ptcId,o="#ffffff");const d=this.createCanvas(a,n,o);if(d){const p=new l.CanvasTexture(d),c=new l.SpriteMaterial({map:p,transparent:!1}),g=new l.Sprite(c),P=.05,w=d.width*P,b=d.height*P;g.scale.set(w,b,1),g.name="VehiclePlate",e(g)}else{t("canvas创建失败");return}a.onerror=p=>{console.log(`号牌背景加载失败: ${a.src}`,p),t(p)}})}}exports.default=V;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const v=require("@arcgis/core/core/promiseUtils.js"),y=require("@arcgis/core/core/reactiveUtils.js"),T=require("@arcgis/core/geometry/SpatialReference"),S=require("@arcgis/core/views/3d/externalRenderers"),C=require("three"),G=require("three/examples/jsm/loaders/GLTFLoader"),m=require("../../../types/index.js"),B=require("../../stores/index.js");function f(u){const s=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(s,e,t.get?t:{enumerable:!0,get:()=>u[e]})}}return s.default=u,Object.freeze(s)}const x=f(v),V=f(y),w=f(S),o=f(C);class R{constructor(s){this.cameraHeightThreshold=1e3,this.roughness=.2,this.metalness=.8,this.defaultMaterial=new o.MeshPhongMaterial({color:16777215}),this.materialMap=new Map([[1,this.createCarMaterial(16777215)],[2,this.createCarMaterial(7833753)],[3,this.createCarMaterial(16766720)],[4,this.createCarMaterial(16758465)],[5,this.createCarMaterial(14423100)],[6,this.createCarMaterial(3329330)],[7,this.createCarMaterial(2003183)],[8,this.createCarMaterial(16032864)],[9,this.createCarMaterial(2105376)],[10,this.createCarMaterial(9662683)],[99,this.createCarMaterial(6908265)]]),this.isInitialized=!1,this.showGroundVehicle=!0,this.showElevatedVehicle=!0,this.isPaused=!1,this.currentSpriteContent=m.EVehiclePlateState.None,this.historyPositionMap=new Map,this.vehicleObjectMap=new Map,this.needInterpolate=!0,this.updateModel=!1,this.appDataStore=B.default.useAppDataStore,this.logTable=[["ptcId","plateno","timestamp","localTimestamp","speed","longitude","latitude","ptcType","vehicleType","vehicleColor","plateColor","heading","fixAngle","roadLayer","step","receiveTimestamp","queueLength","status"]],this.assetsRoot=JSON.parse(JSON.stringify(this.appDataStore.mapConfig)).assetsRoot,this.view=s,V.watch(()=>this.view.camera.position.z,(e,t)=>{(t<=this.cameraHeightThreshold&&e>this.cameraHeightThreshold||t>this.cameraHeightThreshold&&e<=this.cameraHeightThreshold)&&(this.updateModel=!0)})}createCarMaterial(s){return new o.MeshPhongMaterial({color:s})}getLog(){return this.logTable}async init(){const s=new G.GLTFLoader;await x.eachAlways([new Promise(e=>{s.load(`${this.assetsRoot}/3DModels/car.glb`,t=>{const i=t.scene,n=new o.Box3().setFromObject(i).getSize(new o.Vector3);this.carModel=new o.Object3D,this.carModel.rotation.x=o.MathUtils.degToRad(90),this.carModel.add(i),i.position.set(0,0,n.z/2),e()})}),new Promise(e=>{s.load(`${this.assetsRoot}/3DModels/van.glb`,t=>{const i=t.scene,n=new o.Box3().setFromObject(i).getSize(new o.Vector3);this.vanModel=new o.Object3D,this.vanModel.rotation.x=o.MathUtils.degToRad(90),this.vanModel.add(i),i.position.set(0,0,n.z/2),e()})}),new Promise(e=>{s.load(`${this.assetsRoot}/3DModels/truck.glb`,t=>{const i=t.scene;i.scale.set(1.2,1,1.5);const n=new o.Box3().setFromObject(i).getSize(new o.Vector3);this.truckModel=new o.Object3D,this.truckModel.rotation.x=o.MathUtils.degToRad(90),this.truckModel.add(i),i.position.set(0,0,n.z/2),e()})}),new Promise(e=>{s.load(`${this.assetsRoot}/3DModels/bus.glb`,t=>{const i=t.scene,n=new o.Box3().setFromObject(i).getSize(new o.Vector3);this.busModel=new o.Object3D,this.busModel.rotation.x=o.MathUtils.degToRad(90),this.busModel.add(i),i.position.set(0,0,n.z/2),e()})}),new Promise(e=>{s.load(`${this.assetsRoot}/3DModels/bicycle.glb`,t=>{this.bicycleModel=t.scene,this.bicycleModel.rotation.x=o.MathUtils.degToRad(90),this.bicycleModel.rotation.y=o.MathUtils.degToRad(180),e()})}),new Promise(e=>{this.bluePlateBG=new Image,this.bluePlateBG.src=`${this.assetsRoot}/Images/PlateBG/blue.png`,this.bluePlateBG.onload=()=>{e()}}),new Promise(e=>{this.yellowPlateBG=new Image,this.yellowPlateBG.src=`${this.assetsRoot}/Images/PlateBG/yellow.png`,this.yellowPlateBG.onload=()=>{e()}}),new Promise(e=>{this.whitePlateBG=new Image,this.whitePlateBG.src=`${this.assetsRoot}/Images/PlateBG/white.png`,this.whitePlateBG.onload=()=>{e()}}),new Promise(e=>{this.blackPlateBG=new Image,this.blackPlateBG.src=`${this.assetsRoot}/Images/PlateBG/black.png`,this.blackPlateBG.onload=()=>{e()}}),new Promise(e=>{this.neoYellowPlateBG=new Image,this.neoYellowPlateBG.src=`${this.assetsRoot}/Images/PlateBG/neo_yellow.png`,this.neoYellowPlateBG.onload=()=>{e()}}),new Promise(e=>{this.neoGreenPlateBG=new Image,this.neoGreenPlateBG.src=`${this.assetsRoot}/Images/PlateBG/neo_green.png`,this.neoGreenPlateBG.onload=()=>{e()}}),new Promise(e=>{this.greyPlateBG=new Image,this.greyPlateBG.src=`${this.assetsRoot}/Images/PlateBG/grey.png`,this.greyPlateBG.onload=()=>{e()}})]),this.isInitialized=!0}setInterpolate(s){this.clearVehicles(),this.needInterpolate=s}async setup(s){this.context=s,this.renderer=new o.WebGLRenderer({context:s.gl,premultipliedAlpha:!0,logarithmicDepthBuffer:!0,antialias:!0,powerPreference:"high-performance"}),this.renderer.shadowMap.enabled=!0,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=i=>{e(i),i==null&&s.bindRenderTarget()},this.scene=new o.Scene;const{camera:t}=s;this.camera=new o.PerspectiveCamera(t.fovY,t.aspect,.1,1e5),this.ambient=new o.AmbientLight(16777215,2),this.scene.add(this.ambient),this.sun=new o.DirectionalLight(16777215,2),this.scene.add(this.sun),s.resetWebGLState()}async render(s){var i;const e=s.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.isPaused&&this.needInterpolate)for(const a of this.vehicleObjectMap.keys()){const n=(i=this.vehicleObjectMap.get(a))==null?void 0:i.model;if(!n)continue;const r=this.computeVehiclePosition(a);if(r){const d=this.toRenderCoordinates(r);n.position.set(d[0],d[1],d[2]),n.rotation.y=o.MathUtils.degToRad(-r[3])}}const t=s.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(),s.bindRenderTarget(),this.renderer.render(this.scene,this.camera),w.requestRender(this.view),s.resetWebGLState()}async addVehicles(s){if(this.isPaused||!this.isInitialized)return;const e=Date.now();for(const t of s){this.appDataStore.saveTrackLog&&this.logTable.push([t.ptcId,t.plateNo,t.timestamp,t.localTimestamp,t.speed,t.x,t.y,t.ptcType,t.vehicleType,t.vehicleColor,t.plateColor,t.heading,t.fixAngle,t.roadLayer,t.step,e,0,0]);const{vehicleId:i,localTimestamp:a}=t,n=Number(t.x),r=Number(t.y),d=Number(t.heading);this.historyPositionMap.set(i,[{pos:[n,r,0],heading:d,time:a}]);const h=this.getVehicleModel(t);h.name=i,h.visible=!1;try{const l=await this.createPlateSprite(t);l&&(h.add(l),l.position.set(0,5,-4))}catch(l){console.log("createPlateSprite error:",l)}this.scene.add(h),this.vehicleObjectMap.set(i,{model:h,data:t,waitForDelete:!1,isMoving:!1})}}async updateVehicles(s){if(this.isPaused||!this.isInitialized)return;const e=[],t=Date.now();for(const i of s){const{vehicleId:a,localTimestamp:n}=i,r=Number(i.x),d=Number(i.y);let h=Number(i.heading);const l=this.vehicleObjectMap.get(a),p=this.historyPositionMap.get(a);if(!l||!p)e.push(i);else{if(this.appDataStore.saveTrackLog&&this.logTable.push([i.ptcId,i.plateNo,i.timestamp,i.localTimestamp,i.speed,i.x,i.y,i.ptcType,i.vehicleType,i.vehicleColor,i.plateColor,i.heading,i.fixAngle,i.roadLayer,i.step,t,p.length,1]),this.updateModel||l.data.vehicleColor!==i.vehicleColor||l.data.vehicleType!==i.vehicleType){this.scene.remove(l.model),this.disposeModel(l.model),l.model=this.getVehicleModel(i),l.model.visible=!0;const c=await this.createPlateSprite(i);c&&(l.model.add(c),c.position.set(0,5,-4)),this.scene.add(l.model)}if(l.data.showName!==i.showName||l.data.plateColor!==i.plateColor){const c=l.model.getObjectByName("VehiclePlate");c&&(l.model.remove(c),this.disposeModel(c));const g=await this.createPlateSprite(i);g&&(l.model.add(g),g.position.set(0,5,-4))}if(l.data=i,this.needInterpolate){const c=p[p.length-1];Math.abs(h-c.heading)>=180&&(h>c.heading?c.heading+=360:h+=360),p.push({pos:[r,d,0],heading:h,time:n})}else{this.historyPositionMap.set(a,[{pos:[r,d,0],heading:h,time:n}]);const c=this.toRenderCoordinates([r,d,0]);l.model.position.set(c[0],c[1],c[2]),l.model.rotation.y=o.MathUtils.degToRad(-h)}}}await this.addVehicles(e),this.updateModel=!1,this.needInterpolate||this.render(this.context)}toRenderCoordinates(s){const e=[0,0,0];return w.toRenderCoordinates(this.view,s,0,T.WGS84,e,0,1),e}deleteVehicles(s){if(this.isPaused)return;const e=Date.now();s.forEach(t=>{if(this.appDataStore.saveTrackLog){const a=this.historyPositionMap.get(t);this.logTable.push([t,"","","","","","","","","","","","","","",e,a?a.length:0,2])}const i=this.vehicleObjectMap.get(t);i&&(this.needInterpolate?i.isMoving?i.waitForDelete=!0:this.deleteVehicle(i):this.deleteVehicle(i))})}deleteVehicle(s){this.scene.remove(s.model),this.disposeModel(s.model);const e=s.data.vehicleId;this.vehicleObjectMap.delete(e),this.historyPositionMap.delete(e)}async toggleTrafficInfo(s){s.name==="vehiclePlate"&&(s.visible===!0&&this.currentSpriteContent===m.EVehiclePlateState.None?await this.updatePanelContent(m.EVehiclePlateState.PlateNumber):await this.updatePanelContent(s.visible?this.currentSpriteContent:m.EVehiclePlateState.None))}togglePause(s){this.isPaused=s}clearVehicles(){for(const s of this.vehicleObjectMap.keys()){const e=this.vehicleObjectMap.get(s);e&&(this.scene.remove(e.model),this.disposeModel(e.model))}this.vehicleObjectMap.clear(),this.historyPositionMap.clear()}async updatePanelContent(s){if(s!==this.currentSpriteContent){this.currentSpriteContent=s;for(const e of this.vehicleObjectMap.keys()){const t=this.vehicleObjectMap.get(e);if(t){const i=t.model.getObjectByName("VehiclePlate");if(i&&(t.model.remove(i),this.disposeModel(i)),s!==m.EVehiclePlateState.None){const a=await this.createPlateSprite(t.data);a&&(t.model.add(a),a.position.set(0,5,-4))}}}}}toggleGroundVehicle(s){console.log("toggleGroundVehicle",s),this.showGroundVehicle=s}toggleElevatedVehicle(s){this.showElevatedVehicle=s}disposeModel(s){s.traverse(e=>{e instanceof o.Mesh&&(e.geometry.dispose(),e.material.dispose())})}computeVehiclePosition(s){const e=this.historyPositionMap.get(s),t=this.vehicleObjectMap.get(s);if(!t||!e||!t.isMoving&&e.length<=2)return;const i=Date.now();t.isMoving=!0,t.data.roadLayer==="1"?t.model.visible=this.showGroundVehicle:t.model.visible=this.showElevatedVehicle,t.segmentStartTime||(t.segmentStartTime=i,t.segmentTotalTime=e[1].time-e[0].time);const a=i-t.segmentStartTime,n=Math.min(a/t.segmentTotalTime,1);if(n===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("hide vehicle",s));return}else{t.segmentStartTime=Date.now();const r=a-t.segmentTotalTime;return t.segmentTotalTime=e[1].time-e[0].time-r,(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 if(e.length>=2){const r=e[0].pos[0]+(e[1].pos[0]-e[0].pos[0])*n,d=e[0].pos[1]+(e[1].pos[1]-e[0].pos[1])*n,h=e[0].heading+(e[1].heading-e[0].heading)*n;return[r,d,0,h]}else return}getVehicleModel(s){if(this.view.camera.position.z>=this.cameraHeightThreshold){const e=new o.SphereGeometry(5,32,32),t=new o.MeshPhysicalMaterial({color:325253,emissive:0,roughness:this.roughness,metalness:this.metalness});return new o.Mesh(e,t)}else{let e;if(s.ptcType===2)e=this.bicycleModel.clone();else{switch(s.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(s.vehicleColor)||this.defaultMaterial;let i=!1;e.traverse(a=>{!i&&a instanceof o.Mesh&&(a.material=t,i=!0)})}return e}}createCanvas(s,e,t){const i=document.createElement("canvas"),a=s.width,n=s.height;i.width=a,i.height=n;const r=i.getContext("2d");if(!r){console.log("canvas创建失败");return}return r.fillStyle="rgba(0,0,0,0.0)",r.fillRect(0,0,a,n),r.drawImage(s,0,0,a,n),r.beginPath(),r.translate(a/2,n/2),r.fillStyle=t,r.font="bold 32px 宋体",r.textBaseline="middle",r.textAlign="center",r.fillText(e,0,0),i}createPlateSprite(s){return new Promise((e,t)=>{var h,l;const i=!s.plateNo||s.plateNo==="0"||s.plateNo==="000000";if(this.currentSpriteContent===m.EVehiclePlateState.None||this.currentSpriteContent===m.EVehiclePlateState.PlateNumber&&i){e(void 0);return}let a=new Image,n="",r="";if(this.currentSpriteContent===m.EVehiclePlateState.PlateNumber||this.currentSpriteContent===m.EVehiclePlateState.Mix)if(i)a=this.greyPlateBG,n=s.ptcId,r="#ffffff";else switch(n=((h=s.showName)==null?void 0:h.substring(0,2))+"•"+((l=s.showName)==null?void 0:l.substring(2)),s.plateColor){case 1:a=this.bluePlateBG,r="#ffffff";break;case 2:a=this.yellowPlateBG,r="#000000";break;case 3:a=this.whitePlateBG,r="#000000";break;case 4:a=this.blackPlateBG,r="#ffffff";break;case 5:a=this.neoYellowPlateBG,r="#000000";break;case 6:a=this.neoGreenPlateBG,r="#000000";break;default:a=this.greyPlateBG,n=s.plateNo,r="#ffffff";break}else this.currentSpriteContent===m.EVehiclePlateState.Id&&(a=this.greyPlateBG,n=s.ptcId,r="#ffffff");const d=this.createCanvas(a,n,r);if(d){const p=new o.CanvasTexture(d),c=new o.SpriteMaterial({map:p,transparent:!1}),g=new o.Sprite(c),b=.05,M=d.width*b,P=d.height*b;g.scale.set(M,P,1),g.name="VehiclePlate",e(g)}else{t("canvas创建失败");return}a.onerror=p=>{console.log(`号牌背景加载失败: ${a.src}`,p),t(p)}})}}exports.default=R;

package/lib/src/gis-map/utils/signal-control-area-controller/district-controller.d.ts

@@ -5,6 +5,7 @@ interface ICross {
     latitude: number;
     longitude: number;
     signalId: string;
+    isKey: boolean;
 }
 export default class DistrictController {
     id: string;

package/lib/src/gis-map/utils/signal-control-area-controller/district-controller.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});class e{constructor(s){this.parentName="",this.crosses=[],this.subDistricts=[],this.areaColor=[Math.floor(Math.random()*255),Math.floor(Math.random()*255),Math.floor(Math.random()*255)],this.crossCount=0,this.subDistrictCount=0,this.id=s.id,this.name=s.name,this.parentId=s.parentId;for(const t of s.children)if(t.children){const o=new e(t);o.parentName=this.name,o.areaColor=this.areaColor,this.subDistricts.push(o),this.subDistrictCount++,this.crossCount+=o.crossCount}else{const o={id:t.id,name:t.name,parentId:t.parentId,latitude:Number(t.latitude),longitude:Number(t.longitude),signalId:t.signalId};this.crosses.push(o),this.crossCount++}}getAllCrossCoordinates(){const s=[];for(const t of this.crosses)s.push([t.longitude,t.latitude]);for(const t of this.subDistricts)s.push(...t.getAllCrossCoordinates());return s}}exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});class e{constructor(t){this.parentName="",this.crosses=[],this.subDistricts=[],this.areaColor=[Math.floor(Math.random()*255),Math.floor(Math.random()*255),Math.floor(Math.random()*255)],this.crossCount=0,this.subDistrictCount=0,this.id=t.id,this.name=t.name,this.parentId=t.parentId;for(const s of t.children)if(s.children){const o=new e(s);o.parentName=this.name,o.areaColor=this.areaColor,this.subDistricts.push(o),this.subDistrictCount++,this.crossCount+=o.crossCount}else{const o={id:s.id,name:s.name,parentId:s.parentId,latitude:Number(s.latitude),longitude:Number(s.longitude),signalId:s.signalId,isKey:s.isKey===1};this.crosses.push(o),this.crossCount++}}getAllCrossCoordinates(){const t=[];for(const s of this.crosses)t.push([s.longitude,s.latitude]);for(const s of this.subDistricts)t.push(...s.getAllCrossCoordinates());return t}}exports.default=e;

package/lib/src/gis-map/utils/signal-control-area-controller/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const m=require("@arcgis/core/core/reactiveUtils.js"),c=require("@arcgis/core/Graphic"),o=require("@arcgis/core/layers/GraphicsLayer"),p=require("@turf/buffer"),f=require("@turf/convex"),b=require("@turf/helpers"),L=require("./district-controller.js");function g(a){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(a){for(const t in a)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(a,t);Object.defineProperty(e,t,r.get?r:{enumerable:!0,get:()=>a[t]})}}return e.default=a,Object.freeze(e)}const w=g(m),u=g(b);class v{constructor(e){this.crossScale=3e3,this.view=e,this.view.popup.visibleElements={closeButton:!0,collapseButton:!1,actionBar:!0},this.districtControllerLayer=new o({id:"districtControllerLayer",maxScale:144447,minScale:1155582}),this.subDistrictControllerLayer=new o({id:"subDistrictControllerLayer",maxScale:0,minScale:144447}),this.crossLayer=new o({id:"crossLayer",maxScale:0,minScale:36112}),this.highlightLayer=new o({id:"highlightLayer"}),this.view.map.addMany([this.districtControllerLayer,this.subDistrictControllerLayer,this.crossLayer,this.highlightLayer])}showSignalControlArea(e){this.districtControllerLayer.removeAll(),this.subDistrictControllerLayer.removeAll(),this.crossLayer.removeAll(),this.highlightLayer.removeAll(),this.districtControllerLayer.visible=!0,this.subDistrictControllerLayer.visible=!0;for(const t of e){const r=new L.default(t);this.drawArea(r,!0)}return this.watchHandle=w.watch(()=>this.view.scale,(t,r)=>{if(t>this.crossScale&&r<=this.crossScale)this.crossLayer.graphics.forEach(s=>{s.symbol={type:"simple-marker",color:s.getAttribute("color"),size:8,outline:{color:"white",width:1}}}),this.highlightLayer.graphics.forEach(s=>{s.getAttribute("type")==="cross"&&(s.symbol={type:"simple-marker",color:s.getAttribute("color"),size:8,outline:{color:"white",width:1}})});else if(t<=this.crossScale&&r>this.crossScale){const s={type:"picture-marker",url:"/GisViewerAssets/Images/xhj_1.png",width:"37px",height:"57px",yoffset:"25px"};this.crossLayer.graphics.forEach(i=>{i.symbol=s}),this.highlightLayer.graphics.forEach(i=>{i.getAttribute("type")==="cross"&&(i.symbol=s)})}}),{status:0,message:"ok"}}clearSignalControlArea(){var e;return this.districtControllerLayer.removeAll(),this.subDistrictControllerLayer.removeAll(),this.crossLayer.removeAll(),this.highlightLayer.removeAll(),(e=this.watchHandle)==null||e.remove(),this.view.closePopup(),{status:0,message:"ok"}}async locateSignalControlArea(e){const t=this.findAreaGraphic(e.id);if(t){t.attributes.type==="cross"?await this.view.goTo({target:t.geometry,scale:1500}):await this.view.goTo(t.geometry);const r=t.geometry.type==="point"?t.geometry:t.geometry.centroid;return this.view.openPopup({features:[t],location:r}),{status:0,message:"ok"}}else return{status:1,message:"未找到"}}async highlightSignalControlArea(e){this.highlightLayer.removeAll(),this.districtControllerLayer.visible=!1,this.subDistrictControllerLayer.visible=!1,this.crossLayer.visible=!1;const t=this.districtControllerLayer.graphics.filter(i=>i.getAttribute("id")===e.id).toArray().map(i=>i.clone()),r=this.subDistrictControllerLayer.graphics.filter(i=>i.getAttribute("id")===e.id||i.getAttribute("parentId")===e.id).toArray().map(i=>i.clone()),s=this.crossLayer.graphics.filter(i=>i.getAttribute("id")===e.id||i.getAttribute("districtId")===e.id||i.getAttribute("subDistrictId")===e.id).toArray().map(i=>i.clone());return t.length>0&&this.highlightLayer.addMany(t),r.length>0&&this.highlightLayer.addMany(r),s.length>0&&this.highlightLayer.addMany(s),this.highlightLayer.graphics.length===0?{status:1,message:"未找到"}:(t.length>0?await this.view.goTo(t):r.length>0?await this.view.goTo(r):s.length>1?await this.view.goTo(s):await this.view.goTo({target:s[0].geometry,scale:1500}),{status:0,message:"ok"})}resetHighlight(){return this.highlightLayer.removeAll(),this.districtControllerLayer.visible=!0,this.subDistrictControllerLayer.visible=!0,this.crossLayer.visible=!0,{status:0,message:"ok"}}findAreaGraphic(e){let t=this.districtControllerLayer.graphics.find(r=>r.attributes.id===e);return t||(t=this.subDistrictControllerLayer.graphics.find(r=>r.attributes.id===e)),t||(t=this.crossLayer.graphics.find(r=>r.attributes.id===e)),t}drawArea(e,t){const r=e.getAllCrossCoordinates();if(r.length>2){const i=u.featureCollection(r.map(d=>u.point(d))),n=f(i);if(!n)return;const y=p(n.geometry,t?200:30,{units:"meters"});let l;t?l=[{fieldName:"id",label:"区控编号"},{fieldName:"crossCount",label:"路口数量"},{fieldName:"subDistrictCount",label:"子区数量"}]:l=[{fieldName:"parentName",label:"区控名称"},{fieldName:"id",label:"子区编号"},{fieldName:"crossCount",label:"路口数量"}];const h=new c({geometry:{type:"polygon",rings:y.geometry.coordinates},symbol:{type:"simple-fill",color:[...e.areaColor,t?.6:.8],outline:{color:e.areaColor,width:2,style:t?"solid":"long-dash"}},attributes:{type:"signalControlArea",id:e.id,name:e.name,parentId:e.parentId,parentName:e.parentName,crossCount:e.crossCount,subDistrictCount:e.subDistrictCount},popupTemplate:{title:e.name,content:[{type:"fields",fieldInfos:l}]}});t?this.districtControllerLayer.add(h):this.subDistrictControllerLayer.add(h)}for(const i of e.subDistricts)this.drawArea(i,!1);const s=e.crosses.map(i=>new c({geometry:{type:"point",x:i.longitude,y:i.latitude},symbol:{type:"simple-marker",color:e.areaColor,size:8,outline:{color:"white",width:1}},attributes:{type:"cross",id:i.id,name:i.name,color:e.areaColor,signalId:i.signalId,districtId:t?e.id:e.parentId,districtName:t?e.name:e.parentName,subDistrictId:t?"":e.id,subDistrictName:t?"":e.name},popupTemplate:{title:i.name,content:[{type:"fields",fieldInfos:[{fieldName:"districtName",label:"区控名称"},{fieldName:"subDistrictName",label:"子区名称"},{fieldName:"id",label:"路口编号"},{fieldName:"signalId",label:"信号机编号"}]}]}}));this.crossLayer.addMany(s)}}exports.default=v;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const m=require("@arcgis/core/core/reactiveUtils.js"),u=require("@arcgis/core/Graphic"),l=require("@arcgis/core/layers/GraphicsLayer"),b=require("@turf/buffer"),f=require("@turf/convex"),p=require("@turf/helpers"),A=require("./district-controller.js");function c(a){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(a){for(const t in a)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(a,t);Object.defineProperty(e,t,r.get?r:{enumerable:!0,get:()=>a[t]})}}return e.default=a,Object.freeze(e)}const L=c(m),n=c(p);class w{constructor(e){this.crossScale=3e3,this.view=e,this.view.popup.visibleElements={closeButton:!0,collapseButton:!1,actionBar:!0},this.districtControllerLayer=new l({id:"districtControllerLayer",maxScale:144447,minScale:1155582}),this.subDistrictControllerLayer=new l({id:"subDistrictControllerLayer",maxScale:0,minScale:144447}),this.crossLayer=new l({id:"crossLayer",maxScale:0,minScale:36112}),this.highlightLayer=new l({id:"highlightLayer"}),this.view.map.addMany([this.districtControllerLayer,this.subDistrictControllerLayer,this.crossLayer,this.highlightLayer])}showSignalControlArea(e){this.districtControllerLayer.removeAll(),this.subDistrictControllerLayer.removeAll(),this.crossLayer.removeAll(),this.highlightLayer.removeAll(),this.districtControllerLayer.visible=!0,this.subDistrictControllerLayer.visible=!0;for(const t of e){const r=new A.default(t);this.drawArea(r,!0)}return this.watchHandle=L.watch(()=>this.view.scale,(t,r)=>{t>this.crossScale&&r<=this.crossScale?(this.crossLayer.graphics.forEach(i=>{i.symbol={type:"simple-marker",style:i.getAttribute("isKey")?"diamond":"circle",color:i.getAttribute("color"),size:i.getAttribute("isKey")?16:8,outline:{color:i.getAttribute("isKey")?"red":"white",width:i.getAttribute("isKey")?2:1}}}),this.highlightLayer.graphics.forEach(i=>{i.getAttribute("type")==="cross"&&(i.symbol={type:"simple-marker",style:i.getAttribute("isKey")?"diamond":"circle",color:i.getAttribute("color"),size:i.getAttribute("isKey")?16:8,outline:{color:i.getAttribute("isKey")?"red":"white",width:i.getAttribute("isKey")?2:1}})})):t<=this.crossScale&&r>this.crossScale&&(this.crossLayer.graphics.forEach(i=>{i.symbol={type:"picture-marker",url:`/GisViewerAssets/Images/xhj_${i.getAttribute("isKey")?4:1}.png`,width:i.getAttribute("isKey")?"55px":"37px",height:i.getAttribute("isKey")?"85px":"57px",yoffset:i.getAttribute("isKey")?"37px":"25px"}}),this.highlightLayer.graphics.forEach(i=>{i.getAttribute("type")==="cross"&&(i.symbol={type:"picture-marker",url:`/GisViewerAssets/Images/xhj_${i.getAttribute("isKey")?4:1}.png`,width:i.getAttribute("isKey")?"55px":"37px",height:i.getAttribute("isKey")?"85px":"57px",yoffset:i.getAttribute("isKey")?"37px":"25px"})}))}),{status:0,message:"ok"}}clearSignalControlArea(){var e;return this.districtControllerLayer.removeAll(),this.subDistrictControllerLayer.removeAll(),this.crossLayer.removeAll(),this.highlightLayer.removeAll(),(e=this.watchHandle)==null||e.remove(),this.view.closePopup(),{status:0,message:"ok"}}async locateSignalControlArea(e){const t=this.findAreaGraphic(e.id);if(t){t.attributes.type==="cross"?await this.view.goTo({target:t.geometry,scale:1500}):await this.view.goTo(t.geometry);const r=t.geometry.type==="point"?t.geometry:t.geometry.centroid;return this.view.openPopup({features:[t],location:r}),{status:0,message:"ok"}}else return{status:1,message:"未找到"}}async highlightSignalControlArea(e){this.highlightLayer.removeAll(),this.districtControllerLayer.visible=!1,this.subDistrictControllerLayer.visible=!1,this.crossLayer.visible=!1;const t=this.districtControllerLayer.graphics.filter(s=>s.getAttribute("id")===e.id).toArray().map(s=>s.clone()),r=this.subDistrictControllerLayer.graphics.filter(s=>s.getAttribute("id")===e.id||s.getAttribute("parentId")===e.id).toArray().map(s=>s.clone()),i=this.crossLayer.graphics.filter(s=>s.getAttribute("id")===e.id||s.getAttribute("districtId")===e.id||s.getAttribute("subDistrictId")===e.id).toArray().map(s=>s.clone());return t.length>0&&this.highlightLayer.addMany(t),r.length>0&&this.highlightLayer.addMany(r),i.length>0&&this.highlightLayer.addMany(i),this.highlightLayer.graphics.length===0?{status:1,message:"未找到"}:(t.length>0?await this.view.goTo(t):r.length>0?await this.view.goTo(r):i.length>1?await this.view.goTo(i):await this.view.goTo({target:i[0].geometry,scale:1500}),{status:0,message:"ok"})}resetHighlight(){return this.highlightLayer.removeAll(),this.districtControllerLayer.visible=!0,this.subDistrictControllerLayer.visible=!0,this.crossLayer.visible=!0,{status:0,message:"ok"}}findAreaGraphic(e){let t=this.districtControllerLayer.graphics.find(r=>r.attributes.id===e);return t||(t=this.subDistrictControllerLayer.graphics.find(r=>r.attributes.id===e)),t||(t=this.crossLayer.graphics.find(r=>r.attributes.id===e)),t}drawArea(e,t){const r=e.getAllCrossCoordinates();if(r.length>=2){let s=null;if(r.length===2)s=n.lineString(r);else if(r.length>2){const g=n.featureCollection(r.map(d=>n.point(d)));s=f(g)}if(!s)return;const y=b(s.geometry,t?200:30,{units:"meters"});let o;t?o=[{fieldName:"id",label:"区控编号"},{fieldName:"crossCount",label:"路口数量"},{fieldName:"subDistrictCount",label:"子区数量"}]:o=[{fieldName:"parentName",label:"所属区控"},{fieldName:"crossCount",label:"路口数量"}];const h=new u({geometry:{type:"polygon",rings:y.geometry.coordinates},symbol:{type:"simple-fill",color:[...e.areaColor,t?.6:.8],outline:{color:e.areaColor,width:2,style:t?"solid":"long-dash"}},attributes:{type:"signalControlArea",id:e.id,name:e.name,parentId:e.parentId,parentName:e.parentName,crossCount:e.crossCount,subDistrictCount:e.subDistrictCount},popupTemplate:{title:`${t?"区控":"子区"}  ${e.name}`,content:[{type:"fields",fieldInfos:o}]}});t?this.districtControllerLayer.add(h):this.subDistrictControllerLayer.add(h)}for(const s of e.subDistricts)this.drawArea(s,!1);const i=e.crosses.map(s=>new u({geometry:{type:"point",x:s.longitude,y:s.latitude},symbol:{type:"simple-marker",style:s.isKey?"diamond":"circle",color:e.areaColor,size:s.isKey?16:8,outline:{color:s.isKey?"red":"white",width:s.isKey?2:1}},attributes:{type:"cross",id:s.id,name:s.name,color:e.areaColor,signalId:s.signalId,districtId:t?e.id:e.parentId,districtName:t?e.name:e.parentName,subDistrictId:t?"":e.id,subDistrictName:t?"":e.name,isKey:s.isKey},popupTemplate:{title:s.name,content:[{type:"fields",fieldInfos:[{fieldName:"districtName",label:"区控名称"},{fieldName:"subDistrictName",label:"子区名称"},{fieldName:"id",label:"路口编号"},{fieldName:"signalId",label:"信号机编号"}]}]}}));this.crossLayer.addMany(i)}}exports.default=w;

package/lib/src/types/index.d.ts

@@ -40,7 +40,7 @@ export interface IVehicleTrack {
     step?: number;
 }
 export interface IVehicleRecord {
-    model: Three.Group | Three.Mesh;
+    model: Three.Mesh | Three.Object3D;
     data: IVehicleTrack;
     segmentStartTime?: number;
     segmentTotalTime?: number;

package/package.json

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