gisviewer-vue3-arcgis 1.0.185 → 1.0.187

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

@@ -1,6 +1,6 @@
 import MapView from '@arcgis/core/views/MapView';
 import SceneView from '@arcgis/core/views/SceneView';
-import { IFindSumoParams, ILaneNumberParams, ILayerVisibleParams, ILookAtParams, IMaskParam, IOverlayParam, IQueueLengthParams, ISetMapCameraParams, ISetMapCenterParams, IShowOpenDriveFromFileParams, ISignalCountdownProps, ISplitOpenDriveLaneParams, IStartCrossBufferParam, IToggleTrafficInfoParams, IUnselectSumoParams } from '../types';
+import { IEditSignalControlAreaParams, IFindSumoParams, ILaneNumberParams, ILayerVisibleParams, ILookAtParams, IMaskParam, IOverlayParam, IQueueLengthParams, ISetMapCameraParams, ISetMapCenterParams, IShowOpenDriveFromFileParams, IShowSignalControlAreaParams, ISignalCountdownProps, ISplitOpenDriveLaneParams, IStartCrossBufferParam, IToggleTrafficInfoParams, IUnselectSumoParams } from '../types';
 import HoloFlow from './utils/holo-flow';
 import MapInitializer from './utils/map-initializer';
 import OpenDriveRenderer from './utils/open-drive-renderer';
@@ -115,10 +115,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
         status: number;
         message: string;
     }>;
-    showSignalControlArea: (params: {
-        areaList: any[];
-        style?: string;
-    }) => import("../types").IResult;
+    showSignalControlArea: (params: IShowSignalControlAreaParams) => import("../types").IResult;
     clearSignalControlArea: () => void;
     locateSignalControlArea: (params: {
         id: string;
@@ -128,12 +125,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
     }) => Promise<import("../types").IResult>;
     resetHighlightSignalControlArea: () => import("../types").IResult;
     showSubSignalControlArea: (params: any) => import("../types").IResult;
