gisviewer-vue3-arcgis 1.0.154 → 1.0.156

package/es/src/gis-map/utils/open-drive-renderer/index.mjs

@@ -3,16 +3,17 @@ import * as j from "@arcgis/core/core/promiseUtils";
 import { Polygon as N } from "@arcgis/core/geometry";
 import * as L from "@arcgis/core/geometry/geometryEngine";
 import k from "@arcgis/core/layers/FeatureLayer";
-import v from "@arcgis/core/layers/GraphicsLayer";
+import I from "@arcgis/core/layers/GraphicsLayer";
 import * as G from "@turf/helpers";
 import { lineSliceAlong as C } from "@turf/line-slice-along";
 import b from "axios";
-import $ from "md5";
+import { XMLParser as $ } from "fast-xml-parser";
+import F from "md5";
 import O from "pako";
-import { watch as x } from "vue";
+import { watch as P } from "vue";
 import J from "../../stores/index.mjs";
-import P from "../common-utils.mjs";
-class F {
+import E from "../common-utils.mjs";
+class x {
   constructor(e) {
     this.junctionNames = /* @__PURE__ */ new Map(), this.projectName = "", this.openDriveServer = "", this.currentSectionCode = "", this.selectedSectionIds = [], this.currentJunctionId = "", this.view = e, this.laneLayer = new k({
       id: "OpenDriveLane",
@@ -287,7 +288,7 @@ class F {
           }
         }
       ]
-    }), this.junctionLayer = new v({ id: "OpenDriveJunction" }), this.sectionLayer = new v({ id: "OpenDriveSection" }), this.highlightLayer = new v({ id: "OpenDriveHighlight" }), this.flashLayer = new v({ id: "OpenDriveFlash" }), this.drawLayer = new v({ id: "Draw" }), this.splitLaneLayer = new v({ id: "SplitLane" }), this.view.map.addMany([
+    }), this.junctionLayer = new I({ id: "OpenDriveJunction" }), this.sectionLayer = new I({ id: "OpenDriveSection" }), this.highlightLayer = new I({ id: "OpenDriveHighlight" }), this.flashLayer = new I({ id: "OpenDriveFlash" }), this.drawLayer = new I({ id: "Draw" }), this.splitLaneLayer = new I({ id: "SplitLane" }), this.borderLayer = new I({ id: "OpenDriveBorder" }), this.view.map.addMany([
       this.laneLayer,
       this.junctionLayer,
       this.sectionLayer,
@@ -295,18 +296,23 @@ class F {
       this.highlightLayer,
       this.flashLayer,
       this.drawLayer,
-      this.splitLaneLayer
+      this.splitLaneLayer,
+      this.borderLayer
     ]);
   }
   static getInstance(e) {
-    return this.instance || (this.instance = new F(e)), this.instance;
+    return this.instance || (this.instance = new x(e)), this.instance;
   }
   async makeMd5FromFile(e) {
+    var t;
     try {
-      const i = await (await fetch(e)).text();
-      return { status: 0, message: "ok", result: $(i) };
-    } catch (t) {
-      return { status: -1, message: t.message };
+      const r = await (await fetch(e)).text(), n = (t = new $({
+        ignoreAttributes: !1,
+        allowBooleanAttributes: !0
+      }).parse(r).OpenDRIVE.userData) == null ? void 0 : t.border;
+      return { status: 0, message: "ok", result: { md5: F(r), border: n } };
+    } catch (i) {
+      return { status: -1, message: i.message };
     }
   }
   /**
@@ -315,12 +321,12 @@ class F {
    * @returns
    */
   async showOpenDriveFromFile(e) {
-    var g, p;
+    var f, p;
     this.openDriveClickCallback = e.selectedCallback, console.time("md5用时");
     const t = await this.makeMd5FromFile(e.file);
     if (t.status !== 0)
       return t;
-    this.projectName = t.result, console.timeEnd("md5用时"), this.openDriveServer = e.server, await this.makeMd5FromFile(e.file);
+    this.projectName = t.result.md5, console.timeEnd("md5用时"), console.log(t.result.border), this.openDriveServer = e.server;
     const i = `http://${this.openDriveServer}/api/openDrive/uploadXodr`;
     let r;
     try {
@@ -341,7 +347,7 @@ class F {
       return { status: -1, message: r.statusText };
     console.time("渲染用时");
     const s = r.data.result.geoSetting;
-    P.setGeoData(
+    E.setGeoData(
       s.geoReference,
       s.offsetX,
       s.offsetY
@@ -351,17 +357,17 @@ class F {
     const a = await (await fetch(c)).arrayBuffer(), o = O.inflate(a, { to: "string" }), l = JSON.parse(o);
     await this.showAllLanes(
       l,
-      ((g = e.options) == null ? void 0 : g.showJunctionLane) || !1,
+      ((f = e.options) == null ? void 0 : f.showJunctionLane) || !1,
       ((p = e.options) == null ? void 0 : p.showRoadName) || !0
     );
     const d = r.data.result.junctions;
     this.showJunction(d), e.options && e.options.centerMap !== !1 && await this.view.goTo(this.allLaneGraphics), this.mouseMoveHandler || this.monitorMouseMove(), this.mouseClickHandler || this.monitorMouseClick();
     const h = J.useAppDataStore;
-    return x(
+    return P(
       () => h.isSketching,
       () => {
-        var m, f;
-        h.isSketching ? ((m = this.mouseMoveHandler) == null || m.remove(), this.mouseMoveHandler = void 0, (f = this.mouseClickHandler) == null || f.remove(), this.mouseClickHandler = void 0) : (this.monitorMouseMove(), this.monitorMouseClick());
+        var m, g;
+        h.isSketching ? ((m = this.mouseMoveHandler) == null || m.remove(), this.mouseMoveHandler = void 0, (g = this.mouseClickHandler) == null || g.remove(), this.mouseClickHandler = void 0) : (this.monitorMouseMove(), this.monitorMouseClick());
       }
     ), console.timeEnd("渲染用时"), { status: 0, message: "ok" };
   }
@@ -408,7 +414,7 @@ class F {
         const { id: l, refLine: d } = o;
         let h = o.name;
         h.includes("(") && (h = h.slice(0, h.indexOf("("))), h = h.replace(/(.)/g, "$1 ");
-        const g = new y({
+        const f = new y({
           geometry: {
             type: "polyline",
             paths: [d]
@@ -419,14 +425,14 @@ class F {
             roadName: h
           }
         });
-        this.allRefLineGraphics.push(g), o.laneSections.sort((p, m) => Number(p.id) - Number(m.id));
+        this.allRefLineGraphics.push(f), o.laneSections.sort((p, m) => Number(p.id) - Number(m.id));
         for (let p = 0; p < o.laneSections.length; p++) {
-          const m = o.laneSections[p], f = Number(m.id);
+          const m = o.laneSections[p], g = Number(m.id);
           for (const u of m.lanePaths) {
             const w = Number(u.id);
             if (w === 0)
               continue;
-            const I = u.type, M = [...u.outerPath], S = u.innerPath.concat(
+            const v = u.type, M = [...u.outerPath], S = u.innerPath.concat(
               M.reverse()
             );
             if (S.length <= 3) {
@@ -442,15 +448,15 @@ class F {
                 geometry: A,
                 attributes: {
                   ObjectID: c++,
-                  id: `${l}+${f}+${w}`,
+                  id: `${l}+${g}+${w}`,
                   fromNode: o.fromNode,
                   toNode: o.toNode,
                   roadId: String(l),
                   roadName: o.name,
-                  sectionId: String(f),
+                  sectionId: String(g),
                   sectionIndex: p,
                   laneId: w,
-                  type: I,
+                  type: v,
                   sumoId: "",
                   // 记录左右边线的起始点，用于按长度高亮车道的一部分
                   leftLine: u.innerPath,
@@ -505,9 +511,10 @@ class F {
         },
         symbol: {
           type: "picture-marker",
-          url: i.crossId ? "/GisViewerAssets/Images/point_green.png" : "/GisViewerAssets/Images/point_yellow.png",
-          width: 30,
-          height: 30
+          url: i.crossId ? "/GisViewerAssets/Images/xhj_1.png" : "/GisViewerAssets/Images/xhj_2.png",
+          width: "18px",
+          height: "28px",
+          yoffset: "9px"
         },
         popupTemplate: {
           title: i.name,
@@ -561,7 +568,7 @@ class F {
           (u) => `${u.attributes.roadId}+${u.attributes.sectionId}` === n
         ), l = L.union(
           o.map((u) => u.geometry)
-        ), d = this.hitGraphic.getAttribute("fromNode"), h = this.hitGraphic.getAttribute("toNode"), g = this.junctionNames.get(d) || d, p = this.junctionNames.get(h) || h, m = new y({
+        ), d = this.hitGraphic.getAttribute("fromNode"), h = this.hitGraphic.getAttribute("toNode"), f = this.junctionNames.get(d) || d, p = this.junctionNames.get(h) || h, m = new y({
           geometry: l,
           symbol: {
             type: "simple-fill",
@@ -576,7 +583,7 @@ class F {
             type: "OpenDriveSection",
             id: n,
             selected: !1,
-            fromNodeName: g,
+            fromNodeName: f,
             toNodeName: p,
             laneCount: o.length
           },
@@ -604,10 +611,10 @@ class F {
           }
         });
         this.highlightLayer.removeAll(), this.highlightLayer.add(m);
-        const f = this.view.toMap(t);
+        const g = this.view.toMap(t);
         this.view.openPopup({
           features: [m],
-          location: f
+          location: g
         });
       } else if (s.layer.id === "OpenDriveJunction") {
         const n = this.hitGraphic.getAttribute("id");
@@ -806,9 +813,9 @@ class F {
           type: "simple-marker",
           style: "circle",
           size: 30,
-          color: [255, 0, 0, 0.6],
+          color: [0, 0, 255, 0.6],
           outline: {
-            color: "red",
+            color: "blue",
             width: 1
           }
         }
@@ -860,10 +867,9 @@ class F {
         geometry: n,
         symbol: {
           type: "simple-fill",
-          color: [255, 0, 0, 0.5],
+          color: [0, 0, 255, 0.6],
           style: "solid",
           outline: {
-            color: "red",
             width: 0
           }
         }
@@ -978,13 +984,13 @@ class F {
           type: "edge",
           id: d
         });
-        const h = `http://${this.openDriveServer}/api/sumo/getSumoEdge`, g = await b.get(h, {
+        const h = `http://${this.openDriveServer}/api/sumo/getSumoEdge`, f = await b.get(h, {
           params: {
             id: `${o}+${a.getAttribute("sectionId")}`,
             projectName: this.projectName
           }
         });
-        g.status === 200 && g.data.status === 0 && s.push(g.data.result);
+        f.status === 200 && f.data.status === 0 && s.push(f.data.result);
       }
     }
     const c = this.junctionLayer.graphics.filter((a) => {
@@ -1021,20 +1027,20 @@ class F {
     const r = Number(i[1]), s = i[0].split("#"), c = s.length === 2 ? Number(s[1]) : 0;
     let n = s[0];
     n.startsWith("-") && (n = n.slice(1));
-    const a = this.allLaneGraphics.filter((I) => I.getAttribute("roadId") === n && I.getAttribute("sectionIndex") === c);
+    const a = this.allLaneGraphics.filter((v) => v.getAttribute("roadId") === n && v.getAttribute("sectionIndex") === c);
     if (a.length === 0)
       return { status: -1, message: "未找到路段" };
     const o = a.length - r, l = a.find(
-      (I) => Math.abs(I.getAttribute("laneId")) === o
+      (v) => Math.abs(v.getAttribute("laneId")) === o
     );
     if (!l)
       return { status: -1, message: "未找到车道" };
-    const d = e.start || 0, h = e.end || 100, g = G.lineString(l.getAttribute("leftLine")), p = C(g, d, h, {
+    const d = e.start || 0, h = e.end || 100, f = G.lineString(l.getAttribute("leftLine")), p = C(f, d, h, {
       units: "meters"
-    }), m = G.lineString(l.getAttribute("rightLine")), f = C(m, d, h, {
+    }), m = G.lineString(l.getAttribute("rightLine")), g = C(m, d, h, {
       units: "meters"
     }), u = p.geometry.coordinates.concat(
-      f.geometry.coordinates.reverse()
+      g.geometry.coordinates.reverse()
     );
     u.push(u[u.length - 1]);
     const w = new y({
@@ -1054,7 +1060,7 @@ class F {
         type: l.getAttribute("type"),
         sumoId: l.getAttribute("sumoId"),
         leftLine: p.geometry.coordinates,
-        rightLine: f.geometry.coordinates
+        rightLine: g.geometry.coordinates
       },
       symbol: {
         type: "simple-fill",
@@ -1071,5 +1077,5 @@ class F {
   }
 }
 export {
-  F as default
+  x as default
 };

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

@@ -2,7 +2,7 @@ import Graphic from '@arcgis/core/Graphic';
 import GraphicsLayer from '@arcgis/core/layers/GraphicsLayer';
 import MapView from '@arcgis/core/views/MapView';
 import SceneView from '@arcgis/core/views/SceneView';
-import { IOverlay, IOverlayParam, IPointSymbol, IResult } from '../../types';
+import { IMaskParam, IOverlay, IOverlayParam, IPointSymbol, IResult } from '../../types';
 interface IOverlayOptions {
     id: string;
 }
@@ -11,6 +11,8 @@ export default class Overlay {
     overlayLayer: GraphicsLayer;
     constructor(view: MapView | SceneView, options?: IOverlayOptions);
     private defaultPointSymbol;
+    addMask(params: IMaskParam): void;
+    removeMask(): void;
     /**
      * 添加覆盖物
      * @param params

package/es/src/gis-map/utils/overlay.mjs

@@ -1,30 +1,62 @@
-import o from "@arcgis/core/Graphic";
-import l from "@arcgis/core/layers/GraphicsLayer";
-class v {
-  constructor(r, s) {
+import { Polygon as n } from "@arcgis/core/geometry";
+import * as l from "@arcgis/core/geometry/geometryEngine";
+import y from "@arcgis/core/Graphic";
+import h from "@arcgis/core/layers/GraphicsLayer";
+class u {
+  constructor(e, s) {
     this.defaultPointSymbol = {
       type: "simple-marker",
       style: "circle",
       color: "yellow",
       size: 10
-    }, this.view = r, this.overlayLayer = new l({
+    }, this.view = e, this.overlayLayer = new h({
       ...s
     }), this.view.map.layers.add(this.overlayLayer);
   }
+  addMask(e) {
+    this.removeMask();
+    const s = e.maskColor || [100, 100, 100, 0.8], i = e.maskSize || 100, r = new n({
+      rings: e.geometry.rings
+    }), t = r.centroid, a = l.geodesicBuffer(
+      t,
+      i,
+      "kilometers"
+    ), o = l.difference(
+      a,
+      r
+    ), d = new y({
+      geometry: o,
+      symbol: {
+        type: "simple-fill",
+        color: s,
+        outline: {
+          style: "none"
+        }
+      },
+      attributes: { type: "mask" }
+    });
+    this.overlayLayer.add(d);
+  }
+  removeMask() {
+    const e = this.overlayLayer.graphics.find(
+      (s) => s.getAttribute("type") === "mask"
+    );
+    e && this.overlayLayer.remove(e);
+  }
   /**
    * 添加覆盖物
    * @param params
    */
-  addOverlays(r) {
+  addOverlays(e) {
     let s = 0, i = 0;
-    for (const e of r.overlays) {
-      e.properties ? (e.properties.type || (e.properties.type = r.type), e.properties.id || (e.properties.id = e.id)) : e.properties = { type: r.type, id: e.id };
-      const t = e.symbol || r.defaultSymbol || this.defaultPointSymbol;
+    for (const r of e.overlays) {
+      r.properties ? (r.properties.type || (r.properties.type = e.type), r.properties.id || (r.properties.id = r.id)) : r.properties = { type: e.type, id: r.id };
+      const t = r.symbol || e.defaultSymbol || this.defaultPointSymbol;
       this.addOverlay(
-        e,
+        r,
         t,
-        e.properties,
-        e.visible
+        r.properties,
+        r.visible
       ).message === "add" ? s++ : i++;
     }
     return { status: 0, message: `新增${s}, 更新${i}` };
@@ -33,10 +65,10 @@ class v {
    * 按type移除覆盖物
    * @param types
    */
-  removeOverlaysByType(r) {
+  removeOverlaysByType(e) {
     const s = this.overlayLayer.graphics.filter((i) => {
-      const e = i.getAttribute("type");
-      return r.includes(e);
+      const r = i.getAttribute("type");
+      return e.includes(r);
     });
     return this.overlayLayer.graphics.removeMany(s), { status: 0, message: `删除${s.length}` };
   }
@@ -44,10 +76,10 @@ class v {
    * 按id移除覆盖物
    * @param ids
    */
-  removeOverlaysById(r) {
+  removeOverlaysById(e) {
     const s = this.overlayLayer.graphics.filter((i) => {
-      const e = i.getAttribute("id");
-      return r.includes(e);
+      const r = i.getAttribute("id");
+      return e.includes(r);
     });
     return this.overlayLayer.graphics.removeMany(s), { status: 0, message: `删除${s.length}` };
   }
@@ -56,10 +88,10 @@ class v {
    * @param ids
    * @param isShow
    */
-  isShowOverlaysByIds(r, s) {
+  isShowOverlaysByIds(e, s) {
     this.overlayLayer.graphics.map((i) => {
-      const e = i.getAttribute("id");
-      r.includes(e) ? i.visible = s : i.visible = !s;
+      const r = i.getAttribute("id");
+      e.includes(r) ? i.visible = s : i.visible = !s;
     });
   }
   /**
@@ -68,8 +100,8 @@ class v {
    * @memberof Overlay
    */
   showAllOverlays() {
-    this.overlayLayer.graphics.forEach((r) => {
-      r.visible = !0;
+    this.overlayLayer.graphics.forEach((e) => {
+      e.visible = !0;
     });
   }
   /**
@@ -77,8 +109,8 @@ class v {
    * @returns
    */
   removeAllOverlays() {
-    const r = this.overlayLayer.graphics.length;
-    return this.overlayLayer.removeAll(), { status: 0, message: `删除${r}` };
+    const e = this.overlayLayer.graphics.length;
+    return this.overlayLayer.removeAll(), { status: 0, message: `删除${e}` };
   }
   /**
    * 销毁
@@ -88,8 +120,8 @@ class v {
   destroy() {
     this.view.map.remove(this.overlayLayer), this.overlayLayer.destroy();
   }
-  removeGraphics(r) {
-    Array.isArray(r) || (r = [r]), this.overlayLayer.graphics.removeMany(r);
+  removeGraphics(e) {
+    Array.isArray(e) || (e = [e]), this.overlayLayer.graphics.removeMany(e);
   }
   /**
    * 查找当前点击是否有覆盖物在当前图层
@@ -99,9 +131,9 @@ class v {
    * @returns
    * @memberof Overlay
    */
-  async findGraphic(r) {
-    var e;
-    return (e = (await this.view.hitTest(r)).results) == null ? void 0 : e.filter(
+  async findGraphic(e) {
+    var r;
+    return (r = (await this.view.hitTest(e)).results) == null ? void 0 : r.filter(
       (t) => t.type === "graphic" && t.graphic.layer === this.overlayLayer
     );
   }
@@ -127,23 +159,23 @@ class v {
    * @param symbol
    * @param properties
    */
-  addPoint(r, s, i, e) {
+  addPoint(e, s, i, r) {
     let t, a = !0;
-    return r.id && (t = this.overlayLayer.graphics.find(
-      (y) => y.getAttribute("id") === r.id
-    )), t ? t.visible = e ?? t.visible : (e = e ?? !0, t = new o({
-      visible: e
-    }), this.overlayLayer.add(t), a = !1), t.geometry = r.geometry, t.symbol = s, t.attributes = i, { status: 0, message: a ? "add" : "update" };
+    return e.id && (t = this.overlayLayer.graphics.find(
+      (o) => o.getAttribute("id") === e.id
+    )), t ? t.visible = r ?? t.visible : (r = r ?? !0, t = new y({
+      visible: r
+    }), this.overlayLayer.add(t), a = !1), t.geometry = e.geometry, t.symbol = s, t.attributes = i, { status: 0, message: a ? "add" : "update" };
   }
-  addOverlay(r, s, i, e) {
+  addOverlay(e, s, i, r) {
     let t, a = !0;
-    return r.id && (t = this.overlayLayer.graphics.find(
-      (y) => y.getAttribute("id") === r.id
-    )), t ? t.visible = e ?? t.visible : (e = e ?? !0, t = new o({
-      visible: e
-    }), this.overlayLayer.add(t), a = !1), t.geometry = r.geometry, t.symbol = s, t.attributes = i, { status: 0, message: a ? "add" : "update" };
+    return e.id && (t = this.overlayLayer.graphics.find(
+      (o) => o.getAttribute("id") === e.id
+    )), t ? t.visible = r ?? t.visible : (r = r ?? !0, t = new y({
+      visible: r
+    }), this.overlayLayer.add(t), a = !1), t.geometry = e.geometry, t.symbol = s, t.attributes = i, { status: 0, message: a ? "add" : "update" };
   }
 }
 export {
-  v as default
+  u as default
 };

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

@@ -5,10 +5,12 @@ export default class SignalControlAreaController {
     private subDistrictControllerLayer;
     private crossLayer;
     private highlightLayer;
+    private districtControllers;
     private watchHandle?;
+    private openDriveServerUrl;
     private readonly crossScale;
     constructor(view: __esri.MapView | __esri.SceneView);
-    showSignalControlArea(params: any): IResult;
+    showSignalControlArea(params: any): Promise<IResult>;
     clearSignalControlArea(): IResult;
     locateSignalControlArea(params: {
         id: string;
@@ -25,12 +27,14 @@ export default class SignalControlAreaController {
      */
     private findAreaGraphic;
     /**
-     * 绘制区控与子区
+     * 显示区控
      * @param districtController
-     * @param isDistrict 是否是区控
      * @returns
      */
-    private drawArea;
+    private showDistrict;
+    private showSubDistrictCross;
+    private loadedSubDistricts;
+    private showSubDistrictRoad;
     /**
      * 生成路口点符号。在不同比例尺下，使用不同的符号
      * @param attributes