gisviewer-vue3-arcgis 1.0.89 → 1.0.91

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

@@ -1,4 +1,5 @@
 import View from '@arcgis/core/views/View';
+import { IToggleTrafficInfoParams } from '../../types';
 export default class TrafficFlow {
     private view;
     private mapConfig;
@@ -10,6 +11,10 @@ export default class TrafficFlow {
     private objectMissCount;
     /** 是否显示车牌号码 */
     private showVehiclePlate;
+    /** 是否显示地面车辆 */
+    private showGroundVehicle;
+    /** 是否显示高架车辆 */
+    private showElevatedVehicle;
     private showLog;
     constructor(view: View);
     /**
@@ -23,10 +28,15 @@ export default class TrafficFlow {
      */
     disconnectTrafficFlow(): void;
     /**
-     * 控制车辆号牌是否显示
-     * @param visible
+     * 切换交通信息可见性
+     * @param params
      */
-    toggleVehiclePlate(visible: boolean): void;
+    toggleTrafficInfo(params: IToggleTrafficInfoParams): void;
+    /**
+     * 切换交通对象可见性
+     * @param params
+     */
+    toggleTrafficObject(params: IToggleTrafficInfoParams): void;
     private focusVehNo;
     private handleTrafficFlowData;
     /**
@@ -34,6 +44,7 @@ export default class TrafficFlow {
      * @param objects
      */
     private addTrafficObjects;
+    private getVehicleVisibility;
     /**
      * 更新交通对象
      * @param objects

package/es/src/gis-map/utils/traffic-flow.mjs

@@ -1,93 +1,115 @@
-import m from "@arcgis/core/Graphic";
+import u from "@arcgis/core/Graphic";
 import { Point as p } from "@arcgis/core/geometry";
-import f from "@arcgis/core/layers/GraphicsLayer";
-import u from "../stores/index.mjs";
-import y from "./common-utils.mjs";
-class x {
-  constructor(o) {
-    this.maxMissCount = 2, this.objectMissCount = /* @__PURE__ */ new Map(), this.showVehiclePlate = !0, this.showLog = !1, this.focusVehNo = "", this.view = o;
-    const e = u.useAppDataStore;
-    this.mapConfig = JSON.parse(JSON.stringify(e.mapConfig)), this.objectsLayer = new f(), this.view.map.add(this.objectsLayer);
+import y from "@arcgis/core/layers/GraphicsLayer";
+import d from "../stores/index.mjs";
+import m from "./common-utils.mjs";
+class S {
+  constructor(i) {
+    this.maxMissCount = 2, this.objectMissCount = /* @__PURE__ */ new Map(), this.showVehiclePlate = !0, this.showGroundVehicle = !0, this.showElevatedVehicle = !0, this.showLog = !1, this.focusVehNo = "", this.view = i;
+    const t = d.useAppDataStore;
+    this.mapConfig = JSON.parse(JSON.stringify(t.mapConfig)), this.objectsLayer = new y(), this.view.map.add(this.objectsLayer);
   }
   /**
    * 开始显示交通流数据
    * @param url
    * @param options
    */
-  connectTrafficFlow(o, e) {
-    var t;
-    this.showVehiclePlate = (e == null ? void 0 : e.showVehiclePlate) !== !1, this.showLog = (e == null ? void 0 : e.showTraceLog) === !0, (t = this.webSocket) == null || t.close(), this.webSocket = new WebSocket(o), this.webSocket.onopen = () => {
+  connectTrafficFlow(i, t) {
+    var e;
+    this.showVehiclePlate = (t == null ? void 0 : t.showVehiclePlate) !== !1, this.showLog = (t == null ? void 0 : t.showTraceLog) === !0, (e = this.webSocket) == null || e.close(), this.webSocket = new WebSocket(i), this.webSocket.onopen = () => {
       console.log("websocket连接成功"), this.objectMissCount.clear();
     }, this.webSocket.onclose = () => {
       console.log("websocket连接关闭");
-    }, this.webSocket.onmessage = (a) => {
-      this.handleTrafficFlowData(a.data);
+    }, this.webSocket.onmessage = (o) => {
+      this.handleTrafficFlowData(o.data);
     };
   }
   /**
    * 停止显示交通流数据
    */
   disconnectTrafficFlow() {
-    var o;
-    (o = this.webSocket) == null || o.close(), this.objectsLayer.removeAll(), this.objectMissCount.clear();
+    var i;
+    (i = this.webSocket) == null || i.close(), this.objectsLayer.removeAll(), this.objectMissCount.clear();
   }
   /**
-   * 控制车辆号牌是否显示
-   * @param visible
+   * 切换交通信息可见性
+   * @param params
    */
-  toggleVehiclePlate(o) {
-    this.showVehiclePlate = o;
+  toggleTrafficInfo(i) {
+    switch (i.name.toLowerCase()) {
+      case "vehiclePlate".toLowerCase():
+        this.showVehiclePlate = i.visible;
+        break;
+    }
+  }
+  /**
+   * 切换交通对象可见性
+   * @param params
+   */
+  toggleTrafficObject(i) {
+    switch (i.name.toLowerCase()) {
+      case "groundVehicle".toLowerCase():
+        this.showGroundVehicle = i.visible;
+        break;
+      case "elevatedVehicle".toLowerCase():
+        this.showElevatedVehicle = i.visible;
+        break;
+    }
   }
-  handleTrafficFlowData(o) {
-    const e = y.unzip(o);
-    if (!e)
+  handleTrafficFlowData(i) {
+    const t = m.unzip(i);
+    if (!t)
       return;
-    const t = [], a = [], n = [], l = JSON.parse(e);
-    this.showLog && console.log(l);
-    const s = l.data || l.rtPositionList;
+    const e = [], o = [], n = [], c = JSON.parse(t);
+    this.showLog && console.log(c);
+    const s = c.data || c.rtPositionList;
     if (!s || s.length === 0)
       return;
-    const h = new Date(l.jgsj).getTime();
-    for (const r of s) {
-      const i = this.buildVehicleTrackData(r, h);
-      i && (this.objectMissCount.has(i.ptcId) ? t.push(i) : a.push(i), this.objectMissCount.set(i.ptcId, 0));
+    const b = new Date(c.jgsj).getTime();
+    for (const a of s) {
+      const r = this.buildVehicleTrackData(a, b);
+      r && (this.objectMissCount.has(r.ptcId) ? e.push(r) : o.push(r), this.objectMissCount.set(r.ptcId, 0));
     }
-    for (const r of this.objectMissCount) {
-      const i = r[0];
-      let c = r[1];
-      s.findIndex((b) => b.vehno === i) < 0 && (c++, this.objectMissCount.set(i, c), c === this.maxMissCount && n.push(i));
+    for (const a of this.objectMissCount) {
+      const r = a[0];
+      let l = a[1];
+      s.findIndex((f) => f.vehno === r) < 0 && (l++, this.objectMissCount.set(r, l), l === this.maxMissCount && n.push(r));
     }
-    for (const r of n)
-      this.objectMissCount.delete(r);
-    this.addTrafficObjects(a), this.updateTrafficObjects(t), this.deleteTrafficObjects(n);
+    for (const a of n)
+      this.objectMissCount.delete(a);
+    this.addTrafficObjects(o), this.updateTrafficObjects(e), this.deleteTrafficObjects(n);
   }
   /**
    * 新增交通对象
    * @param objects
    */
-  addTrafficObjects(o) {
-    const e = o.map(
-      (t) => new m({
-        geometry: new p({ longitude: t.x, latitude: t.y }),
-        symbol: this.createCIMSymbol(t),
-        attributes: t
+  addTrafficObjects(i) {
+    const t = i.map(
+      (e) => new u({
+        geometry: new p({ longitude: e.x, latitude: e.y }),
+        symbol: this.createCIMSymbol(e),
+        attributes: e,
+        visible: this.getVehicleVisibility(e)
       })
     );
-    this.objectsLayer.addMany(e);
+    this.objectsLayer.addMany(t);
+  }
+  getVehicleVisibility(i) {
+    return i.roadLayer === "1" ? this.showGroundVehicle : i.roadLayer === "2" || i.roadLayer === "3" ? this.showElevatedVehicle : !0;
   }
   /**
    * 更新交通对象
    * @param objects
    */
-  updateTrafficObjects(o) {
-    o.forEach((e) => {
-      const t = this.objectsLayer.graphics.find(
-        (a) => a.getAttribute("ptcId") === e.ptcId
+  updateTrafficObjects(i) {
+    i.forEach((t) => {
+      const e = this.objectsLayer.graphics.find(
+        (o) => o.getAttribute("ptcId") === t.ptcId
       );
-      t && (t.geometry = new p({
-        longitude: e.x,
-        latitude: e.y
-      }), t.symbol = this.createCIMSymbol(e));
+      e && (e.geometry = new p({
+        longitude: t.x,
+        latitude: t.y
+      }), e.symbol = this.createCIMSymbol(t), e.visible = this.getVehicleVisibility(t));
     });
   }
   /**
@@ -95,8 +117,8 @@ class x {
    * @param vehTrack
    * @returns
    */
-  createCIMSymbol(o) {
-    const e = this.getPlateFontColor(o.plateColor);
+  createCIMSymbol(i) {
+    const t = this.getPlateFontColor(i.plateColor);
     return {
       type: "cim",
       data: {
@@ -144,7 +166,7 @@ class x {
                         {
                           type: "CIMSolidFill",
                           enable: !0,
-                          color: e.backgroundColor
+                          color: t.backgroundColor
                         }
                       ]
                     },
@@ -154,7 +176,7 @@ class x {
                         {
                           type: "CIMSolidFill",
                           enable: !0,
-                          color: e.fillColor
+                          color: t.fillColor
                         }
                       ]
                     },
@@ -175,11 +197,11 @@ class x {
                 y: 0
               },
               anchorPointUnits: "Relative",
-              size: 30,
-              rotation: o.heading,
+              size: 15,
+              rotation: i.heading,
               rotateClockwise: !0,
               textureFilter: "Picture",
-              url: `${this.mapConfig.assetsRoot}Images/car/${this.getCarPic(o.vehicleColor).pic}`
+              url: `${this.mapConfig.assetsRoot}Images/car/${this.getCarPic(i.vehicleColor).pic}`
             }
           ]
         }
@@ -190,35 +212,36 @@ class x {
    * 删除交通对象
    * @param ids
    */
-  deleteTrafficObjects(o) {
-    o.forEach((e) => {
-      const t = this.objectsLayer.graphics.find(
-        (a) => a.getAttribute("ptcId") === e
+  deleteTrafficObjects(i) {
+    i.forEach((t) => {
+      const e = this.objectsLayer.graphics.find(
+        (o) => o.getAttribute("ptcId") === t
       );
-      t && this.objectsLayer.remove(t);
+      e && this.objectsLayer.remove(e);
     });
   }
-  buildVehicleTrackData(o, e) {
-    const { hpys: t, csys: a, lng: n, angle: l, hphm: s, lat: h, cx: r } = o, i = o.vehno || o.vehNo;
-    if (!i)
+  buildVehicleTrackData(i, t) {
+    const { hpys: e, csys: o, lng: n, angle: c, hphm: s, lat: b, cx: a, roadLayer: r } = i, l = i.vehno || i.vehNo;
+    if (!l)
       return;
-    let c;
-    if (s && s !== "0" && s !== 0 ? c = s.includes("-") ? s.split("-")[1] : s : c = i.includes("-") ? i.split("-")[1] : i, !["1", "2", "3", "4", "5", "6", 1, 2, 3, 4, 5, 6].includes(r)) {
-      console.log("车辆类型错误", r);
+    let h;
+    if (s && s !== "0" && s !== 0 ? h = s.includes("-") ? s.split("-")[1] : s : h = l.includes("-") ? l.split("-")[1] : l, !["1", "2", "3", "4", "5", "6", 1, 2, 3, 4, 5, 6].includes(a)) {
+      console.log("车辆类型错误", a);
       return;
     }
     return {
-      ptcId: i,
-      timestamp: e,
-      localTimestamp: e,
+      ptcId: l,
+      timestamp: t,
+      localTimestamp: t,
       x: n,
-      y: h,
-      ptcType: Number(r),
-      heading: l,
-      vehicleColor: a || "z",
-      plateColor: s ? t : "99",
-      showName: c,
-      vehicleType: 99
+      y: b,
+      ptcType: Number(a),
+      heading: c,
+      vehicleColor: o || "z",
+      plateColor: s ? e : "99",
+      showName: h,
+      vehicleType: 99,
+      roadLayer: r || "1"
     };
   }
   /**
@@ -226,83 +249,86 @@ class x {
    * @param carColor
    * @returns
    */
-  getCarPic(o) {
-    if (this.view.zoom <= 15)
+  getCarPic(i) {
+    let t = 0;
+    if (this.view.type === "3d" ? t = this.view.zoom : t = this.view.zoom, t <= 17)
       return {
         pic: "point.png",
         color: [128, 128, 128, 255]
       };
-    let e = "grey", t = [128, 128, 128, 255];
-    switch (o.toLowerCase()) {
-      case "a":
-        e = "white", t = [200, 200, 200, 255];
-        break;
-      case "b":
-        e = "grey", t = [128, 128, 128, 255];
-        break;
-      case "c":
-        e = "yellow", t = [255, 215, 0, 255];
-        break;
-      case "d":
-        e = "pink", t = [255, 182, 193, 255];
-        break;
-      case "e":
-        e = "red", t = [255, 0, 0, 255];
-        break;
-      case "f":
-        e = "purple", t = [128, 0, 128, 255];
-        break;
-      case "g":
-        e = "green", t = [124, 252, 0, 255];
-        break;
-      case "h":
-        e = "blue", t = [0, 191, 255, 255];
-        break;
-      case "i":
-        e = "brown", t = [244, 164, 96, 255];
-        break;
-      case "j":
-        e = "black", t = [0, 0, 0, 255];
-        break;
+    {
+      let e = "grey", o = [128, 128, 128, 255];
+      switch (i.toLowerCase()) {
+        case "a":
+          e = "white", o = [200, 200, 200, 255];
+          break;
+        case "b":
+          e = "grey", o = [128, 128, 128, 255];
+          break;
+        case "c":
+          e = "yellow", o = [255, 215, 0, 255];
+          break;
+        case "d":
+          e = "pink", o = [255, 182, 193, 255];
+          break;
+        case "e":
+          e = "red", o = [255, 0, 0, 255];
+          break;
+        case "f":
+          e = "purple", o = [128, 0, 128, 255];
+          break;
+        case "g":
+          e = "green", o = [124, 252, 0, 255];
+          break;
+        case "h":
+          e = "blue", o = [0, 191, 255, 255];
+          break;
+        case "i":
+          e = "brown", o = [244, 164, 96, 255];
+          break;
+        case "j":
+          e = "black", o = [0, 0, 0, 255];
+          break;
+      }
+      return {
+        pic: e + ".png",
+        color: o
+      };
     }
-    return {
-      pic: e + ".png",
-      color: t
-    };
   }
   /**
    * 根据号牌颜色属性获取填充色和背景色
    * @param plateColor
    * @returns
    */
-  getPlateFontColor(o) {
-    let e = [255, 255, 255, 255], t = [169, 169, 169, 255];
-    switch (o) {
+  getPlateFontColor(i) {
+    let t = [255, 255, 255, 255], e = [169, 169, 169, 255];
+    switch (i) {
       case 0:
-        e = [0, 0, 0, 255], t = [255, 255, 255, 255];
+        t = [0, 0, 0, 255], e = [255, 255, 255, 255];
         break;
       case 1:
-        e = [0, 0, 0, 255], t = [244, 164, 96, 255];
+        t = [0, 0, 0, 255], e = [244, 164, 96, 255];
         break;
       case 2:
-        e = [255, 255, 255, 255], t = [65, 105, 225, 255];
+        t = [255, 255, 255, 255], e = [65, 105, 225, 255];
         break;
       case 3:
-        e = [255, 255, 255, 255], t = [0, 0, 0, 255];
+        t = [255, 255, 255, 255], e = [0, 0, 0, 255];
         break;
       case 15:
-        e = [244, 164, 96, 255], t = [0, 250, 154, 255];
+        t = [244, 164, 96, 255], e = [0, 250, 154, 255];
         break;
       case 16:
-        e = [0, 0, 0, 255], t = [0, 250, 154, 255];
+        t = [0, 0, 0, 255], e = [0, 250, 154, 255];
         break;
     }
     return {
-      fillColor: e,
-      backgroundColor: t
+      fillColor: t,
+      backgroundColor: e
     };
   }
 }
 export {
-  x as default
+  S as default
 };

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

@@ -34,6 +34,7 @@ export interface IVehicleTrack {
     fixAngle?: number;
     speed?: number;
     plateNo?: string;
+    roadLayer?: string;
 }
 export interface ILaneNumberParams {
     lanes: {
@@ -44,11 +45,15 @@ export interface ILaneNumberParams {
     }[];
 }
 export interface ISetMapCenterParams {
-    center: number[];
-    camera?: {};
+    center?: number[];
+    target?: __esri.GoToTarget2D;
     zoom?: number;
     duration?: number;
 }
+export interface ILayerVisibleParams {
+    id: string;
+    visible: boolean;
+}
 export interface ILookAtParams {
     center: number[];
     height: number;
@@ -120,7 +125,7 @@ export interface IOverlayParam {
     visible?: boolean;
 }
 export interface ISetMapCameraParams {
-    crossId: string;
+    name: string;
     zoom?: number;
     duration?: number;
 }
@@ -129,12 +134,18 @@ export interface IQueueLengthParams {
     laneId: number;
     queueLength: number;
 }
+export interface IToggleTrafficInfoParams {
+    name: string;
+    visible: boolean;
+}
 export interface ITraceRendererInterface {
     addVehicles(objects: IVehicleTrack[]): void;
     updateVehicles(objects: IVehicleTrack[]): void;
     deleteVehicles(idList: string[]): void;
     clearVehicles(): void;
     updatePanelContent(contentType: EVehiclePlateState): void;
+    toggleGroundVehicle(visible: boolean): void;
+    toggleElevatedVehicle(visible: boolean): void;
 }
 export declare enum EVehiclePlateState {
     None = 0,

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 { ILaneNumberParams, ILookAtParams, IOverlayParam, IQueueLengthParams, ISetMapCameraParams, ISetMapCenterParams, IStartCrossBufferParam } from '../types';
+import { ILaneNumberParams, ILayerVisibleParams, ILookAtParams, IOverlayParam, IQueueLengthParams, ISetMapCameraParams, ISetMapCenterParams, IStartCrossBufferParam, IToggleTrafficInfoParams } from '../types';
 import HoloFlow from './utils/holo-flow';
 import MapInitializer from './utils/map-initializer';
 import OpenDriveRenderer from './utils/open-drive-renderer';
@@ -31,6 +31,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
     setMapCenter: (params: ISetMapCenterParams) => Promise<import("../types").IResult>;
     setMapCamera: (params: ISetMapCameraParams) => Promise<import("../types").IResult>;
     lookAt: (params: ILookAtParams) => Promise<void>;
+    setLayerVisibility: (params: ILayerVisibleParams) => import("../types").IResult;
     requestCoordinateTransform: (points: number[][], callback: (points: number[][]) => void) => {
         handle: number;
         points: number[][];
@@ -51,10 +52,8 @@ declare const _sfc_main: import("vue").DefineComponent<{
     clearHoloTrace: () => void;
     handleHoloSignalData: (signalData: any) => Promise<void>;
     clearHoloSignal: () => void;
-    toggleTrafficInfo: (params: {
-        name: string;
-        visible: boolean;
-    }) => void;
+    toggleTrafficInfo: (params: IToggleTrafficInfoParams) => void;
+    toggleTrafficObject: (params: IToggleTrafficInfoParams) => void;
     toggleVehicleInfo: (contentType: string) => void;
     addOverlays: (params: IOverlayParam) => Promise<import("../types").IResult>;
     removeOverlaysByType: (types: string[]) => import("../types").IResult;

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

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

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

@@ -21,6 +21,7 @@ export declare const GisMap: import("@easyest/utils/dist/lib/withinstall").SFCWi
     setMapCenter: (params: import("../types").ISetMapCenterParams) => Promise<import("../types").IResult>;
     setMapCamera: (params: import("../types").ISetMapCameraParams) => Promise<import("../types").IResult>;
     lookAt: (params: import("../types").ILookAtParams) => Promise<void>;
+    setLayerVisibility: (params: import("../types").ILayerVisibleParams) => import("../types").IResult;
     requestCoordinateTransform: (points: number[][], callback: (points: number[][]) => void) => {
         handle: number;
         points: number[][];
@@ -41,10 +42,8 @@ export declare const GisMap: import("@easyest/utils/dist/lib/withinstall").SFCWi
     clearHoloTrace: () => void;
     handleHoloSignalData: (signalData: any) => Promise<void>;
     clearHoloSignal: () => void;
-    toggleTrafficInfo: (params: {
-        name: string;
-        visible: boolean;
-    }) => void;
+    toggleTrafficInfo: (params: import("../types").IToggleTrafficInfoParams) => void;
+    toggleTrafficObject: (params: import("../types").IToggleTrafficInfoParams) => void;
     toggleVehicleInfo: (contentType: string) => void;
     addOverlays: (params: import("../types").IOverlayParam) => Promise<import("../types").IResult>;
     removeOverlaysByType: (types: string[]) => import("../types").IResult;

package/lib/src/gis-map/utils/GreenWaveline.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("@arcgis/core/Graphic"),y=require("@arcgis/core/geometry"),u=require("@arcgis/core/geometry/Polyline"),p=require("@arcgis/core/geometry/support/webMercatorUtils.js"),b=require("@arcgis/core/layers/GraphicsLayer"),g=require("./renderer/greenWaveline.js");function f(o){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const t in o)if(t!=="default"){const e=Object.getOwnPropertyDescriptor(o,t);Object.defineProperty(i,t,e.get?e:{enumerable:!0,get:()=>o[t]})}}return i.default=o,Object.freeze(i)}const l=f(p);function v(...o){const i={},t=e=>{for(const r in e)e.hasOwnProperty(r)&&(Object.prototype.toString.call(e[r])==="[object Object]"?i[r]=v(i[r],e[r]):i[r]=e[r])};for(let e=0;e<o.length;e++)t(o[e]);return i}class m{constructor(i){this.defaultAnimationOptions={isAnimation:!1,positive:!0,positiveColor:[0,255,0],negative:!0,negativeColor:[0,255,0]},this.viewer=i.viewer,this.overlayLayer=new b({...i.graphicsLayerOptions}),this.customGreenWaveLineView=new g.default({graphics:[]}),this.viewer.map.layers.add(this.overlayLayer),this.viewer.map.layers.add(this.customGreenWaveLineView)}addGreenWaveLine(i,t={isAnimation:!1,positive:!0,positiveColor:[0,255,0],negative:!0,negativeColor:[0,255,0]}){const e=[],r=[];t=v(this.defaultAnimationOptions,t),i.map(a=>{const s=a.visible==null?!0:a.visible;if(t.isAnimation){const n=[...a.paths];r.push(...this.getAnimationPath(n,t))}e.push(this.createLine(a.paths,a.symbol,a.attributes,s))}),this.overlayLayer.addMany(e),t.isAnimation&&this.customGreenWaveLineView.addMany(r)}getAnimationPath(i,t={isAnimation:!1,positive:!0,positiveColor:[0,255,0],negative:!0,negativeColor:[0,255,0]}){const e=[];return t.positive&&e.push({attributes:{color:t.positiveColor},geometry:l.geographicToWebMercator({paths:[i],type:"polyline"})}),t.negative&&e.push({attributes:{color:t.negativeColor},geometry:l.geographicToWebMercator({paths:[i.reverse()],type:"polyline"})}),e}createLine(i,t,e={},r){const a={type:"simple-line",color:[8,69,9,.8],width:10,...t},s=new u({paths:i}),n=l.geographicToWebMercator(s);return new c({geometry:n,symbol:a,attributes:{type:"greenWaveLine",...e},visible:r})}addPointText(i){const t=[];i.map(e=>{const r=e.visible==null?!0:e.visible;t.push(this.createPointText(e.point,e.symbol,e.attributes,r))}),this.overlayLayer.addMany(t)}createPointText(i,t,e={},r){const a={type:"text",color:"white",haloColor:"black",haloSize:"1px",xoffset:3,yoffset:3,font:{size:12,family:"Josefin Slab",weight:"bold"},...t},s=new y.Point({x:i[0],y:i[1]}),n=l.geographicToWebMercator(s);return new c({geometry:n,symbol:a,attributes:{type:"greenWaveLine-Text",...e},visible:r})}hideWaveLine(i){i?this.overlayLayer.graphics.filter(e=>{const r=e.getAttribute("id");return i.includes(r)}).forEach(e=>{e.visible=!1}):this.overlayLayer.graphics.map(t=>{t.visible=!1})}showWaveLine(i){i?this.overlayLayer.graphics.filter(e=>{const r=e.getAttribute("id");return i.includes(r)}).forEach(e=>{e.visible=!0}):this.overlayLayer.graphics.map(t=>{t.visible=!0})}hideLayer(){this.overlayLayer.visible=!1,this.customGreenWaveLineView.visible=!1}showLayer(){this.overlayLayer.visible=!0,this.customGreenWaveLineView.visible=!0}clearGreenWaveLine(){this.overlayLayer.removeAll(),this.customGreenWaveLineView.removeAll()}destroy(){this.overlayLayer.removeAll(),this.customGreenWaveLineView.removeAll(),this.viewer.map.layers.remove(this.customGreenWaveLineView),this.viewer.map.layers.remove(this.overlayLayer)}}exports.default=m;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("@arcgis/core/Graphic"),y=require("@arcgis/core/geometry"),u=require("@arcgis/core/geometry/Polyline"),p=require("@arcgis/core/geometry/support/webMercatorUtils.js"),b=require("@arcgis/core/layers/GraphicsLayer"),g=require("./renderer/greenWaveline.js");function f(o){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const t in o)if(t!=="default"){const e=Object.getOwnPropertyDescriptor(o,t);Object.defineProperty(i,t,e.get?e:{enumerable:!0,get:()=>o[t]})}}return i.default=o,Object.freeze(i)}const l=f(p);function v(...o){const i={},t=e=>{for(const r in e)e.hasOwnProperty(r)&&(Object.prototype.toString.call(e[r])==="[object Object]"?i[r]=v(i[r],e[r]):i[r]=e[r])};for(let e=0;e<o.length;e++)t(o[e]);return i}class m{constructor(i){this.defaultAnimationOptions={isAnimation:!1,positive:!0,positiveColor:[0,255,0],negative:!0,negativeColor:[0,255,0]},this.viewer=i.viewer,this.overlayLayer=new b({...i.graphicsLayerOptions}),this.customGreenWaveLineView=new g.default({graphics:[]}),this.viewer.map.layers.add(this.overlayLayer),this.viewer.map.layers.add(this.customGreenWaveLineView)}addGreenWaveLine(i,t={isAnimation:!1,positive:!0,positiveColor:[0,255,0],negative:!0,negativeColor:[0,255,0]}){const e=[],r=[];t=v(this.defaultAnimationOptions,t),i.map(a=>{const s=a.visible==null?!0:a.visible;if(t.isAnimation){const n=[...a.paths];r.push(...this.getAnimationPath(n,t))}e.push(this.createLine(a.paths,a.symbol,a.attributes,s))}),this.overlayLayer.addMany(e),t.isAnimation&&this.customGreenWaveLineView.addMany(r)}getAnimationPath(i,t={isAnimation:!1,positive:!0,positiveColor:[0,255,0],negative:!0,negativeColor:[0,255,0]}){const e=[];return t.positive&&e.push({attributes:{color:t.positiveColor},geometry:l.geographicToWebMercator({paths:[i],type:"polyline"})}),t.negative&&e.push({attributes:{color:t.negativeColor},geometry:l.geographicToWebMercator({paths:[i.reverse()],type:"polyline"})}),e}createLine(i,t,e={},r){const a={type:"simple-line",color:[8,69,9,.8],width:5,...t},s=new u({paths:i}),n=l.geographicToWebMercator(s);return new c({geometry:n,symbol:a,attributes:{type:"greenWaveLine",...e},visible:r})}addPointText(i){const t=[];i.map(e=>{const r=e.visible==null?!0:e.visible;t.push(this.createPointText(e.point,e.symbol,e.attributes,r))}),this.overlayLayer.addMany(t)}createPointText(i,t,e={},r){const a={type:"text",color:"white",haloColor:"black",haloSize:"1px",xoffset:3,yoffset:3,font:{size:12,family:"Josefin Slab",weight:"bold"},...t},s=new y.Point({x:i[0],y:i[1]}),n=l.geographicToWebMercator(s);return new c({geometry:n,symbol:a,attributes:{type:"greenWaveLine-Text",...e},visible:r})}hideWaveLine(i){i?this.overlayLayer.graphics.filter(e=>{const r=e.getAttribute("id");return i.includes(r)}).forEach(e=>{e.visible=!1}):this.overlayLayer.graphics.map(t=>{t.visible=!1})}showWaveLine(i){i?this.overlayLayer.graphics.filter(e=>{const r=e.getAttribute("id");return i.includes(r)}).forEach(e=>{e.visible=!0}):this.overlayLayer.graphics.map(t=>{t.visible=!0})}hideLayer(){this.overlayLayer.visible=!1,this.customGreenWaveLineView.visible=!1}showLayer(){this.overlayLayer.visible=!0,this.customGreenWaveLineView.visible=!0}clearGreenWaveLine(){this.overlayLayer.removeAll(),this.customGreenWaveLineView.removeAll()}destroy(){this.overlayLayer.removeAll(),this.customGreenWaveLineView.removeAll(),this.viewer.map.layers.remove(this.customGreenWaveLineView),this.viewer.map.layers.remove(this.overlayLayer)}}exports.default=m;

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

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

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

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("../../../types/index.js"),o=require("./signal-holo-flow.js"),i=require("./trace-holo-flow.js");class n{constructor(e){this.view=e}handleVehicleTraceData(e){this.traceHoloFlow||(this.traceHoloFlow=new i.default(this.view)),this.traceHoloFlow.handleVehicleTraceData(e)}clearHoloTrace(){var e;(e=this.traceHoloFlow)==null||e.clearTrace()}updatePanelContent(e){var t;let a=l.EVehiclePlateState.None;switch(e){case"none":a=l.EVehiclePlateState.None;break;case"plateNumber":a=l.EVehiclePlateState.PlateNumber;break;case"vehicleId":a=l.EVehiclePlateState.Id;break;case"mix":a=l.EVehiclePlateState.Mix;break}(t=this.traceHoloFlow)==null||t.updatePanelContent(a)}async handleSignalData(e){this.signalHoloFlow||(this.signalHoloFlow=new o.default(this.view)),await this.signalHoloFlow.initializeLayer(),await this.signalHoloFlow.handleSignalData(e)}clearHoloSignal(){var e;(e=this.signalHoloFlow)==null||e.clearSignal()}}exports.default=n;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../../../types/index.js"),o=require("./signal-holo-flow.js"),i=require("./trace-holo-flow.js");class c{constructor(e){this.view=e}handleVehicleTraceData(e){this.traceHoloFlow||(this.traceHoloFlow=new i.default(this.view)),this.traceHoloFlow.handleVehicleTraceData(e)}toggleTrafficObject(e){var l,a;switch(e.name.toLowerCase()){case"groundVehicle".toLowerCase():(l=this.traceHoloFlow)==null||l.toggleGroundVehicle(e.visible);break;case"elevatedVehicle".toLowerCase():(a=this.traceHoloFlow)==null||a.toggleElevatedVehicle(e.visible);break}}clearHoloTrace(){var e;(e=this.traceHoloFlow)==null||e.clearTrace()}updatePanelContent(e){var a;let l=t.EVehiclePlateState.None;switch(e){case"none":l=t.EVehiclePlateState.None;break;case"plateNumber":l=t.EVehiclePlateState.PlateNumber;break;case"vehicleId":l=t.EVehiclePlateState.Id;break;case"mix":l=t.EVehiclePlateState.Mix;break}(a=this.traceHoloFlow)==null||a.updatePanelContent(l)}async handleSignalData(e){this.signalHoloFlow||(this.signalHoloFlow=new o.default(this.view)),await this.signalHoloFlow.initializeLayer(),await this.signalHoloFlow.handleSignalData(e)}clearHoloSignal(){var e;(e=this.signalHoloFlow)==null||e.clearSignal()}}exports.default=c;

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

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