-    editSubSignalControlArea: (crossIdsInDistrict: string[], addCrossCallback: (params: {
-        id: string;
-        name: string;
-    }) => void, removeCrossCallback: (params: {
-        id: string;
-    }) => void) => Promise<import("../types").IResult> | {
+    editSubSignalControlArea: (params: IEditSignalControlAreaParams) => Promise<import("../types").IResult> | {
         status: number;
         message: string;
     };

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

@@ -1,4 +1,4 @@
-import { defineComponent as Be, ref as k, reactive as Ne, onMounted as ze, getCurrentInstance as Qe, onUnmounted as je, computed as Ee, openBlock as C, createElementBlock as A, createElementVNode as g, withDirectives as Ze, vShow as $e, Fragment as qe, renderList as Ke, createBlock as Ue } from "vue";
+import { defineComponent as Be, ref as k, reactive as Ne, onMounted as ze, getCurrentInstance as Qe, onUnmounted as je, computed as Ee, openBlock as h, createElementBlock as A, createElementVNode as g, withDirectives as Ze, vShow as $e, Fragment as qe, renderList as Ke, createBlock as Ue } from "vue";
 import b, { registerStore as Ge } from "./stores/index.mjs";
 import "./style/index.css";
 import Je from "./utils/holo-flow/index.mjs";
@@ -19,7 +19,7 @@ const Fe = { class: "gis-viewer" }, et = { style: { position: "absolute", bottom
   emits: ["mapLoaded", "markerClick", "mapClick"],
   setup(M, { expose: _, emit: x }) {
     const d = k(null);
-    let i, u, c, s, n, r, p, t, a;
+    let o, l, c, s, n, r, p, t, a;
     const f = k(!1);
     Ge();
     const H = b.useAppDataStore, v = Ne([]);
@@ -29,21 +29,21 @@ const Fe = { class: "gis-viewer" }, et = { style: { position: "absolute", bottom
       document.addEventListener("keydown", (m) => {
         m.ctrlKey && m.key === "i" && (f.value = !f.value);
       });
-      const e = Qe(), { $gisviewerAssetsRoot: l } = e.appContext.config.globalProperties, o = await (await fetch(O.config)).json();
-      o.assetsRoot = O.assetsRoot || l, H.mapConfig = o, u = new We(), i = await u.initialize({
+      const e = Qe(), { $gisviewerAssetsRoot: u } = e.appContext.config.globalProperties, i = await (await fetch(O.config)).json();
+      i.assetsRoot = O.assetsRoot || u, H.mapConfig = i, l = new We(), o = await l.initialize({
         container: d.value,
-        mapConfig: o,
-        markerClickCallback: (m, w, h, Ve) => {
-          y("markerClick", m, w, h, Ve);
+        mapConfig: i,
+        markerClickCallback: (m, w, C, Ve) => {
+          y("markerClick", m, w, C, Ve);
         },
-        mapClickCallback: (m, w, h) => {
-          y("mapClick", m, w, h);
+        mapClickCallback: (m, w, C) => {
+          y("mapClick", m, w, C);
         }
-      }), n = new Je(i, v), await n.init(), y("mapLoaded");
+      }), n = new Je(o, v), await n.init(), y("mapLoaded");
     }), je(() => {
       a == null || a.clearSignalControlArea(), t == null || t.clearOpenDrive(), n.clearHoloTrace(), n.clearHoloSignal(), s == null || s.disconnectTrafficFlow();
     });
-    const P = Ee(() => i), V = () => {
+    const P = Ee(() => o), V = () => {
       const e = b.useAppDataStore;
       e.saveTrackLog = !0;
     }, B = () => {
@@ -52,15 +52,15 @@ const Fe = { class: "gis-viewer" }, et = { style: { position: "absolute", bottom
       S("vehicleId");
     }, z = () => {
       S("plateNumber");
-    }, Q = async (e) => await u.setMapCenter(e), j = async (e) => await u.setMapCamera(e), E = async (e) => await u.lookAt(e), Z = (e) => u.setLayerVisibility(e), $ = (e, l) => u.requestCoordinateTransform(e, l), q = (e) => {
-      u.cancelCoordinateTransform(e);
+    }, Q = async (e) => await l.setMapCenter(e), j = async (e) => await l.setMapCamera(e), E = async (e) => await l.lookAt(e), Z = (e) => l.setLayerVisibility(e), $ = (e, u) => l.requestCoordinateTransform(e, u), q = (e) => {
+      l.cancelCoordinateTransform(e);
     }, K = (e) => {
-      u.setMapZoomRange(e);
-    }, U = (e) => (c || (c = new T(i)), c.showLaneNumber(e)), G = () => {
+      l.setMapZoomRange(e);
+    }, U = (e) => (c || (c = new T(o)), c.showLaneNumber(e)), G = () => {
       c == null || c.clearLaneNumber();
-    }, J = async (e) => (c || (c = new T(i)), await c.initializeSearch(e)), R = async () => c == null ? void 0 : c.calCrossIndicatorArea(), W = async () => {
-    }, X = async (e, l) => {
-      s || (s = new Ye(i)), s.connectTrafficFlow(e, l);
+    }, J = async (e) => (c || (c = new T(o)), await c.initializeSearch(e)), R = async () => c == null ? void 0 : c.calCrossIndicatorArea(), W = async () => {
+    }, X = async (e, u) => {
+      s || (s = new Ye(o)), s.connectTrafficFlow(e, u);
     }, Y = () => {
       s == null || s.disconnectTrafficFlow();
     }, F = async (e) => {
@@ -81,18 +81,18 @@ const Fe = { class: "gis-viewer" }, et = { style: { position: "absolute", bottom
       s == null || s.toggleTrafficObject(e), n == null || n.toggleTrafficObject(e);
     }, S = (e) => {
       n == null || n.updatePanelContent(e);
-    }, ie = async (e) => (r || (r = new L(i)), r.addOverlays(e)), ce = (e) => (r || (r = new L(i)), r.addMask(e)), le = () => {
+    }, ie = async (e) => (r || (r = new L(o)), r.addOverlays(e)), ce = (e) => (r || (r = new L(o)), r.addMask(e)), le = () => {
       r == null || r.removeMask();
     }, ue = (e) => r == null ? void 0 : r.removeOverlaysByType(e), me = (e) => r == null ? void 0 : r.removeOverlaysById(e), pe = () => r == null ? void 0 : r.removeAllOverlays(), ge = () => {
       r == null || r.showAllOverlays();
     }, de = (e) => {
-      p || (p = new Xe(i)), p.updateQueueLength(e);
+      p || (p = new Xe(o)), p.updateQueueLength(e);
     }, fe = () => {
       p == null || p.removeQueueLength();
-    }, Se = async (e, l) => (t || (t = new D(i)), await t.showOpenDriveFromServer(e, l)), ye = async (e) => (t || (t = new D(i)), await t.clearOpenDrive(), await t.showOpenDriveFromFile(e)), we = async () => await (t == null ? void 0 : t.clearOpenDrive()), he = async (e) => t ? await (t == null ? void 0 : t.findSumo(e)) : {
+    }, Se = async (e, u) => (t || (t = new D(o)), await t.showOpenDriveFromServer(e, u)), ye = async (e) => (t || (t = new D(o)), await t.clearOpenDrive(), await t.showOpenDriveFromFile(e)), we = async () => await (t == null ? void 0 : t.clearOpenDrive()), Ce = async (e) => t ? await (t == null ? void 0 : t.findSumo(e)) : {
       status: -1,
       message: "未加载OpenDrive地图"
-    }, Ce = async (e) => t ? t.selectSumo(e) : {
+    }, he = async (e) => t ? t.selectSumo(e) : {
       status: -1,
       message: "未加载OpenDrive地图"
     }, ve = async (e) => t ? t.unselectSumo(e) : {
@@ -110,13 +110,9 @@ const Fe = { class: "gis-viewer" }, et = { style: { position: "absolute", bottom
     }, be = async () => t ? t == null ? void 0 : t.clearSplitLane() : {
       status: -1,
       message: "未加载OpenDrive地图"
-    }, De = (e) => (a || (a = new I(i)), a.showSignalControlArea(e)), Le = () => {
+    }, De = (e) => (a || (a = new I(o)), a.showSignalControlArea(e)), Le = () => {
       a == null || a.clearSignalControlArea();
-    }, Te = async (e) => a ? await a.locateSignalControlArea(e) : { status: -1, message: "未加载信号控制区" }, Ie = async (e) => a ? await a.highlightSignalControlArea(e) : { status: -1, message: "未加载信号控制区" }, Me = () => a ? a.resetHighlight() : { status: -1, message: "未加载信号控制区" }, _e = (e) => (a || (a = new I(i)), a.showSubSignalControlArea(e)), xe = (e, l, o) => a ? a.editSubSignalArea(
-      e,
-      l,
-      o
-    ) : { status: -1, message: "未加载信号控制区" }, He = (e) => a ? a.selectSubSignalControlAreaCross(e) : { status: -1, message: "未加载信号控制区" }, Pe = (e) => a ? a.unselectSubSignalControlAreaCross(e) : { status: -1, message: "未加载信号控制区" }, O = M, y = x;
+    }, Te = async (e) => a ? await a.locateSignalControlArea(e) : { status: -1, message: "未加载信号控制区" }, Ie = async (e) => a ? await a.highlightSignalControlArea(e) : { status: -1, message: "未加载信号控制区" }, Me = () => a ? a.resetHighlight() : { status: -1, message: "未加载信号控制区" }, _e = (e) => (a || (a = new I(o)), a.showSubSignalControlArea(e)), xe = (e) => a ? a.editSubSignalControlArea(e) : { status: -1, message: "未加载信号控制区" }, He = (e) => a ? a.selectSubSignalControlAreaCross(e) : { status: -1, message: "未加载信号控制区" }, Pe = (e) => a ? a.unselectSubSignalControlAreaCross(e) : { status: -1, message: "未加载信号控制区" }, O = M, y = x;
     return _({
       mapViewer: P,
       setLayerVisibility: Z,
@@ -155,8 +151,8 @@ const Fe = { class: "gis-viewer" }, et = { style: { position: "absolute", bottom
       showOpenDriveFromFile: ye,
       clearOpenDrive: we,
       geometrySearchInOpenDrive: Oe,
-      findSumoInOpenDrive: he,
-      selectSumoInOpenDrive: Ce,
+      findSumoInOpenDrive: Ce,
+      selectSumoInOpenDrive: he,
       unselectSumoInOpenDrive: ve,
       getSumoInfo: ke,
       splitOpenDriveLane: Ae,
@@ -170,7 +166,7 @@ const Fe = { class: "gis-viewer" }, et = { style: { position: "absolute", bottom
       editSubSignalControlArea: xe,
       selectSubSignalControlAreaCross: He,
       unselectSubSignalControlAreaCross: Pe
-    }), (e, l) => (C(), A("div", Fe, [
+    }), (e, u) => (h(), A("div", Fe, [
       g("div", {
         class: "gis-viewer-main",
         ref_key: "mapContainer",
@@ -194,17 +190,17 @@ const Fe = { class: "gis-viewer" }, et = { style: { position: "absolute", bottom
           [$e, f.value]
         ])
       ], 512),
-      (C(!0), A(qe, null, Ke(v, (o, m) => (C(), Ue(Re, {
+      (h(!0), A(qe, null, Ke(v, (i, m) => (h(), Ue(Re, {
         key: m,
-        "display-mode": o.displayMode,
-        "road-id": o.crossId,
-        "cross-id": o.roadId,
-        "map-point": o.mapPoint,
-        "stop-line": o.stopLine,
-        position: o.position,
-        rotation: o.rotation,
-        scale: o.scale,
-        "lamp-status": o.lampStatus
+        "display-mode": i.displayMode,
+        "road-id": i.crossId,
+        "cross-id": i.roadId,
+        "map-point": i.mapPoint,
+        "stop-line": i.stopLine,
+        position: i.position,
+        rotation: i.rotation,
+        scale: i.scale,
+        "lamp-status": i.lampStatus
       }, null, 8, ["display-mode", "road-id", "cross-id", "map-point", "stop-line", "position", "rotation", "scale", "lamp-status"]))), 128))
     ]));
   }

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

@@ -104,10 +104,7 @@ export declare const GisMap: import("@easyest/utils/dist/lib/withinstall").SFCWi
         status: number;
         message: string;
     }>;
-    showSignalControlArea: (params: {
-        areaList: any[];
-        style?: string | undefined;
-    }) => import("../types").IResult;
+    showSignalControlArea: (params: import("../types").IShowSignalControlAreaParams) => import("../types").IResult;
     clearSignalControlArea: () => void;
     locateSignalControlArea: (params: {
         id: string;
@@ -117,12 +114,7 @@ export declare const GisMap: import("@easyest/utils/dist/lib/withinstall").SFCWi
     }) => Promise<import("../types").IResult>;
     resetHighlightSignalControlArea: () => import("../types").IResult;
     showSubSignalControlArea: (params: any) => import("../types").IResult;
-    editSubSignalControlArea: (crossIdsInDistrict: string[], addCrossCallback: (params: {
-        id: string;
-        name: string;
-    }) => void, removeCrossCallback: (params: {
-        id: string;
-    }) => void) => Promise<import("../types").IResult> | {
+    editSubSignalControlArea: (params: import("../types").IEditSignalControlAreaParams) => Promise<import("../types").IResult> | {
         status: number;
         message: string;
     };

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

@@ -1,6 +1,6 @@
-import * as d from "@arcgis/core/core/reactiveUtils";
+import * as w from "@arcgis/core/core/reactiveUtils";
 import { Point as f } from "@arcgis/core/geometry";
-import * as w from "@arcgis/core/geometry/support/webMercatorUtils.js";
+import * as d from "@arcgis/core/geometry/support/webMercatorUtils.js";
 import P from "@arcgis/core/layers/GraphicsLayer";
 import m from "./signal-holo-flow.mjs";
 class M extends m {
@@ -36,7 +36,7 @@ class M extends m {
     return n < 1e3 ? s = 1 : n < 2e3 ? s = 0.8 : n < 4e3 ? s = 0.4 : s = 0, s;
   }
   async handleSignalData(n) {
-    this.watchHandle || (this.watchHandle = d.watch(
+    this.watchHandle || (this.watchHandle = w.watch(
       () => this.view.extent,
       () => {
         const t = this.getPanelScale();
@@ -47,7 +47,7 @@ class M extends m {
             x: e[0],
             y: e[1]
           });
-          this.view.spatialReference.isWebMercator && (a = w.geographicToWebMercator(
+          this.view.spatialReference.isWebMercator && (a = d.geographicToWebMercator(
             a
           ));
           const i = this.view.toScreen(a);
@@ -94,11 +94,11 @@ class M extends m {
           x: e.panelPoint[0],
           y: e.panelPoint[1]
         });
-        this.view.spatialReference.isWebMercator && (i = w.geographicToWebMercator(
+        this.view.spatialReference.isWebMercator && (i = d.geographicToWebMercator(
           i
         ));
         const r = this.view.toScreen(i), h = this.getPanelRotation(e.coord);
-        console.log(o, h), this.countdownPanelProps.push({
+        this.countdownPanelProps.push({
           displayMode: "complex",
           crossId: s,
           roadId: o,
@@ -132,7 +132,7 @@ class M extends m {
       x: s[0],
       y: s[1]
     });
-    this.view.spatialReference.isWebMercator && (c = w.geographicToWebMercator(
+    this.view.spatialReference.isWebMercator && (c = d.geographicToWebMercator(
       c
     ));
     const p = this.view.toScreen(c), l = n[n.length - 1];
@@ -140,7 +140,7 @@ class M extends m {
       x: l[0],
       y: l[1]
     });
-    this.view.spatialReference.isWebMercator && (t = w.geographicToWebMercator(
+    this.view.spatialReference.isWebMercator && (t = d.geographicToWebMercator(
       t
     ));
     const o = this.view.toScreen(t), e = o.x - p.x, a = o.y - p.y;

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

@@ -3,10 +3,15 @@ export default class TraceRendererLayer implements ITraceRendererInterface {
     private view;
     private readonly vehicleLayer;
     private mapConfig;
+    private hasGpu;
     private rafSignal;
     private appDataStore;
     private logTable;
     constructor(view: __esri.MapView);
+    private getRendererText;
+    private em;
+    private el;
+    private getGpuText;
     getLog(): (string | number)[][];
     init(): Promise<void>;
     private needInterpolate;
@@ -45,6 +50,7 @@ export default class TraceRendererLayer implements ITraceRendererInterface {
      * @returns
      */
     private createCIMSymbol;
+    private createMarkerSymbol;
     /**
      * 根据车身颜色属性返回对应的车辆图标
      * @param carColor

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

@@ -1,10 +1,10 @@
-import c from "@arcgis/core/Graphic";
-import p from "@arcgis/core/layers/GraphicsLayer";
+import p from "@arcgis/core/Graphic";
+import g from "@arcgis/core/layers/GraphicsLayer";
 import { toRaw as m } from "vue";
-import g from "../../stores/index.mjs";
-class P {
+import u from "../../stores/index.mjs";
+class v {
   constructor(i) {
-    this.appDataStore = g.useAppDataStore, this.logTable = [
+    this.hasGpu = !1, this.appDataStore = u.useAppDataStore, this.logTable = [
       [
         "uuid",
         "ptcId",
@@ -30,9 +30,53 @@ class P {
         "step",
         "receiveTimestamp"
       ]
-    ], this.needInterpolate = !0, this.isPaused = !1, this.showVehiclePlate = !1, this.showGroundVehicle = !0, this.showElevatedVehicle = !0, this.historyPositionMap = /* @__PURE__ */ new Map(), this.vehicleObjectMap = /* @__PURE__ */ new Map(), this.view = i, this.mapConfig = m(this.appDataStore.mapConfig), this.vehicleLayer = new p({
+    ], this.needInterpolate = !0, this.isPaused = !1, this.showVehiclePlate = !1, this.showGroundVehicle = !0, this.showElevatedVehicle = !0, this.historyPositionMap = /* @__PURE__ */ new Map(), this.vehicleObjectMap = /* @__PURE__ */ new Map(), this.view = i, this.mapConfig = m(this.appDataStore.mapConfig), this.vehicleLayer = new g({
       id: "vehicleLayer"
-    }), this.view.map.add(this.vehicleLayer), this.rafSignal = requestAnimationFrame(() => this.render());
+    }), this.view.map.add(this.vehicleLayer);
+    const t = this.getRendererText(), e = this.getGpuText(t);
+    this.hasGpu = e !== "Unknown", this.hasGpu && (this.rafSignal = requestAnimationFrame(() => this.render())), console.log("rendererText: ", t), console.log("gpuText: ", e);
+  }
+  getRendererText() {
+    try {
+      const i = document.createElement("canvas"), t = i.getContext("webgl") || i.getContext("experimental-webgl");
+      if (!t)
+        return "Unknown";
+      const e = t.getExtension("WEBGL_debug_renderer_info");
+      return e && t.getParameter(e.UNMASKED_RENDERER_WEBGL) || "Unknown";
+    } catch {
+      return "Unknown";
+    }
+  }
+  em(i) {
+    const t = [], e = i.split("");
+    for (let s = 0; s < e.length; s++)
+      if (e[s] === "(")
+        t.push(s);
+      else if (e[s] === ")") {
+        const r = t.pop();
+        r !== void 0 && (e.splice(r, s - r + 1), s = r - 1);
+      }
+    return e.join("");
+  }
+  el(i) {
+    return this.em(i).replace(/\/PCIe\/SSE2/g, "").replace(/\s+/g, " ").trim();
+  }
+  getGpuText(i) {
+    try {
+      if (/, or similar$/.test(i) || /SwiftShader/.test(i))
+        return "Unknown";
+      if (/^ANGLE/.test(i)) {
+        const t = i.match(/\((.+)\)$/);
+        if (t) {
+          const e = t[1], s = e.split(/,\s*/g);
+          let r = s[1];
+          return /^ANGLE Metal Renderer: /.test(r) && (r = i.split(": ")[1].split(",")[0]), s.length === 1 && (r = s[0].split(" ").slice(1).join(" ")), /Direct3D/.test(r) && (r = r.split("Direct3D")[0].trim()), r;
+        }
+      }
+    } catch {
+      return "Unknown";
+    }
+    return this.el(i);
   }
   getLog() {
     return this.logTable;
@@ -46,28 +90,26 @@ class P {
         return;
       }
       const e = i.map((s) => {
-        const { vehicleId: o, heading: a, localTimestamp: h } = s, l = Number(s.x), n = Number(s.y);
-        this.historyPositionMap.set(o, [
-          { pos: [l, n, 0], heading: a, time: h }
-        ]);
-        const r = new c({
+        const { vehicleId: r, heading: o, localTimestamp: h } = s, n = Number(s.x), l = Number(s.y), a = new p({
           geometry: {
             type: "point",
-            x: l,
-            y: n
+            x: n,
+            y: l
           },
           attributes: {
             ...s,
             type: "trackVehicle"
           },
-          symbol: this.createCIMSymbol(s)
+          symbol: this.hasGpu ? this.createCIMSymbol(s) : this.createMarkerSymbol()
         });
-        return r.visible = !1, this.vehicleObjectMap.set(o, {
-          graphic: r,
+        return this.hasGpu && (a.visible = !1, this.historyPositionMap.set(r, [
+          { pos: [n, l, 0], heading: o, time: h }
+        ]), this.vehicleObjectMap.set(r, {
+          graphic: a,
           data: s,
           waitForDelete: !1,
           isMoving: !1
-        }), r;
+        })), a;
       });
       this.vehicleLayer.addMany(e), t();
     });
@@ -80,25 +122,42 @@ class P {
       }
       const e = [];
       i.forEach((s) => {
-        const { vehicleId: o, heading: a, localTimestamp: h } = s, l = Number(s.x), n = Number(s.y), r = this.vehicleObjectMap.get(o);
-        r ? (r.data = s, r.graphic.attributes = {
-          ...s,
-          type: "trackVehicle"
-        }, this.historyPositionMap.get(
-          o
-        ).push({
-          pos: [l, n, 0],
-          heading: a,
-          time: h
-        })) : e.push(s);
+        const { vehicleId: r, heading: o, localTimestamp: h } = s, n = Number(s.x), l = Number(s.y);
+        if (this.hasGpu) {
+          const a = this.vehicleObjectMap.get(r);
+          a ? (a.data = s, a.graphic.attributes = {
+            ...s,
+            type: "trackVehicle"
+          }, this.historyPositionMap.get(
+            r
+          ).push({
+            pos: [n, l, 0],
+            heading: o,
+            time: h
+          })) : e.push(s);
+        } else {
+          const a = this.vehicleLayer.graphics.find(
+            (c) => c.getAttribute("vehicleId") == s.vehicleId
+          );
+          a ? a.geometry = {
+            type: "point",
+            x: n,
+            y: l
+          } : e.push(s);
+        }
       }), this.addVehicles(e), t();
     });
   }
   deleteVehicles(i) {
-    this.isPaused || i.forEach((t) => {
+    this.isPaused || (this.hasGpu ? i.forEach((t) => {
       const e = this.vehicleObjectMap.get(t);
       e && (e.waitForDelete = !0);
-    });
+    }) : i.forEach((t) => {
+      const e = this.vehicleLayer.graphics.find(
+        (s) => s.getAttribute("vehicleId") == t
+      );
+      e && this.vehicleLayer.remove(e);
+    }));
   }
   clearVehicles() {
     this.vehicleLayer.removeAll(), this.vehicleObjectMap.clear(), this.historyPositionMap.clear();
@@ -121,7 +180,7 @@ class P {
     i.name === "vehiclePlate" && (this.showVehiclePlate = i.visible);
   }
   togglePause(i) {
-    this.isPaused = i, this.isPaused ? cancelAnimationFrame(this.rafSignal) : this.rafSignal = requestAnimationFrame(() => this.render());
+    this.isPaused = i, this.isPaused && this.rafSignal ? cancelAnimationFrame(this.rafSignal) : this.rafSignal = requestAnimationFrame(() => this.render());
   }
   updatePanelContent(i) {
     console.log(i);
@@ -139,11 +198,11 @@ class P {
     if (!t || !e || !e.isMoving && t.length <= 2)
       return;
     e.isMoving = !0, (e.graphic.getAttribute("roadLayer") || "1") === "1" ? e.graphic.visible = this.showGroundVehicle : e.graphic.visible = this.showElevatedVehicle, e.segmentStartTime || (e.segmentStartTime = Date.now(), e.segmentTotalTime = t[1].time - t[0].time);
-    const o = Date.now() - e.segmentStartTime, a = Math.min(
+    const r = Date.now() - e.segmentStartTime, o = Math.min(
       1,
-      o / e.segmentTotalTime
+      r / e.segmentTotalTime
     );
-    if (a === 1)
+    if (o === 1)
       if (t.shift(), t.length === 1) {
         e.waitForDelete ? (this.vehicleLayer.remove(e.graphic), this.vehicleObjectMap.delete(i), this.historyPositionMap.delete(i)) : (e.segmentStartTime = void 0, e.segmentTotalTime = void 0, e.graphic.visible = !1, e.isMoving = !1);
         return;
@@ -154,12 +213,12 @@ class P {
           y: t[0].pos[1]
         };
     else {
-      const h = t[0].pos[0] + (t[1].pos[0] - t[0].pos[0]) * a, l = t[0].pos[1] + (t[1].pos[1] - t[0].pos[1]) * a, n = t[0].heading + (t[1].heading - t[0].heading) * a;
+      const h = t[0].pos[0] + (t[1].pos[0] - t[0].pos[0]) * o, n = t[0].pos[1] + (t[1].pos[1] - t[0].pos[1]) * o, l = t[0].heading + (t[1].heading - t[0].heading) * o;
       e.graphic.geometry = {
         type: "point",
         x: h,
-        y: l
-      }, e.data.heading = n, e.graphic.symbol = this.createCIMSymbol(e.data);
+        y: n
+      }, e.data.heading = l, e.graphic.symbol = this.hasGpu ? this.createCIMSymbol(e.data) : this.createMarkerSymbol();
     }
   }
   /**
@@ -258,6 +317,17 @@ class P {
       }
     };
   }
+  createMarkerSymbol() {
+    return {
+      type: "simple-marker",
+      color: "green",
+      size: 5,
+      outline: {
+        color: "white",
+        width: 1
+      }
+    };
+  }
   /**
    * 根据车身颜色属性返回对应的车辆图标
    * @param carColor
@@ -351,5 +421,5 @@ class P {
   }
 }
 export {
-  P as default
+  v as default
 };

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

@@ -1,4 +1,4 @@
-import { IResult } from '../../../types';
+import { IEditSignalControlAreaParams, IResult, IShowSignalControlAreaParams } from '../../../types';
 export default class SignalControlAreaController {
     private view;
     private districtControllerLayer;
@@ -15,10 +15,7 @@ export default class SignalControlAreaController {
      * @param params
      * @returns
      */
-    showSignalControlArea(params: {
-        areaList: any[];
-        style?: string;
-    }): IResult;
+    showSignalControlArea(params: IShowSignalControlAreaParams): IResult;
     clearSignalControlArea(): IResult;
     locateSignalControlArea(params: {
         id: string;
@@ -47,12 +44,7 @@ export default class SignalControlAreaController {
      * 编辑子区的路口
      * @returns
      */
-    editSubSignalArea(crossIdsInDistrict: string[], addCrossCallback: (params: {
-        id: string;
-        name: string;
-    }) => void, removeCrossCallback: (params: {
-        id: string;
-    }) => void): Promise<IResult>;
+    editSubSignalControlArea(params: IEditSignalControlAreaParams): Promise<IResult>;
     /**
      * 从外部接口选中一个路口
      * @param id

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

@@ -1,14 +1,14 @@
-import * as g from "@arcgis/core/core/reactiveUtils.js";
-import h from "@arcgis/core/Graphic";
+import * as p from "@arcgis/core/core/reactiveUtils.js";
+import n from "@arcgis/core/Graphic";
 import y from "@arcgis/core/layers/GraphicsLayer";
-import p from "@turf/buffer";
-import b from "@turf/convex";
-import * as l from "@turf/helpers";
-import d from "axios";
+import d from "@turf/buffer";
+import g from "@turf/convex";
+import * as a from "@turf/helpers";
+import b from "axios";
 import f from "concaveman";
 import C from "../../stores/index.mjs";
 import v from "./district-controller.mjs";
-class N {
+class P {
   constructor(e) {
     var i;
     this.crossScale = 5e3, this.crossIdsInDistrict = [], this.view = e;
@@ -48,7 +48,7 @@ class N {
       );
       this.drawArea(r, !0);
     }
-    return this.scaleWatcher = g.watch(
+    return this.scaleWatcher = p.watch(
       () => this.view.scale,
       (t, r) => {
         t > this.crossScale && r <= this.crossScale ? (this.crossLayer.graphics.forEach((i) => {
@@ -91,8 +91,8 @@ class N {
       return { status: 1, message: "请输入id" };
     this.highlightLayer.removeAll(), this.districtControllerLayer.visible = !1;
     const t = this.districtControllerLayer.graphics.filter((s) => s.getAttribute("id") === e.id).toArray().map((s) => {
-      const a = s.clone();
-      return a.symbol.style = "none", a;
+      const o = s.clone();
+      return o.symbol.style = "none", o;
     }), 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(
@@ -122,7 +122,7 @@ class N {
     this.crossLayer.removeAll(), this.crossLayer.visible = !0;
     const r = e.children.map((i) => {
       const s = { ...i, selected: !0 };
-      return new h({
+      return new n({
         geometry: {
           type: "point",
           x: i.longitude,
@@ -144,7 +144,7 @@ class N {
     const r = (s = (await this.view.hitTest(e, {
       include: [this.crossLayer]
     })).results) == null ? void 0 : s.filter(
-      (a) => a.type === "graphic"
+      (o) => o.type === "graphic"
     );
     if (r.length === 0)
       return;
@@ -164,7 +164,7 @@ class N {
    * @returns
    */
   async showNearbyCrosses(e) {
-    const t = await d.get(
+    const t = await b.get(
       `http://${this.openDriveServer}/api/computable/getRelatedJunctionsForJunction`,
       { params: { junctionIds: e } }
     );
@@ -172,12 +172,18 @@ class N {
       if (t.data.status === 0) {
         const r = t.data.result, i = [];
         for (const s of r) {
-          const { junctionId: a } = s;
-          if (s.signalId && !this.crossIdsInDistrict.includes(a) || this.crossLayer.graphics.some(
-            (n) => n.getAttribute("id") === a
+          const o = s.junctionId;
+          if (o.startsWith("-"))
+            continue;
+          if (s.signalId && !this.crossIdsInDistrict.includes(o)) {
+            console.log("不是此区控内的路口", o);
+            continue;
+          }
+          if (this.crossLayer.graphics.some(
+            (c) => c.getAttribute("id") === o
           ))
             continue;
-          const m = new h({
+          const m = new n({
             geometry: {
               type: "point",
               x: s.lon,
@@ -185,7 +191,7 @@ class N {
             },
             symbol: this.getCrossSymbolInSubDistrict(s),
             attributes: {
-              id: a,
+              id: o,
               name: s.name,
               signalId: s.signalId,
               selected: !1
@@ -203,9 +209,29 @@ class N {
    * 编辑子区的路口
    * @returns
    */
-  async editSubSignalArea(e, t, r) {
+  async editSubSignalControlArea(e) {
     if (this.openDriveServer) {
-      this.crossIdsInDistrict = e, this.addCrossCallback = t, this.removeCrossCallback = r, this.clickWatcher || (this.clickWatcher = this.view.on("click", async (s) => {
+      this.crossIdsInDistrict = e.crossesInArea.map((s) => s.id);
+      const t = a.featureCollection(
+        e.crossesInArea.map((s) => a.point([s.x, s.y]))
+      ), r = g(t);
+      r && (this.districtControllerLayer.removeAll(), this.districtControllerLayer.add(
+        new n({
+          geometry: {
+            type: "polygon",
+            rings: r.geometry.coordinates
+          },
+          symbol: {
+            type: "simple-fill",
+            style: "none",
+            outline: {
+              color: [61, 139, 249],
+              width: 3,
+              style: "long-dash"
+            }
+          }
+        })
+      )), this.addCrossCallback = e.addCrossCallback, this.removeCrossCallback = e.removeCrossCallback, this.clickWatcher || (this.clickWatcher = this.view.on("click", async (s) => {
         await this.handleViewClick(s);
       }));
       const i = this.crossLayer.graphics.toArray().map((s) => s.getAttribute("id")).join(",");
@@ -261,20 +287,20 @@ class N {
     if (r.length >= 2) {
       let s = null;
       if (r.length === 2)
-        s = l.lineString(r);
+        s = a.lineString(r);
       else {
         if (t) {
-          const c = l.featureCollection(
-            r.map((u) => l.point(u))
+          const h = a.featureCollection(
+            r.map((u) => a.point(u))
           );
-          s = b(c);
+          s = g(h);
         } else {
-          const c = f(r, 0.5);
-          c.length >= 4 && (s = l.polygon([c]));
+          const h = f(r, 0.5);
+          h.length >= 4 && (s = a.polygon([h]));
         }
-        s || (s = l.lineString(r));
+        s || (s = a.lineString(r));
       }
-      const a = p(
+      const o = d(
         s.geometry,
         // 区控面积更大，需要更大的缓冲半径
         t ? 200 : 30,
@@ -282,8 +308,8 @@ class N {
           units: "meters"
         }
       );
-      let o;
-      t ? o = [
+      let l;
+      t ? l = [
         {
           fieldName: "id",
           label: "区控编号"
@@ -296,7 +322,7 @@ class N {
           fieldName: "subDistrictCount",
           label: "子区数量"
         }
-      ] : o = [
+      ] : l = [
         {
           fieldName: "parentName",
           label: "所属区控"
@@ -314,10 +340,10 @@ class N {
         parentName: e.parentName,
         crossCount: e.crossCount,
         subDistrictCount: e.subDistrictCount
-      }, n = new h({
+      }, c = new n({
         geometry: {
           type: "polygon",
-          rings: a.geometry.coordinates
+          rings: o.geometry.coordinates
         },
         symbol: {
           type: "simple-fill",
@@ -335,18 +361,18 @@ class N {
           content: [
             {
               type: "fields",
-              fieldInfos: o
+              fieldInfos: l
             }
           ]
         }
       });
-      t ? this.districtControllerLayer.add(n) : this.subDistrictControllerLayer.add(n);
+      t ? this.districtControllerLayer.add(c) : this.subDistrictControllerLayer.add(c);
     }
     for (const s of e.subDistricts)
       this.drawArea(s, !1);
     const i = [];
     e.crosses.forEach((s) => {
-      const a = {
+      const o = {
         type: "cross",
         id: s.id,
         name: s.name,
@@ -357,14 +383,14 @@ class N {
         subDistrictId: t ? "" : e.id,
         subDistrictName: t ? "" : e.name,
         isKey: s.isKey
-      }, o = new h({
+      }, l = new n({
         geometry: {
           type: "point",
           x: s.longitude,
           y: s.latitude
         },
-        symbol: this.getCrossGraphicSymbol(a, "marker"),
-        attributes: a,
+        symbol: this.getCrossGraphicSymbol(o, "marker"),
+        attributes: o,
         popupTemplate: {
           title: s.name,
           content: [
@@ -392,7 +418,7 @@ class N {
           ]
         }
       });
-      i.push(o);
+      i.push(l);
     }), this.crossLayer.addMany(i);
   }
   /**
@@ -606,5 +632,5 @@ class N {
   }
 }
 export {
-  N as default
+  P as default
 };

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

@@ -270,3 +270,21 @@ export interface ISignalCountdownProps {
         rColor?: string;
     };
 }
+export interface IShowSignalControlAreaParams {
+    areaList: any[];
+    style?: string;
+}
+export interface IEditSignalControlAreaParams {
+    crossesInArea: {
+        id: string;
+        x: number;
+        y: number;
+    }[];
+    addCrossCallback: (params: {
+        id: string;
+        name: string;
+    }) => void;
+    removeCrossCallback: (params: {
+        id: string;
+    }) => void;
+}

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

@@ -1,6 +1,6 @@
 import MapView from '@arcgis/core/views/MapView';
 import SceneView from '@arcgis/core/views/SceneView';
-import { IFindSumoParams, ILaneNumberParams, ILayerVisibleParams, ILookAtParams, IMaskParam, IOverlayParam, IQueueLengthParams, ISetMapCameraParams, ISetMapCenterParams, IShowOpenDriveFromFileParams, ISignalCountdownProps, ISplitOpenDriveLaneParams, IStartCrossBufferParam, IToggleTrafficInfoParams, IUnselectSumoParams } from '../types';
+import { IEditSignalControlAreaParams, IFindSumoParams, ILaneNumberParams, ILayerVisibleParams, ILookAtParams, IMaskParam, IOverlayParam, IQueueLengthParams, ISetMapCameraParams, ISetMapCenterParams, IShowOpenDriveFromFileParams, IShowSignalControlAreaParams, ISignalCountdownProps, ISplitOpenDriveLaneParams, IStartCrossBufferParam, IToggleTrafficInfoParams, IUnselectSumoParams } from '../types';
 import HoloFlow from './utils/holo-flow';
 import MapInitializer from './utils/map-initializer';
 import OpenDriveRenderer from './utils/open-drive-renderer';
@@ -115,10 +115,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
         status: number;
         message: string;
     }>;
-    showSignalControlArea: (params: {
-        areaList: any[];
-        style?: string;
-    }) => import("../types").IResult;
+    showSignalControlArea: (params: IShowSignalControlAreaParams) => import("../types").IResult;
     clearSignalControlArea: () => void;
     locateSignalControlArea: (params: {
         id: string;
@@ -128,12 +125,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
     }) => Promise<import("../types").IResult>;
     resetHighlightSignalControlArea: () => import("../types").IResult;
     showSubSignalControlArea: (params: any) => import("../types").IResult;
-    editSubSignalControlArea: (crossIdsInDistrict: string[], addCrossCallback: (params: {
-        id: string;
-        name: string;
-    }) => void, removeCrossCallback: (params: {
-        id: string;
-    }) => void) => Promise<import("../types").IResult> | {
+    editSubSignalControlArea: (params: IEditSignalControlAreaParams) => Promise<import("../types").IResult> | {
         status: number;
         message: string;
     };

package/lib/src/gis-map/gis-map.vue.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("vue"),h=require("./stores/index.js");require("./style/index.css");const Me=require("./utils/holo-flow/index.js"),Ve=require("./utils/holo-flow/signal-countdown-panel.vue.js"),Ne=require("./utils/map-initializer.js"),O=require("./utils/open-drive-renderer/index.js"),b=require("./utils/overlay.js"),Be=require("./utils/queue-length.js"),A=require("./utils/road-config-tool/index.js"),L=require("./utils/signal-control-area-controller/index.js"),He=require("./utils/traffic-flow.js"),Pe={class:"gis-viewer"},Ee={style:{position:"absolute",bottom:"80px",left:"10px","z-index":"9999"}},ze=n.defineComponent({__name:"gis-map",props:{config:{},assetsRoot:{}},emits:["mapLoaded","markerClick","mapClick"],setup(D,{expose:T,emit:_}){const p=n.ref(null);let c,m,l,o,r,s,g,t,a;const f=n.ref(!1);h.registerStore();const I=h.default.useAppDataStore,C=n.reactive([]);n.onMounted(async()=>{if(!p.value)return;document.addEventListener("keydown",d=>{d.ctrlKey&&d.key==="i"&&(f.value=!f.value)});const e=n.getCurrentInstance(),{$gisviewerAssetsRoot:u}=e.appContext.config.globalProperties,i=await(await fetch(k.config)).json();i.assetsRoot=k.assetsRoot||u,I.mapConfig=i,m=new Ne.default,c=await m.initialize({container:p.value,mapConfig:i,markerClickCallback:(d,v,w,qe)=>{y("markerClick",d,v,w,qe)},mapClickCallback:(d,v,w)=>{y("mapClick",d,v,w)}}),r=new Me.default(c,C),await r.init(),y("mapLoaded")}),n.onUnmounted(()=>{a==null||a.clearSignalControlArea(),t==null||t.clearOpenDrive(),r.clearHoloTrace(),r.clearHoloSignal(),o==null||o.disconnectTrafficFlow()});const x=n.computed(()=>c),q=()=>{const e=h.default.useAppDataStore;e.saveTrackLog=!0},M=()=>{r.downloadTrackLog()},V=()=>{S("vehicleId")},N=()=>{S("plateNumber")},B=async e=>await m.setMapCenter(e),H=async e=>await m.setMapCamera(e),P=async e=>await m.lookAt(e),E=e=>m.setLayerVisibility(e),z=(e,u)=>m.requestCoordinateTransform(e,u),j=e=>{m.cancelCoordinateTransform(e)},Q=e=>{m.setMapZoomRange(e)},Z=e=>(l||(l=new A.default(c)),l.showLaneNumber(e)),K=()=>{l==null||l.clearLaneNumber()},U=async e=>(l||(l=new A.default(c)),await l.initializeSearch(e)),G=async()=>l==null?void 0:l.calCrossIndicatorArea(),J=async()=>{},W=async(e,u)=>{o||(o=new He.default(c)),o.connectTrafficFlow(e,u)},X=()=>{o==null||o.disconnectTrafficFlow()},Y=async e=>{r.handleVehicleTraceData(e)},F=()=>{r.clearHoloTrace()},R=e=>{r.setInterpolate(e)},$=async e=>{await r.handleSignalData(e)},ee=()=>{r.clearHoloSignal()},te=e=>{o==null||o.toggleTrafficInfo(e),r==null||r.toggleTrafficInfo(e)},ae=e=>{r==null||r.togglePause(e)},ne=e=>{o==null||o.toggleTrafficObject(e),r==null||r.toggleTrafficObject(e)},S=e=>{r==null||r.updatePanelContent(e)},re=async e=>(s||(s=new b.default(c)),s.addOverlays(e)),se=e=>(s||(s=new b.default(c)),s.addMask(e)),oe=()=>{s==null||s.removeMask()},ie=e=>s==null?void 0:s.removeOverlaysByType(e),ce=e=>s==null?void 0:s.removeOverlaysById(e),le=()=>s==null?void 0:s.removeAllOverlays(),ue=()=>{s==null||s.showAllOverlays()},me=e=>{g||(g=new Be.default(c)),g.updateQueueLength(e)},de=()=>{g==null||g.removeQueueLength()},ge=async(e,u)=>(t||(t=new O.default(c)),await t.showOpenDriveFromServer(e,u)),pe=async e=>(t||(t=new O.default(c)),await t.clearOpenDrive(),await t.showOpenDriveFromFile(e)),fe=async()=>await(t==null?void 0:t.clearOpenDrive()),Se=async e=>t?await(t==null?void 0:t.findSumo(e)):{status:-1,message:"未加载OpenDrive地图"},ye=async e=>t?t.selectSumo(e):{status:-1,message:"未加载OpenDrive地图"},ve=async e=>t?t.unselectSumo(e):{status:-1,message:"未加载OpenDrive地图"},we=async e=>t?await t.geometrySearch(e):{status:-1,message:"未加载OpenDrive地图"},he=async e=>t?await t.getSumoInfo(e):{status:-1,message:"未加载OpenDrive地图"},Ce=async e=>t?await(t==null?void 0:t.splitLane(e)):{status:-1,message:"未加载OpenDrive地图"},ke=async()=>t?t==null?void 0:t.clearSplitLane():{status:-1,message:"未加载OpenDrive地图"},Oe=e=>(a||(a=new L.default(c)),a.showSignalControlArea(e)),be=()=>{a==null||a.clearSignalControlArea()},Ae=async e=>a?await a.locateSignalControlArea(e):{status:-1,message:"未加载信号控制区"},Le=async e=>a?await a.highlightSignalControlArea(e):{status:-1,message:"未加载信号控制区"},De=()=>a?a.resetHighlight():{status:-1,message:"未加载信号控制区"},Te=e=>(a||(a=new L.default(c)),a.showSubSignalControlArea(e)),_e=(e,u,i)=>a?a.editSubSignalArea(e,u,i):{status:-1,message:"未加载信号控制区"},Ie=e=>a?a.selectSubSignalControlAreaCross(e):{status:-1,message:"未加载信号控制区"},xe=e=>a?a.unselectSubSignalControlAreaCross(e):{status:-1,message:"未加载信号控制区"},k=D,y=_;return T({mapViewer:x,setLayerVisibility:E,setMapCenter:B,lookAt:P,setMapCamera:H,setMapZoomRange:Q,requestCoordinateTransform:z,cancelCoordinateTransform:j,addOverlays:re,addMask:se,removeMask:oe,showAllOverlays:ue,removeOverlaysByType:ie,removeOverlaysById:ce,removeAllOverlays:le,showLaneNumber:Z,clearLaneNumber:K,initializeAreaTool:U,calCrossIndicatorArea:G,calRoadIndicatorArea:J,connectCarFlow:W,disconnectCarFlow:X,handleHoloVehicleTraceData:Y,clearHoloTrace:F,handleHoloSignalData:$,clearHoloSignal:ee,setInterpolate:R,toggleTrafficInfo:te,toggleTrafficObject:ne,toggleVehicleInfo:S,togglePause:ae,updateQueueLength:me,removeQueueLength:de,showOpenDriveFromServer:ge,showOpenDriveFromFile:pe,clearOpenDrive:fe,geometrySearchInOpenDrive:we,findSumoInOpenDrive:Se,selectSumoInOpenDrive:ye,unselectSumoInOpenDrive:ve,getSumoInfo:he,splitOpenDriveLane:Ce,clearSplitOpenDriveLane:ke,showSignalControlArea:Oe,clearSignalControlArea:be,locateSignalControlArea:Ae,highlightSignalControlArea:Le,resetHighlightSignalControlArea:De,showSubSignalControlArea:Te,editSubSignalControlArea:_e,selectSubSignalControlAreaCross:Ie,unselectSubSignalControlAreaCross:xe}),(e,u)=>(n.openBlock(),n.createElementBlock("div",Pe,[n.createElementVNode("div",{class:"gis-viewer-main",ref_key:"mapContainer",ref:p},[n.withDirectives(n.createElementVNode("div",Ee,[n.createElementVNode("button",{style:{"margin-right":"10px"},onClick:q}," 开始记录 "),n.createElementVNode("button",{style:{"margin-right":"10px"},onClick:M}," 下载日志 "),n.createElementVNode("button",{style:{"margin-right":"10px"},onClick:V}," 显示车辆id "),n.createElementVNode("button",{onClick:N},"显示车辆号牌")],512),[[n.vShow,f.value]])],512),(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(C,(i,d)=>(n.openBlock(),n.createBlock(Ve.default,{key:d,"display-mode":i.displayMode,"road-id":i.crossId,"cross-id":i.roadId,"map-point":i.mapPoint,"stop-line":i.stopLine,position:i.position,rotation:i.rotation,scale:i.scale,"lamp-status":i.lampStatus},null,8,["display-mode","road-id","cross-id","map-point","stop-line","position","rotation","scale","lamp-status"]))),128))]))}});exports.default=ze;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("vue"),h=require("./stores/index.js");require("./style/index.css");const Me=require("./utils/holo-flow/index.js"),Ve=require("./utils/holo-flow/signal-countdown-panel.vue.js"),Ne=require("./utils/map-initializer.js"),O=require("./utils/open-drive-renderer/index.js"),b=require("./utils/overlay.js"),Be=require("./utils/queue-length.js"),A=require("./utils/road-config-tool/index.js"),L=require("./utils/signal-control-area-controller/index.js"),He=require("./utils/traffic-flow.js"),Pe={class:"gis-viewer"},Ee={style:{position:"absolute",bottom:"80px",left:"10px","z-index":"9999"}},ze=n.defineComponent({__name:"gis-map",props:{config:{},assetsRoot:{}},emits:["mapLoaded","markerClick","mapClick"],setup(D,{expose:T,emit:_}){const p=n.ref(null);let i,u,l,o,r,s,g,t,a;const f=n.ref(!1);h.registerStore();const I=h.default.useAppDataStore,C=n.reactive([]);n.onMounted(async()=>{if(!p.value)return;document.addEventListener("keydown",d=>{d.ctrlKey&&d.key==="i"&&(f.value=!f.value)});const e=n.getCurrentInstance(),{$gisviewerAssetsRoot:m}=e.appContext.config.globalProperties,c=await(await fetch(k.config)).json();c.assetsRoot=k.assetsRoot||m,I.mapConfig=c,u=new Ne.default,i=await u.initialize({container:p.value,mapConfig:c,markerClickCallback:(d,v,w,qe)=>{y("markerClick",d,v,w,qe)},mapClickCallback:(d,v,w)=>{y("mapClick",d,v,w)}}),r=new Me.default(i,C),await r.init(),y("mapLoaded")}),n.onUnmounted(()=>{a==null||a.clearSignalControlArea(),t==null||t.clearOpenDrive(),r.clearHoloTrace(),r.clearHoloSignal(),o==null||o.disconnectTrafficFlow()});const x=n.computed(()=>i),q=()=>{const e=h.default.useAppDataStore;e.saveTrackLog=!0},M=()=>{r.downloadTrackLog()},V=()=>{S("vehicleId")},N=()=>{S("plateNumber")},B=async e=>await u.setMapCenter(e),H=async e=>await u.setMapCamera(e),P=async e=>await u.lookAt(e),E=e=>u.setLayerVisibility(e),z=(e,m)=>u.requestCoordinateTransform(e,m),j=e=>{u.cancelCoordinateTransform(e)},Q=e=>{u.setMapZoomRange(e)},Z=e=>(l||(l=new A.default(i)),l.showLaneNumber(e)),K=()=>{l==null||l.clearLaneNumber()},U=async e=>(l||(l=new A.default(i)),await l.initializeSearch(e)),G=async()=>l==null?void 0:l.calCrossIndicatorArea(),J=async()=>{},W=async(e,m)=>{o||(o=new He.default(i)),o.connectTrafficFlow(e,m)},X=()=>{o==null||o.disconnectTrafficFlow()},Y=async e=>{r.handleVehicleTraceData(e)},F=()=>{r.clearHoloTrace()},R=e=>{r.setInterpolate(e)},$=async e=>{await r.handleSignalData(e)},ee=()=>{r.clearHoloSignal()},te=e=>{o==null||o.toggleTrafficInfo(e),r==null||r.toggleTrafficInfo(e)},ae=e=>{r==null||r.togglePause(e)},ne=e=>{o==null||o.toggleTrafficObject(e),r==null||r.toggleTrafficObject(e)},S=e=>{r==null||r.updatePanelContent(e)},re=async e=>(s||(s=new b.default(i)),s.addOverlays(e)),se=e=>(s||(s=new b.default(i)),s.addMask(e)),oe=()=>{s==null||s.removeMask()},ie=e=>s==null?void 0:s.removeOverlaysByType(e),ce=e=>s==null?void 0:s.removeOverlaysById(e),le=()=>s==null?void 0:s.removeAllOverlays(),ue=()=>{s==null||s.showAllOverlays()},me=e=>{g||(g=new Be.default(i)),g.updateQueueLength(e)},de=()=>{g==null||g.removeQueueLength()},ge=async(e,m)=>(t||(t=new O.default(i)),await t.showOpenDriveFromServer(e,m)),pe=async e=>(t||(t=new O.default(i)),await t.clearOpenDrive(),await t.showOpenDriveFromFile(e)),fe=async()=>await(t==null?void 0:t.clearOpenDrive()),Se=async e=>t?await(t==null?void 0:t.findSumo(e)):{status:-1,message:"未加载OpenDrive地图"},ye=async e=>t?t.selectSumo(e):{status:-1,message:"未加载OpenDrive地图"},ve=async e=>t?t.unselectSumo(e):{status:-1,message:"未加载OpenDrive地图"},we=async e=>t?await t.geometrySearch(e):{status:-1,message:"未加载OpenDrive地图"},he=async e=>t?await t.getSumoInfo(e):{status:-1,message:"未加载OpenDrive地图"},Ce=async e=>t?await(t==null?void 0:t.splitLane(e)):{status:-1,message:"未加载OpenDrive地图"},ke=async()=>t?t==null?void 0:t.clearSplitLane():{status:-1,message:"未加载OpenDrive地图"},Oe=e=>(a||(a=new L.default(i)),a.showSignalControlArea(e)),be=()=>{a==null||a.clearSignalControlArea()},Ae=async e=>a?await a.locateSignalControlArea(e):{status:-1,message:"未加载信号控制区"},Le=async e=>a?await a.highlightSignalControlArea(e):{status:-1,message:"未加载信号控制区"},De=()=>a?a.resetHighlight():{status:-1,message:"未加载信号控制区"},Te=e=>(a||(a=new L.default(i)),a.showSubSignalControlArea(e)),_e=e=>a?a.editSubSignalControlArea(e):{status:-1,message:"未加载信号控制区"},Ie=e=>a?a.selectSubSignalControlAreaCross(e):{status:-1,message:"未加载信号控制区"},xe=e=>a?a.unselectSubSignalControlAreaCross(e):{status:-1,message:"未加载信号控制区"},k=D,y=_;return T({mapViewer:x,setLayerVisibility:E,setMapCenter:B,lookAt:P,setMapCamera:H,setMapZoomRange:Q,requestCoordinateTransform:z,cancelCoordinateTransform:j,addOverlays:re,addMask:se,removeMask:oe,showAllOverlays:ue,removeOverlaysByType:ie,removeOverlaysById:ce,removeAllOverlays:le,showLaneNumber:Z,clearLaneNumber:K,initializeAreaTool:U,calCrossIndicatorArea:G,calRoadIndicatorArea:J,connectCarFlow:W,disconnectCarFlow:X,handleHoloVehicleTraceData:Y,clearHoloTrace:F,handleHoloSignalData:$,clearHoloSignal:ee,setInterpolate:R,toggleTrafficInfo:te,toggleTrafficObject:ne,toggleVehicleInfo:S,togglePause:ae,updateQueueLength:me,removeQueueLength:de,showOpenDriveFromServer:ge,showOpenDriveFromFile:pe,clearOpenDrive:fe,geometrySearchInOpenDrive:we,findSumoInOpenDrive:Se,selectSumoInOpenDrive:ye,unselectSumoInOpenDrive:ve,getSumoInfo:he,splitOpenDriveLane:Ce,clearSplitOpenDriveLane:ke,showSignalControlArea:Oe,clearSignalControlArea:be,locateSignalControlArea:Ae,highlightSignalControlArea:Le,resetHighlightSignalControlArea:De,showSubSignalControlArea:Te,editSubSignalControlArea:_e,selectSubSignalControlAreaCross:Ie,unselectSubSignalControlAreaCross:xe}),(e,m)=>(n.openBlock(),n.createElementBlock("div",Pe,[n.createElementVNode("div",{class:"gis-viewer-main",ref_key:"mapContainer",ref:p},[n.withDirectives(n.createElementVNode("div",Ee,[n.createElementVNode("button",{style:{"margin-right":"10px"},onClick:q}," 开始记录 "),n.createElementVNode("button",{style:{"margin-right":"10px"},onClick:M}," 下载日志 "),n.createElementVNode("button",{style:{"margin-right":"10px"},onClick:V}," 显示车辆id "),n.createElementVNode("button",{onClick:N},"显示车辆号牌")],512),[[n.vShow,f.value]])],512),(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(C,(c,d)=>(n.openBlock(),n.createBlock(Ve.default,{key:d,"display-mode":c.displayMode,"road-id":c.crossId,"cross-id":c.roadId,"map-point":c.mapPoint,"stop-line":c.stopLine,position:c.position,rotation:c.rotation,scale:c.scale,"lamp-status":c.lampStatus},null,8,["display-mode","road-id","cross-id","map-point","stop-line","position","rotation","scale","lamp-status"]))),128))]))}});exports.default=ze;

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

@@ -104,10 +104,7 @@ export declare const GisMap: import("@easyest/utils/dist/lib/withinstall").SFCWi
         status: number;
         message: string;
     }>;
-    showSignalControlArea: (params: {
-        areaList: any[];
-        style?: string | undefined;
-    }) => import("../types").IResult;
+    showSignalControlArea: (params: import("../types").IShowSignalControlAreaParams) => import("../types").IResult;
     clearSignalControlArea: () => void;
     locateSignalControlArea: (params: {
         id: string;
@@ -117,12 +114,7 @@ export declare const GisMap: import("@easyest/utils/dist/lib/withinstall").SFCWi
     }) => Promise<import("../types").IResult>;
     resetHighlightSignalControlArea: () => import("../types").IResult;
     showSubSignalControlArea: (params: any) => import("../types").IResult;
-    editSubSignalControlArea: (crossIdsInDistrict: string[], addCrossCallback: (params: {
-        id: string;
-        name: string;
-    }) => void, removeCrossCallback: (params: {
-        id: string;
-    }) => void) => Promise<import("../types").IResult> | {
+    editSubSignalControlArea: (params: import("../types").IEditSignalControlAreaParams) => Promise<import("../types").IResult> | {
         status: number;
         message: string;
     };

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

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const P=require("@arcgis/core/core/reactiveUtils"),u=require("@arcgis/core/geometry"),g=require("@arcgis/core/geometry/support/webMercatorUtils.js"),m=require("@arcgis/core/layers/GraphicsLayer"),y=require("./signal-holo-flow.js");function w(f){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(f){for(const i in f)if(i!=="default"){const l=Object.getOwnPropertyDescriptor(f,i);Object.defineProperty(t,i,l.get?l:{enumerable:!0,get:()=>f[i]})}}return t.default=f,Object.freeze(t)}const L=w(P),d=w(g);class M extends y.default{constructor(t,i){super(t),this.stopLineLayer=new m,this.watchHandle=null,this.stopLineMap=new Map,this.countdownPanelProps=i,this.view.map.add(this.stopLineLayer)}async initializeLayer(){var p,c;console.time("初始化停止线图层");let t=(c=(p=this.mapConfig.holoFlow)==null?void 0:p.signal)==null?void 0:c.stopLineLayer;if(!t)return;t=this.mapConfig.assetsRoot+"/"+t,(await(await fetch(t)).json()).features.forEach(o=>{const{roadId:n,nodeId:e,angle:a,destinationPoint:s}=o.properties,{coordinates:r}=o.geometry,h=this.stopLineMap.get(e);h?h.set(n,{coord:r,panelPoint:s,angle:a}):this.stopLineMap.set(e,new Map([[n,{coord:r,panelPoint:s,angle:a}]]))}),console.timeEnd("初始化停止线图层")}getPanelScale(){const t=this.view.scale;let i=1;return t<1e3?i=1:t<2e3?i=.8:t<4e3?i=.4:i=0,i}async handleSignalData(t){this.watchHandle||(this.watchHandle=L.watch(()=>this.view.extent,()=>{const o=this.getPanelScale();for(const n of this.countdownPanelProps){o!==this.currentPanelScale&&(n.scale=o);const{mapPoint:e}=n;let a=new u.Point({x:e[0],y:e[1]});this.view.spatialReference.isWebMercator&&(a=d.geographicToWebMercator(a));const s=this.view.toScreen(a);if(n.position.left=s.x,n.position.top=s.y,this.view.type==="3d"){const r=this.getPanelRotation(n.stopLine);n.rotation=r}}this.currentPanelScale=o}));const i=t.crossId,l=this.stopLineMap.get(i);if(!l)return;const p=t.phaseCountDownList,c=new Map;for(const o of p){let n="";for(let r of o.roadIdList)if(r.startsWith("-")&&(r=r.slice(1)),l.has(r)){n=r;break}if(!n)continue;let e=c.get(n);if(e||(e={},c.set(n,e)),!o.direction){console.log(`没有找到对应的方向${i}--${JSON.stringify(o)}`);continue}const a=o.direction.toLowerCase(),s=o.color===1?"red":o.color===2?"yellow":"green";a==="u"?(e.uNumber=o.leftTime,e.uColor=s):a==="l"?(e.lNumber=o.leftTime,e.lColor=s):a==="s"?(e.sNumber=o.leftTime,e.sColor=s):a==="r"&&(e.rNumber=o.leftTime,e.rColor=s)}c.forEach((o,n)=>{const e=l.get(n);if(!e)return;const a=this.countdownPanelProps.find(s=>s.crossId===i&&s.roadId===n);if(a)a.lampStatus=o;else{let s=new u.Point({x:e.panelPoint[0],y:e.panelPoint[1]});this.view.spatialReference.isWebMercator&&(s=d.geographicToWebMercator(s));const r=this.view.toScreen(s),h=this.getPanelRotation(e.coord);console.log(n,h),this.countdownPanelProps.push({displayMode:"complex",crossId:i,roadId:n,mapPoint:e.panelPoint,stopLine:e.coord,position:{left:r.x,top:r.y},rotation:h,scale:this.getPanelScale(),lampStatus:o})}})}clearSignal(){var t;this.stopLineLayer.removeAll(),this.countdownPanelProps.length=0,(t=this.watchHandle)==null||t.remove(),this.watchHandle=null}getPanelRotation(t){const i=t[0];let l=new u.Point({x:i[0],y:i[1]});this.view.spatialReference.isWebMercator&&(l=d.geographicToWebMercator(l));const p=this.view.toScreen(l),c=t[t.length-1];let o=new u.Point({x:c[0],y:c[1]});this.view.spatialReference.isWebMercator&&(o=d.geographicToWebMercator(o));const n=this.view.toScreen(o),e=n.x-p.x,a=n.y-p.y;return Math.atan2(a,e)*(180/Math.PI)}}exports.default=M;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const P=require("@arcgis/core/core/reactiveUtils"),d=require("@arcgis/core/geometry"),g=require("@arcgis/core/geometry/support/webMercatorUtils.js"),m=require("@arcgis/core/layers/GraphicsLayer"),y=require("./signal-holo-flow.js");function w(f){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(f){for(const n in f)if(n!=="default"){const l=Object.getOwnPropertyDescriptor(f,n);Object.defineProperty(t,n,l.get?l:{enumerable:!0,get:()=>f[n]})}}return t.default=f,Object.freeze(t)}const L=w(P),u=w(g);class M extends y.default{constructor(t,n){super(t),this.stopLineLayer=new m,this.watchHandle=null,this.stopLineMap=new Map,this.countdownPanelProps=n,this.view.map.add(this.stopLineLayer)}async initializeLayer(){var p,c;console.time("初始化停止线图层");let t=(c=(p=this.mapConfig.holoFlow)==null?void 0:p.signal)==null?void 0:c.stopLineLayer;if(!t)return;t=this.mapConfig.assetsRoot+"/"+t,(await(await fetch(t)).json()).features.forEach(o=>{const{roadId:i,nodeId:e,angle:a,destinationPoint:s}=o.properties,{coordinates:r}=o.geometry,h=this.stopLineMap.get(e);h?h.set(i,{coord:r,panelPoint:s,angle:a}):this.stopLineMap.set(e,new Map([[i,{coord:r,panelPoint:s,angle:a}]]))}),console.timeEnd("初始化停止线图层")}getPanelScale(){const t=this.view.scale;let n=1;return t<1e3?n=1:t<2e3?n=.8:t<4e3?n=.4:n=0,n}async handleSignalData(t){this.watchHandle||(this.watchHandle=L.watch(()=>this.view.extent,()=>{const o=this.getPanelScale();for(const i of this.countdownPanelProps){o!==this.currentPanelScale&&(i.scale=o);const{mapPoint:e}=i;let a=new d.Point({x:e[0],y:e[1]});this.view.spatialReference.isWebMercator&&(a=u.geographicToWebMercator(a));const s=this.view.toScreen(a);if(i.position.left=s.x,i.position.top=s.y,this.view.type==="3d"){const r=this.getPanelRotation(i.stopLine);i.rotation=r}}this.currentPanelScale=o}));const n=t.crossId,l=this.stopLineMap.get(n);if(!l)return;const p=t.phaseCountDownList,c=new Map;for(const o of p){let i="";for(let r of o.roadIdList)if(r.startsWith("-")&&(r=r.slice(1)),l.has(r)){i=r;break}if(!i)continue;let e=c.get(i);if(e||(e={},c.set(i,e)),!o.direction){console.log(`没有找到对应的方向${n}--${JSON.stringify(o)}`);continue}const a=o.direction.toLowerCase(),s=o.color===1?"red":o.color===2?"yellow":"green";a==="u"?(e.uNumber=o.leftTime,e.uColor=s):a==="l"?(e.lNumber=o.leftTime,e.lColor=s):a==="s"?(e.sNumber=o.leftTime,e.sColor=s):a==="r"&&(e.rNumber=o.leftTime,e.rColor=s)}c.forEach((o,i)=>{const e=l.get(i);if(!e)return;const a=this.countdownPanelProps.find(s=>s.crossId===n&&s.roadId===i);if(a)a.lampStatus=o;else{let s=new d.Point({x:e.panelPoint[0],y:e.panelPoint[1]});this.view.spatialReference.isWebMercator&&(s=u.geographicToWebMercator(s));const r=this.view.toScreen(s),h=this.getPanelRotation(e.coord);this.countdownPanelProps.push({displayMode:"complex",crossId:n,roadId:i,mapPoint:e.panelPoint,stopLine:e.coord,position:{left:r.x,top:r.y},rotation:h,scale:this.getPanelScale(),lampStatus:o})}})}clearSignal(){var t;this.stopLineLayer.removeAll(),this.countdownPanelProps.length=0,(t=this.watchHandle)==null||t.remove(),this.watchHandle=null}getPanelRotation(t){const n=t[0];let l=new d.Point({x:n[0],y:n[1]});this.view.spatialReference.isWebMercator&&(l=u.geographicToWebMercator(l));const p=this.view.toScreen(l),c=t[t.length-1];let o=new d.Point({x:c[0],y:c[1]});this.view.spatialReference.isWebMercator&&(o=u.geographicToWebMercator(o));const i=this.view.toScreen(o),e=i.x-p.x,a=i.y-p.y;return Math.atan2(a,e)*(180/Math.PI)}}exports.default=M;

package/lib/src/gis-map/utils/holo-flow/trace-renderer-layer.d.ts

@@ -3,10 +3,15 @@ export default class TraceRendererLayer implements ITraceRendererInterface {
     private view;
     private readonly vehicleLayer;
     private mapConfig;
+    private hasGpu;
     private rafSignal;
     private appDataStore;
     private logTable;
     constructor(view: __esri.MapView);
+    private getRendererText;
+    private em;
+    private el;
+    private getGpuText;
     getLog(): (string | number)[][];
     init(): Promise<void>;
     private needInterpolate;
@@ -45,6 +50,7 @@ export default class TraceRendererLayer implements ITraceRendererInterface {
      * @returns
      */
     private createCIMSymbol;
+    private createMarkerSymbol;
     /**
      * 根据车身颜色属性返回对应的车辆图标
      * @param carColor

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

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("@arcgis/core/Graphic"),p=require("@arcgis/core/layers/GraphicsLayer"),g=require("vue"),m=require("../../stores/index.js");class y{constructor(i){this.appDataStore=m.default.useAppDataStore,this.logTable=[["uuid","ptcId","plateno","timestamp","localTimestamp","timestamp_str","speed","laneNo","objHeight","objLength","latitude","longitude","ptcType","vehicleType","vehicleColor","plateColor","sbdm","heading","fixAngle","roadLayer","status","step","receiveTimestamp"]],this.needInterpolate=!0,this.isPaused=!1,this.showVehiclePlate=!1,this.showGroundVehicle=!0,this.showElevatedVehicle=!0,this.historyPositionMap=new Map,this.vehicleObjectMap=new Map,this.view=i,this.mapConfig=g.toRaw(this.appDataStore.mapConfig),this.vehicleLayer=new p({id:"vehicleLayer"}),this.view.map.add(this.vehicleLayer),this.rafSignal=requestAnimationFrame(()=>this.render())}getLog(){return this.logTable}async init(){}addVehicles(i){return new Promise(t=>{if(this.isPaused){t();return}const e=i.map(s=>{const{vehicleId:o,heading:a,localTimestamp:c}=s,l=Number(s.x),n=Number(s.y);this.historyPositionMap.set(o,[{pos:[l,n,0],heading:a,time:c}]);const r=new h({geometry:{type:"point",x:l,y:n},attributes:{...s,type:"trackVehicle"},symbol:this.createCIMSymbol(s)});return r.visible=!1,this.vehicleObjectMap.set(o,{graphic:r,data:s,waitForDelete:!1,isMoving:!1}),r});this.vehicleLayer.addMany(e),t()})}updateVehicles(i){return new Promise(t=>{if(this.isPaused){t();return}const e=[];i.forEach(s=>{const{vehicleId:o,heading:a,localTimestamp:c}=s,l=Number(s.x),n=Number(s.y),r=this.vehicleObjectMap.get(o);r?(r.data=s,r.graphic.attributes={...s,type:"trackVehicle"},this.historyPositionMap.get(o).push({pos:[l,n,0],heading:a,time:c})):e.push(s)}),this.addVehicles(e),t()})}deleteVehicles(i){this.isPaused||i.forEach(t=>{const e=this.vehicleObjectMap.get(t);e&&(e.waitForDelete=!0)})}clearVehicles(){this.vehicleLayer.removeAll(),this.vehicleObjectMap.clear(),this.historyPositionMap.clear()}toggleGroundVehicle(i){this.showGroundVehicle=i}toggleElevatedVehicle(i){this.showElevatedVehicle=i}toggleTrafficInfo(i){i.name==="vehiclePlate"&&(this.showVehiclePlate=i.visible)}togglePause(i){this.isPaused=i,this.isPaused?cancelAnimationFrame(this.rafSignal):this.rafSignal=requestAnimationFrame(()=>this.render())}updatePanelContent(i){console.log(i)}setInterpolate(i){this.needInterpolate=i}render(){this.isPaused||this.vehicleObjectMap.forEach((i,t)=>{this.updatePosition(t)}),this.rafSignal=requestAnimationFrame(()=>this.render())}updatePosition(i){const t=this.historyPositionMap.get(i),e=this.vehicleObjectMap.get(i);if(!t||!e||!e.isMoving&&t.length<=2)return;e.isMoving=!0,(e.graphic.getAttribute("roadLayer")||"1")==="1"?e.graphic.visible=this.showGroundVehicle:e.graphic.visible=this.showElevatedVehicle,e.segmentStartTime||(e.segmentStartTime=Date.now(),e.segmentTotalTime=t[1].time-t[0].time);const o=Date.now()-e.segmentStartTime,a=Math.min(1,o/e.segmentTotalTime);if(a===1)if(t.shift(),t.length===1){e.waitForDelete?(this.vehicleLayer.remove(e.graphic),this.vehicleObjectMap.delete(i),this.historyPositionMap.delete(i)):(e.segmentStartTime=void 0,e.segmentTotalTime=void 0,e.graphic.visible=!1,e.isMoving=!1);return}else e.segmentStartTime=Date.now(),e.segmentTotalTime=t[1].time-t[0].time,Math.abs(t[1].heading-t[0].heading)>180&&(t[1].heading>t[0].heading?t[0].heading+=360:t[1].heading+=360),e.graphic.geometry={type:"point",x:t[0].pos[0],y:t[0].pos[1]};else{const c=t[0].pos[0]+(t[1].pos[0]-t[0].pos[0])*a,l=t[0].pos[1]+(t[1].pos[1]-t[0].pos[1])*a,n=t[0].heading+(t[1].heading-t[0].heading)*a;e.graphic.geometry={type:"point",x:c,y:l},e.data.heading=n,e.graphic.symbol=this.createCIMSymbol(e.data)}}createCIMSymbol(i){const t=this.getPlateFontColor(i.plateColor),e=this.getCarPic(i.vehicleColor,i.speed);return{type:"cim",data:{type:"CIMSymbolReference",primitiveOverrides:[{type:"CIMPrimitiveOverride",primitiveName:"textGraphic",propertyName:"TextString",valueExpressionInfo:{type:"CIMExpressionInfo",title:"Custom",expression:"$feature.showName",returnType:"Default"}}],symbol:{type:"CIMPointSymbol",symbolLayers:[{type:"CIMVectorMarker",enable:this.showVehiclePlate,size:32,colorLocked:!0,anchorPointUnits:"Relative",frame:{xmin:-8,ymin:-8,xmax:8,ymax:8},markerGraphics:[{type:"CIMMarkerGraphic",primitiveName:"textGraphic",geometry:{x:0,y:0},symbol:{type:"CIMTextSymbol",height:4,horizontalAlignment:"Center",offsetX:0,offsetY:8,haloSize:1,haloSymbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:t.backgroundColor}]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:t.fillColor}]},verticalAlignment:"Center"},textString:""}],scaleSymbolsProportionally:!0,respectFrame:!0},{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:e.size,rotation:i.heading,rotateClockwise:!0,textureFilter:"Picture",url:`${this.mapConfig.assetsRoot}Images/${e.pic}`}]}}}}getCarPic(i,t){if(this.view.scale>=1e3){let e="point_green.png";return t&&(t<=4.2?e="point_red.png":t<=8.4?e="point_yellow.png":e="point_green.png"),{pic:e,size:15}}else{let e="grey";switch(typeof i=="string"&&(i=i.toLowerCase()),i){case"a":case 1:e="white";break;case"b":case 2:e="grey";break;case"c":case 3:e="yellow";break;case"d":case 4:e="pink";break;case"e":case 5:e="red";break;case"f":case 10:e="purple";break;case"g":case 6:e="green";break;case"h":case 7:e="blue";break;case"i":case 8:e="brown";break;case"j":case 9:e="black";break}return{pic:"/car/"+e+".png",size:20}}}getPlateFontColor(i){let t=[255,255,255,255],e=[169,169,169,255];switch(i){case 0:t=[0,0,0,255],e=[255,255,255,255];break;case 1:t=[0,0,0,255],e=[244,164,96,255];break;case 2:t=[255,255,255,255],e=[65,105,225,255];break;case 3:t=[255,255,255,255],e=[0,0,0,255];break;case 15:t=[244,164,96,255],e=[0,250,154,255];break;case 16:t=[0,0,0,255],e=[0,250,154,255];break}return{fillColor:t,backgroundColor:e}}}exports.default=y;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("@arcgis/core/Graphic"),g=require("@arcgis/core/layers/GraphicsLayer"),m=require("vue"),u=require("../../stores/index.js");class y{constructor(i){this.hasGpu=!1,this.appDataStore=u.default.useAppDataStore,this.logTable=[["uuid","ptcId","plateno","timestamp","localTimestamp","timestamp_str","speed","laneNo","objHeight","objLength","latitude","longitude","ptcType","vehicleType","vehicleColor","plateColor","sbdm","heading","fixAngle","roadLayer","status","step","receiveTimestamp"]],this.needInterpolate=!0,this.isPaused=!1,this.showVehiclePlate=!1,this.showGroundVehicle=!0,this.showElevatedVehicle=!0,this.historyPositionMap=new Map,this.vehicleObjectMap=new Map,this.view=i,this.mapConfig=m.toRaw(this.appDataStore.mapConfig),this.vehicleLayer=new g({id:"vehicleLayer"}),this.view.map.add(this.vehicleLayer);const t=this.getRendererText(),e=this.getGpuText(t);this.hasGpu=e!=="Unknown",this.hasGpu&&(this.rafSignal=requestAnimationFrame(()=>this.render())),console.log("rendererText: ",t),console.log("gpuText: ",e)}getRendererText(){try{const i=document.createElement("canvas"),t=i.getContext("webgl")||i.getContext("experimental-webgl");if(!t)return"Unknown";const e=t.getExtension("WEBGL_debug_renderer_info");return e&&t.getParameter(e.UNMASKED_RENDERER_WEBGL)||"Unknown"}catch{return"Unknown"}}em(i){const t=[],e=i.split("");for(let s=0;s<e.length;s++)if(e[s]==="(")t.push(s);else if(e[s]===")"){const r=t.pop();r!==void 0&&(e.splice(r,s-r+1),s=r-1)}return e.join("")}el(i){return this.em(i).replace(/\/PCIe\/SSE2/g,"").replace(/\s+/g," ").trim()}getGpuText(i){try{if(/, or similar$/.test(i)||/SwiftShader/.test(i))return"Unknown";if(/^ANGLE/.test(i)){const t=i.match(/\((.+)\)$/);if(t){const e=t[1],s=e.split(/,\s*/g);let r=s[1];return/^ANGLE Metal Renderer: /.test(r)&&(r=i.split(": ")[1].split(",")[0]),s.length===1&&(r=s[0].split(" ").slice(1).join(" ")),/Direct3D/.test(r)&&(r=r.split("Direct3D")[0].trim()),r}}}catch{return"Unknown"}return this.el(i)}getLog(){return this.logTable}async init(){}addVehicles(i){return new Promise(t=>{if(this.isPaused){t();return}const e=i.map(s=>{const{vehicleId:r,heading:o,localTimestamp:h}=s,n=Number(s.x),l=Number(s.y),a=new p({geometry:{type:"point",x:n,y:l},attributes:{...s,type:"trackVehicle"},symbol:this.hasGpu?this.createCIMSymbol(s):this.createMarkerSymbol()});return this.hasGpu&&(a.visible=!1,this.historyPositionMap.set(r,[{pos:[n,l,0],heading:o,time:h}]),this.vehicleObjectMap.set(r,{graphic:a,data:s,waitForDelete:!1,isMoving:!1})),a});this.vehicleLayer.addMany(e),t()})}updateVehicles(i){return new Promise(t=>{if(this.isPaused){t();return}const e=[];i.forEach(s=>{const{vehicleId:r,heading:o,localTimestamp:h}=s,n=Number(s.x),l=Number(s.y);if(this.hasGpu){const a=this.vehicleObjectMap.get(r);a?(a.data=s,a.graphic.attributes={...s,type:"trackVehicle"},this.historyPositionMap.get(r).push({pos:[n,l,0],heading:o,time:h})):e.push(s)}else{const a=this.vehicleLayer.graphics.find(c=>c.getAttribute("vehicleId")==s.vehicleId);a?a.geometry={type:"point",x:n,y:l}:e.push(s)}}),this.addVehicles(e),t()})}deleteVehicles(i){this.isPaused||(this.hasGpu?i.forEach(t=>{const e=this.vehicleObjectMap.get(t);e&&(e.waitForDelete=!0)}):i.forEach(t=>{const e=this.vehicleLayer.graphics.find(s=>s.getAttribute("vehicleId")==t);e&&this.vehicleLayer.remove(e)}))}clearVehicles(){this.vehicleLayer.removeAll(),this.vehicleObjectMap.clear(),this.historyPositionMap.clear()}toggleGroundVehicle(i){this.showGroundVehicle=i}toggleElevatedVehicle(i){this.showElevatedVehicle=i}toggleTrafficInfo(i){i.name==="vehiclePlate"&&(this.showVehiclePlate=i.visible)}togglePause(i){this.isPaused=i,this.isPaused&&this.rafSignal?cancelAnimationFrame(this.rafSignal):this.rafSignal=requestAnimationFrame(()=>this.render())}updatePanelContent(i){console.log(i)}setInterpolate(i){this.needInterpolate=i}render(){this.isPaused||this.vehicleObjectMap.forEach((i,t)=>{this.updatePosition(t)}),this.rafSignal=requestAnimationFrame(()=>this.render())}updatePosition(i){const t=this.historyPositionMap.get(i),e=this.vehicleObjectMap.get(i);if(!t||!e||!e.isMoving&&t.length<=2)return;e.isMoving=!0,(e.graphic.getAttribute("roadLayer")||"1")==="1"?e.graphic.visible=this.showGroundVehicle:e.graphic.visible=this.showElevatedVehicle,e.segmentStartTime||(e.segmentStartTime=Date.now(),e.segmentTotalTime=t[1].time-t[0].time);const r=Date.now()-e.segmentStartTime,o=Math.min(1,r/e.segmentTotalTime);if(o===1)if(t.shift(),t.length===1){e.waitForDelete?(this.vehicleLayer.remove(e.graphic),this.vehicleObjectMap.delete(i),this.historyPositionMap.delete(i)):(e.segmentStartTime=void 0,e.segmentTotalTime=void 0,e.graphic.visible=!1,e.isMoving=!1);return}else e.segmentStartTime=Date.now(),e.segmentTotalTime=t[1].time-t[0].time,Math.abs(t[1].heading-t[0].heading)>180&&(t[1].heading>t[0].heading?t[0].heading+=360:t[1].heading+=360),e.graphic.geometry={type:"point",x:t[0].pos[0],y:t[0].pos[1]};else{const h=t[0].pos[0]+(t[1].pos[0]-t[0].pos[0])*o,n=t[0].pos[1]+(t[1].pos[1]-t[0].pos[1])*o,l=t[0].heading+(t[1].heading-t[0].heading)*o;e.graphic.geometry={type:"point",x:h,y:n},e.data.heading=l,e.graphic.symbol=this.hasGpu?this.createCIMSymbol(e.data):this.createMarkerSymbol()}}createCIMSymbol(i){const t=this.getPlateFontColor(i.plateColor),e=this.getCarPic(i.vehicleColor,i.speed);return{type:"cim",data:{type:"CIMSymbolReference",primitiveOverrides:[{type:"CIMPrimitiveOverride",primitiveName:"textGraphic",propertyName:"TextString",valueExpressionInfo:{type:"CIMExpressionInfo",title:"Custom",expression:"$feature.showName",returnType:"Default"}}],symbol:{type:"CIMPointSymbol",symbolLayers:[{type:"CIMVectorMarker",enable:this.showVehiclePlate,size:32,colorLocked:!0,anchorPointUnits:"Relative",frame:{xmin:-8,ymin:-8,xmax:8,ymax:8},markerGraphics:[{type:"CIMMarkerGraphic",primitiveName:"textGraphic",geometry:{x:0,y:0},symbol:{type:"CIMTextSymbol",height:4,horizontalAlignment:"Center",offsetX:0,offsetY:8,haloSize:1,haloSymbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:t.backgroundColor}]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:t.fillColor}]},verticalAlignment:"Center"},textString:""}],scaleSymbolsProportionally:!0,respectFrame:!0},{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:e.size,rotation:i.heading,rotateClockwise:!0,textureFilter:"Picture",url:`${this.mapConfig.assetsRoot}Images/${e.pic}`}]}}}}createMarkerSymbol(){return{type:"simple-marker",color:"green",size:5,outline:{color:"white",width:1}}}getCarPic(i,t){if(this.view.scale>=1e3){let e="point_green.png";return t&&(t<=4.2?e="point_red.png":t<=8.4?e="point_yellow.png":e="point_green.png"),{pic:e,size:15}}else{let e="grey";switch(typeof i=="string"&&(i=i.toLowerCase()),i){case"a":case 1:e="white";break;case"b":case 2:e="grey";break;case"c":case 3:e="yellow";break;case"d":case 4:e="pink";break;case"e":case 5:e="red";break;case"f":case 10:e="purple";break;case"g":case 6:e="green";break;case"h":case 7:e="blue";break;case"i":case 8:e="brown";break;case"j":case 9:e="black";break}return{pic:"/car/"+e+".png",size:20}}}getPlateFontColor(i){let t=[255,255,255,255],e=[169,169,169,255];switch(i){case 0:t=[0,0,0,255],e=[255,255,255,255];break;case 1:t=[0,0,0,255],e=[244,164,96,255];break;case 2:t=[255,255,255,255],e=[65,105,225,255];break;case 3:t=[255,255,255,255],e=[0,0,0,255];break;case 15:t=[244,164,96,255],e=[0,250,154,255];break;case 16:t=[0,0,0,255],e=[0,250,154,255];break}return{fillColor:t,backgroundColor:e}}}exports.default=y;

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

@@ -1,4 +1,4 @@
-import { IResult } from '../../../types';
+import { IEditSignalControlAreaParams, IResult, IShowSignalControlAreaParams } from '../../../types';
 export default class SignalControlAreaController {
     private view;
     private districtControllerLayer;
@@ -15,10 +15,7 @@ export default class SignalControlAreaController {
      * @param params
      * @returns
      */
-    showSignalControlArea(params: {
-        areaList: any[];
-        style?: string;
-    }): IResult;
+    showSignalControlArea(params: IShowSignalControlAreaParams): IResult;
     clearSignalControlArea(): IResult;
     locateSignalControlArea(params: {
         id: string;
@@ -47,12 +44,7 @@ export default class SignalControlAreaController {
      * 编辑子区的路口
      * @returns
      */
-    editSubSignalArea(crossIdsInDistrict: string[], addCrossCallback: (params: {
-        id: string;
-        name: string;
-    }) => void, removeCrossCallback: (params: {
-        id: string;
-    }) => void): Promise<IResult>;
+    editSubSignalControlArea(params: IEditSignalControlAreaParams): Promise<IResult>;
     /**
      * 从外部接口选中一个路口
      * @param id

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 b=require("@arcgis/core/core/reactiveUtils.js"),u=require("@arcgis/core/Graphic"),y=require("@arcgis/core/layers/GraphicsLayer"),d=require("@turf/buffer"),f=require("@turf/convex"),C=require("@turf/helpers"),v=require("axios"),S=require("concaveman"),I=require("../../stores/index.js"),A=require("./district-controller.js");function m(o){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const t in o)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(o,t);Object.defineProperty(e,t,r.get?r:{enumerable:!0,get:()=>o[t]})}}return e.default=o,Object.freeze(e)}const L=m(b),n=m(C);class w{constructor(e){var i;this.crossScale=5e3,this.crossIdsInDistrict=[],this.view=e;const r=I.default.useAppDataStore.mapConfig;this.openDriveServer=(i=r.openDriveServer)==null?void 0:i.url,this.districtControllerLayer=new y({id:"districtControllerLayer"}),this.subDistrictControllerLayer=new y({id:"subDistrictControllerLayer",visible:!1}),this.crossLayer=new y({id:"crossLayer",visible:!1}),this.highlightLayer=new y({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.subDistrictControllerLayer.visible=!1,this.crossLayer.visible=!1,this.districtControllerLayer.visible=!0;for(const t of e.areaList){const r=new A.default(t,e.style||"");this.drawArea(r,!0)}return this.scaleWatcher=L.watch(()=>this.view.scale,(t,r)=>{t>this.crossScale&&r<=this.crossScale?(this.crossLayer.graphics.forEach(i=>{i.symbol=this.getCrossGraphicSymbol(i.attributes,"marker")}),this.highlightLayer.graphics.forEach(i=>{i.getAttribute("type")==="cross"&&(i.symbol=this.getCrossGraphicSymbol(i.attributes,"marker"))})):t<=this.crossScale&&r>this.crossScale&&(this.crossLayer.graphics.forEach(i=>{i.symbol=this.getCrossGraphicSymbol(i.attributes,"picture")}),this.highlightLayer.graphics.forEach(i=>{i.getAttribute("type")==="cross"&&(i.symbol=this.getCrossGraphicSymbol(i.attributes,"picture"))}))}),{status:0,message:"ok"}}clearSignalControlArea(){var e,t;return this.districtControllerLayer.removeAll(),this.subDistrictControllerLayer.removeAll(),this.crossLayer.removeAll(),this.highlightLayer.removeAll(),(e=this.scaleWatcher)==null||e.remove(),this.scaleWatcher=void 0,(t=this.clickWatcher)==null||t.remove(),this.clickWatcher=void 0,this.view.closePopup(),{status:0,message:"ok"}}async locateSignalControlArea(e){const t=this.findAreaGraphic(e.id);return t?(t.attributes.type==="cross"?await this.view.goTo({target:t.geometry,scale:1500}):await this.view.goTo(t.geometry),{status:0,message:"ok"}):{status:1,message:"未找到"}}async highlightSignalControlArea(e){if(!e.id||e.id==="")return{status:1,message:"请输入id"};this.highlightLayer.removeAll(),this.districtControllerLayer.visible=!1;const t=this.districtControllerLayer.graphics.filter(s=>s.getAttribute("id")===e.id).toArray().map(s=>{const a=s.clone();return a.symbol.style="none",a}),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());if(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)return{status:1,message:"未找到"};if(t.length>0)await this.view.goTo(t);else if(r.length>0){const s=r[0].geometry.centroid;await this.view.goTo({target:s,scale:this.crossScale-500})}else i.length>1?await this.view.goTo(i):await this.view.goTo({target:i[0].geometry,scale:1500});return{status:0,message:"ok"}}resetHighlight(){return this.highlightLayer.removeAll(),this.view.closePopup(),this.districtControllerLayer.visible=!0,{status:0,message:"ok"}}showSubSignalControlArea(e){this.crossLayer.removeAll(),this.crossLayer.visible=!0;const r=e.children.map(i=>{const s={...i,selected:!0};return new u({geometry:{type:"point",x:i.longitude,y:i.latitude},symbol:this.getCrossSymbolInSubDistrict(s),attributes:s})});return this.crossLayer.addMany(r),this.view.goTo(r),{status:0,message:"ok"}}async handleViewClick(e){var s;const r=(s=(await this.view.hitTest(e,{include:[this.crossLayer]})).results)==null?void 0:s.filter(a=>a.type==="graphic");if(r.length===0)return;const i=r[0].graphic;i.getAttribute("selected")?i.getAttribute("signalId")&&(this.removeCrossCallback&&this.removeCrossCallback({id:i.getAttribute("id")}),i.setAttribute("selected",!1),i.symbol=this.getCrossSymbolInSubDistrict(i.attributes)):(i.getAttribute("signalId")&&(this.addCrossCallback&&this.addCrossCallback({id:i.getAttribute("id"),name:i.getAttribute("name")}),i.setAttribute("selected",!0),i.symbol=this.getCrossSymbolInSubDistrict(i.attributes)),await this.showNearbyCrosses(i.getAttribute("id")))}async showNearbyCrosses(e){const t=await v.get(`http://${this.openDriveServer}/api/computable/getRelatedJunctionsForJunction`,{params:{junctionIds:e}});if(t.status===200)if(t.data.status===0){const r=t.data.result,i=[];for(const s of r){const{junctionId:a}=s;if(s.signalId&&!this.crossIdsInDistrict.includes(a)||this.crossLayer.graphics.some(c=>c.getAttribute("id")===a))continue;const g=new u({geometry:{type:"point",x:s.lon,y:s.lat},symbol:this.getCrossSymbolInSubDistrict(s),attributes:{id:a,name:s.name,signalId:s.signalId,selected:!1}});i.push(g)}return this.crossLayer.addMany(i),{status:0,message:"ok"}}else return{status:-1,message:t.data.message};else return{status:-1,message:"请求失败"}}async editSubSignalArea(e,t,r){if(this.openDriveServer){this.crossIdsInDistrict=e,this.addCrossCallback=t,this.removeCrossCallback=r,this.clickWatcher||(this.clickWatcher=this.view.on("click",async s=>{await this.handleViewClick(s)}));const i=this.crossLayer.graphics.toArray().map(s=>s.getAttribute("id")).join(",");return await this.showNearbyCrosses(i)}else return{status:1,message:"未配置OpenDriveServer"}}selectSubSignalControlAreaCross(e){return this.crossLayer.graphics.forEach(t=>{if(t.getAttribute("id")===e&&!t.getAttribute("selected"))return t.setAttribute("selected",!0),t.symbol=this.getCrossSymbolInSubDistrict(t.attributes),{status:0,message:"ok"}}),{status:0,message:"未找到"}}unselectSubSignalControlAreaCross(e){return this.crossLayer.graphics.forEach(t=>{if(t.getAttribute("id")===e&&t.getAttribute("selected"))return t.setAttribute("selected",!1),t.symbol=this.getCrossSymbolInSubDistrict(t.attributes),{status:0,message:"ok"}}),{status:0,message:"未找到"}}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(t){const h=n.featureCollection(r.map(p=>n.point(p)));s=f(h)}else{const h=S(r,.5);h.length>=4&&(s=n.polygon([h]))}s||(s=n.lineString(r))}const a=d(s.geometry,t?200:30,{units:"meters"});let l;t?l=[{fieldName:"id",label:"区控编号"},{fieldName:"crossCount",label:"路口数量"},{fieldName:"subDistrictCount",label:"子区数量"}]:l=[{fieldName:"parentName",label:"所属区控"},{fieldName:"crossCount",label:"路口数量"}];const g={type:"signalControlArea",id:e.id,name:e.name,parentId:e.parentId,parentName:e.parentName,crossCount:e.crossCount,subDistrictCount:e.subDistrictCount},c=new u({geometry:{type:"polygon",rings:a.geometry.coordinates},symbol:{type:"simple-fill",style:"none",color:[...e.areaColor,.3],outline:{color:e.areaColor,width:3,style:t?"long-dash":"solid"}},attributes:g,popupTemplate:{title:`${t?"区控":"子区"}  ${e.name}`,content:[{type:"fields",fieldInfos:l}]}});t?this.districtControllerLayer.add(c):this.subDistrictControllerLayer.add(c)}for(const s of e.subDistricts)this.drawArea(s,!1);const i=[];e.crosses.forEach(s=>{const a={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},l=new u({geometry:{type:"point",x:s.longitude,y:s.latitude},symbol:this.getCrossGraphicSymbol(a,"marker"),attributes:a,popupTemplate:{title:s.name,content:[{type:"fields",fieldInfos:[{fieldName:"districtName",label:"区控名称"},{fieldName:"subDistrictName",label:"子区名称"},{fieldName:"id",label:"路口编号"},{fieldName:"signalId",label:"信号机编号"}]}]}});i.push(l)}),this.crossLayer.addMany(i)}getCrossSymbolInSubDistrict(e){return e.signalId&&e.signalId!==""?{type:"cim",data:{type:"CIMSymbolReference",primitiveOverrides:[{type:"CIMPrimitiveOverride",primitiveName:"textGraphic",propertyName:"TextString",valueExpressionInfo:{type:"CIMExpressionInfo",title:"Custom",expression:'Replace($feature.name, "与", "/") + "  " + $feature.signalId',returnType:"Default"}}],symbol:{type:"CIMPointSymbol",symbolLayers:[{type:"CIMVectorMarker",size:32,colorLocked:!0,anchorPointUnits:"Relative",frame:{xmin:-16,ymin:-16,xmax:16,ymax:16},markerGraphics:[{type:"CIMMarkerGraphic",primitiveName:"textGraphic",geometry:{x:0,y:0},symbol:{type:"CIMTextSymbol",height:12,horizontalAlignment:"Center",offsetX:0,offsetY:20,haloSize:1,haloSymbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[255,255,255,255]}]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[0,0,0,255]}]},verticalAlignment:"Center"},textString:""}],scaleSymbolsProportionally:!0,respectFrame:!0},{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:30,rotateClockwise:!0,textureFilter:"Picture",url:`/GisViewerAssets/Images/cross/${e.selected?"gis_xhj_blue":"gis_xhj_gray"}.png`}]}}}:{type:"picture-marker",url:"/GisViewerAssets/Images/cross/gis_lkcz.png",width:"20px",height:"20px"}}getCrossGraphicSymbol(e,t){const{isKey:r,color:i}=e;if(t==="marker")return r?{type:"picture-marker",url:"/GisViewerAssets/Images/cross/gis_gjxklk_orange.png",width:"30px",height:"30px"}:{type:"simple-marker",style:"circle",color:i,size:8,outline:{color:"white",width:1}};if(t==="picture")return{type:"cim",data:{type:"CIMSymbolReference",primitiveOverrides:[{type:"CIMPrimitiveOverride",primitiveName:"textGraphic",propertyName:"TextString",valueExpressionInfo:{type:"CIMExpressionInfo",title:"Custom",expression:'Replace($feature.name, "与", "/") + "  " + $feature.signalId',returnType:"Default"}}],symbol:{type:"CIMPointSymbol",symbolLayers:[{type:"CIMVectorMarker",size:32,colorLocked:!0,anchorPointUnits:"Relative",frame:{xmin:-16,ymin:-16,xmax:16,ymax:16},markerGraphics:[{type:"CIMMarkerGraphic",primitiveName:"textGraphic",geometry:{x:0,y:0},symbol:{type:"CIMTextSymbol",height:12,horizontalAlignment:"Center",offsetX:0,offsetY:r?30:15,haloSize:1,haloSymbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[255,255,255,255]}]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[0,0,0,255]}]},verticalAlignment:"Center"},textString:""}],scaleSymbolsProportionally:!0,respectFrame:!0},{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:r?40:20,rotateClockwise:!0,textureFilter:"Picture",url:`/GisViewerAssets/Images/cross/${r?"gis_gjxklk_orange":"gis_xhj_blue"}.png`}]}}}}}exports.default=w;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const b=require("@arcgis/core/core/reactiveUtils.js"),c=require("@arcgis/core/Graphic"),y=require("@arcgis/core/layers/GraphicsLayer"),f=require("@turf/buffer"),m=require("@turf/convex"),C=require("@turf/helpers"),v=require("axios"),S=require("concaveman"),I=require("../../stores/index.js"),A=require("./district-controller.js");function d(l){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const t in l)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(l,t);Object.defineProperty(e,t,r.get?r:{enumerable:!0,get:()=>l[t]})}}return e.default=l,Object.freeze(e)}const L=d(b),o=d(C);class w{constructor(e){var i;this.crossScale=5e3,this.crossIdsInDistrict=[],this.view=e;const r=I.default.useAppDataStore.mapConfig;this.openDriveServer=(i=r.openDriveServer)==null?void 0:i.url,this.districtControllerLayer=new y({id:"districtControllerLayer"}),this.subDistrictControllerLayer=new y({id:"subDistrictControllerLayer",visible:!1}),this.crossLayer=new y({id:"crossLayer",visible:!1}),this.highlightLayer=new y({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.subDistrictControllerLayer.visible=!1,this.crossLayer.visible=!1,this.districtControllerLayer.visible=!0;for(const t of e.areaList){const r=new A.default(t,e.style||"");this.drawArea(r,!0)}return this.scaleWatcher=L.watch(()=>this.view.scale,(t,r)=>{t>this.crossScale&&r<=this.crossScale?(this.crossLayer.graphics.forEach(i=>{i.symbol=this.getCrossGraphicSymbol(i.attributes,"marker")}),this.highlightLayer.graphics.forEach(i=>{i.getAttribute("type")==="cross"&&(i.symbol=this.getCrossGraphicSymbol(i.attributes,"marker"))})):t<=this.crossScale&&r>this.crossScale&&(this.crossLayer.graphics.forEach(i=>{i.symbol=this.getCrossGraphicSymbol(i.attributes,"picture")}),this.highlightLayer.graphics.forEach(i=>{i.getAttribute("type")==="cross"&&(i.symbol=this.getCrossGraphicSymbol(i.attributes,"picture"))}))}),{status:0,message:"ok"}}clearSignalControlArea(){var e,t;return this.districtControllerLayer.removeAll(),this.subDistrictControllerLayer.removeAll(),this.crossLayer.removeAll(),this.highlightLayer.removeAll(),(e=this.scaleWatcher)==null||e.remove(),this.scaleWatcher=void 0,(t=this.clickWatcher)==null||t.remove(),this.clickWatcher=void 0,this.view.closePopup(),{status:0,message:"ok"}}async locateSignalControlArea(e){const t=this.findAreaGraphic(e.id);return t?(t.attributes.type==="cross"?await this.view.goTo({target:t.geometry,scale:1500}):await this.view.goTo(t.geometry),{status:0,message:"ok"}):{status:1,message:"未找到"}}async highlightSignalControlArea(e){if(!e.id||e.id==="")return{status:1,message:"请输入id"};this.highlightLayer.removeAll(),this.districtControllerLayer.visible=!1;const t=this.districtControllerLayer.graphics.filter(s=>s.getAttribute("id")===e.id).toArray().map(s=>{const a=s.clone();return a.symbol.style="none",a}),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());if(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)return{status:1,message:"未找到"};if(t.length>0)await this.view.goTo(t);else if(r.length>0){const s=r[0].geometry.centroid;await this.view.goTo({target:s,scale:this.crossScale-500})}else i.length>1?await this.view.goTo(i):await this.view.goTo({target:i[0].geometry,scale:1500});return{status:0,message:"ok"}}resetHighlight(){return this.highlightLayer.removeAll(),this.view.closePopup(),this.districtControllerLayer.visible=!0,{status:0,message:"ok"}}showSubSignalControlArea(e){this.crossLayer.removeAll(),this.crossLayer.visible=!0;const r=e.children.map(i=>{const s={...i,selected:!0};return new c({geometry:{type:"point",x:i.longitude,y:i.latitude},symbol:this.getCrossSymbolInSubDistrict(s),attributes:s})});return this.crossLayer.addMany(r),this.view.goTo(r),{status:0,message:"ok"}}async handleViewClick(e){var s;const r=(s=(await this.view.hitTest(e,{include:[this.crossLayer]})).results)==null?void 0:s.filter(a=>a.type==="graphic");if(r.length===0)return;const i=r[0].graphic;i.getAttribute("selected")?i.getAttribute("signalId")&&(this.removeCrossCallback&&this.removeCrossCallback({id:i.getAttribute("id")}),i.setAttribute("selected",!1),i.symbol=this.getCrossSymbolInSubDistrict(i.attributes)):(i.getAttribute("signalId")&&(this.addCrossCallback&&this.addCrossCallback({id:i.getAttribute("id"),name:i.getAttribute("name")}),i.setAttribute("selected",!0),i.symbol=this.getCrossSymbolInSubDistrict(i.attributes)),await this.showNearbyCrosses(i.getAttribute("id")))}async showNearbyCrosses(e){const t=await v.get(`http://${this.openDriveServer}/api/computable/getRelatedJunctionsForJunction`,{params:{junctionIds:e}});if(t.status===200)if(t.data.status===0){const r=t.data.result,i=[];for(const s of r){const a=s.junctionId;if(a.startsWith("-"))continue;if(s.signalId&&!this.crossIdsInDistrict.includes(a)){console.log("不是此区控内的路口",a);continue}if(this.crossLayer.graphics.some(h=>h.getAttribute("id")===a))continue;const g=new c({geometry:{type:"point",x:s.lon,y:s.lat},symbol:this.getCrossSymbolInSubDistrict(s),attributes:{id:a,name:s.name,signalId:s.signalId,selected:!1}});i.push(g)}return this.crossLayer.addMany(i),{status:0,message:"ok"}}else return{status:-1,message:t.data.message};else return{status:-1,message:"请求失败"}}async editSubSignalControlArea(e){if(this.openDriveServer){this.crossIdsInDistrict=e.crossesInArea.map(s=>s.id);const t=o.featureCollection(e.crossesInArea.map(s=>o.point([s.x,s.y]))),r=m(t);r&&(this.districtControllerLayer.removeAll(),this.districtControllerLayer.add(new c({geometry:{type:"polygon",rings:r.geometry.coordinates},symbol:{type:"simple-fill",style:"none",outline:{color:[61,139,249],width:3,style:"long-dash"}}}))),this.addCrossCallback=e.addCrossCallback,this.removeCrossCallback=e.removeCrossCallback,this.clickWatcher||(this.clickWatcher=this.view.on("click",async s=>{await this.handleViewClick(s)}));const i=this.crossLayer.graphics.toArray().map(s=>s.getAttribute("id")).join(",");return await this.showNearbyCrosses(i)}else return{status:1,message:"未配置OpenDriveServer"}}selectSubSignalControlAreaCross(e){return this.crossLayer.graphics.forEach(t=>{if(t.getAttribute("id")===e&&!t.getAttribute("selected"))return t.setAttribute("selected",!0),t.symbol=this.getCrossSymbolInSubDistrict(t.attributes),{status:0,message:"ok"}}),{status:0,message:"未找到"}}unselectSubSignalControlAreaCross(e){return this.crossLayer.graphics.forEach(t=>{if(t.getAttribute("id")===e&&t.getAttribute("selected"))return t.setAttribute("selected",!1),t.symbol=this.getCrossSymbolInSubDistrict(t.attributes),{status:0,message:"ok"}}),{status:0,message:"未找到"}}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=o.lineString(r);else{if(t){const u=o.featureCollection(r.map(p=>o.point(p)));s=m(u)}else{const u=S(r,.5);u.length>=4&&(s=o.polygon([u]))}s||(s=o.lineString(r))}const a=f(s.geometry,t?200:30,{units:"meters"});let n;t?n=[{fieldName:"id",label:"区控编号"},{fieldName:"crossCount",label:"路口数量"},{fieldName:"subDistrictCount",label:"子区数量"}]:n=[{fieldName:"parentName",label:"所属区控"},{fieldName:"crossCount",label:"路口数量"}];const g={type:"signalControlArea",id:e.id,name:e.name,parentId:e.parentId,parentName:e.parentName,crossCount:e.crossCount,subDistrictCount:e.subDistrictCount},h=new c({geometry:{type:"polygon",rings:a.geometry.coordinates},symbol:{type:"simple-fill",style:"none",color:[...e.areaColor,.3],outline:{color:e.areaColor,width:3,style:t?"long-dash":"solid"}},attributes:g,popupTemplate:{title:`${t?"区控":"子区"}  ${e.name}`,content:[{type:"fields",fieldInfos:n}]}});t?this.districtControllerLayer.add(h):this.subDistrictControllerLayer.add(h)}for(const s of e.subDistricts)this.drawArea(s,!1);const i=[];e.crosses.forEach(s=>{const a={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},n=new c({geometry:{type:"point",x:s.longitude,y:s.latitude},symbol:this.getCrossGraphicSymbol(a,"marker"),attributes:a,popupTemplate:{title:s.name,content:[{type:"fields",fieldInfos:[{fieldName:"districtName",label:"区控名称"},{fieldName:"subDistrictName",label:"子区名称"},{fieldName:"id",label:"路口编号"},{fieldName:"signalId",label:"信号机编号"}]}]}});i.push(n)}),this.crossLayer.addMany(i)}getCrossSymbolInSubDistrict(e){return e.signalId&&e.signalId!==""?{type:"cim",data:{type:"CIMSymbolReference",primitiveOverrides:[{type:"CIMPrimitiveOverride",primitiveName:"textGraphic",propertyName:"TextString",valueExpressionInfo:{type:"CIMExpressionInfo",title:"Custom",expression:'Replace($feature.name, "与", "/") + "  " + $feature.signalId',returnType:"Default"}}],symbol:{type:"CIMPointSymbol",symbolLayers:[{type:"CIMVectorMarker",size:32,colorLocked:!0,anchorPointUnits:"Relative",frame:{xmin:-16,ymin:-16,xmax:16,ymax:16},markerGraphics:[{type:"CIMMarkerGraphic",primitiveName:"textGraphic",geometry:{x:0,y:0},symbol:{type:"CIMTextSymbol",height:12,horizontalAlignment:"Center",offsetX:0,offsetY:20,haloSize:1,haloSymbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[255,255,255,255]}]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[0,0,0,255]}]},verticalAlignment:"Center"},textString:""}],scaleSymbolsProportionally:!0,respectFrame:!0},{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:30,rotateClockwise:!0,textureFilter:"Picture",url:`/GisViewerAssets/Images/cross/${e.selected?"gis_xhj_blue":"gis_xhj_gray"}.png`}]}}}:{type:"picture-marker",url:"/GisViewerAssets/Images/cross/gis_lkcz.png",width:"20px",height:"20px"}}getCrossGraphicSymbol(e,t){const{isKey:r,color:i}=e;if(t==="marker")return r?{type:"picture-marker",url:"/GisViewerAssets/Images/cross/gis_gjxklk_orange.png",width:"30px",height:"30px"}:{type:"simple-marker",style:"circle",color:i,size:8,outline:{color:"white",width:1}};if(t==="picture")return{type:"cim",data:{type:"CIMSymbolReference",primitiveOverrides:[{type:"CIMPrimitiveOverride",primitiveName:"textGraphic",propertyName:"TextString",valueExpressionInfo:{type:"CIMExpressionInfo",title:"Custom",expression:'Replace($feature.name, "与", "/") + "  " + $feature.signalId',returnType:"Default"}}],symbol:{type:"CIMPointSymbol",symbolLayers:[{type:"CIMVectorMarker",size:32,colorLocked:!0,anchorPointUnits:"Relative",frame:{xmin:-16,ymin:-16,xmax:16,ymax:16},markerGraphics:[{type:"CIMMarkerGraphic",primitiveName:"textGraphic",geometry:{x:0,y:0},symbol:{type:"CIMTextSymbol",height:12,horizontalAlignment:"Center",offsetX:0,offsetY:r?30:15,haloSize:1,haloSymbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[255,255,255,255]}]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[0,0,0,255]}]},verticalAlignment:"Center"},textString:""}],scaleSymbolsProportionally:!0,respectFrame:!0},{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:r?40:20,rotateClockwise:!0,textureFilter:"Picture",url:`/GisViewerAssets/Images/cross/${r?"gis_gjxklk_orange":"gis_xhj_blue"}.png`}]}}}}}exports.default=w;

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

@@ -270,3 +270,21 @@ export interface ISignalCountdownProps {
         rColor?: string;
     };
 }
+export interface IShowSignalControlAreaParams {
+    areaList: any[];
+    style?: string;
+}
+export interface IEditSignalControlAreaParams {
+    crossesInArea: {
+        id: string;
+        x: number;
+        y: number;
+    }[];
+    addCrossCallback: (params: {
+        id: string;
+        name: string;
+    }) => void;
+    removeCrossCallback: (params: {
+        id: string;
+    }) => void;
+}

package/package.json

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