gisviewer-vue3-arcgis 1.0.149 → 1.0.151

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

@@ -1,23 +1,20 @@
 import y from "@arcgis/core/Graphic";
 import * as j from "@arcgis/core/core/promiseUtils";
-import { Polygon as S } from "@arcgis/core/geometry";
+import { Polygon as N } from "@arcgis/core/geometry";
 import * as L from "@arcgis/core/geometry/geometryEngine";
 import k from "@arcgis/core/layers/FeatureLayer";
-import I from "@arcgis/core/layers/GraphicsLayer";
+import v 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 M from "md5";
+import $ from "md5";
 import O from "pako";
 import { watch as x } from "vue";
 import J from "../../stores/index.mjs";
 import P from "../common-utils.mjs";
 class F {
   constructor(e) {
-    this.junctionNames = /* @__PURE__ */ new Map(), this.projectName = "", this.openDriveServer = "", this.currentSectionCode = "", this.currentJunctionId = "", this.view = e, this.view.popup.visibleElements = {
-      collapseButton: !1,
-      actionBar: !1
-    }, this.laneLayer = new k({
+    this.junctionNames = /* @__PURE__ */ new Map(), this.projectName = "", this.openDriveServer = "", this.currentSectionCode = "", this.selectedSectionIds = [], this.currentJunctionId = "", this.view = e, this.laneLayer = new k({
       id: "OpenDriveLane",
       fields: [
         {
@@ -45,6 +42,11 @@ class F {
           alias: "路段号",
           type: "string"
         },
+        {
+          name: "sectionIndex",
+          alias: "路段序号",
+          type: "string"
+        },
         {
           name: "laneId",
           alias: "车道号",
@@ -285,7 +287,7 @@ class F {
           }
         }
       ]
-    }), 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.view.map.addMany([
+    }), 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.laneLayer,
       this.junctionLayer,
       this.sectionLayer,
@@ -302,7 +304,7 @@ class F {
   async makeMd5FromFile(e) {
     try {
       const i = await (await fetch(e)).text();
-      return { status: 0, message: "ok", result: M(i) };
+      return { status: 0, message: "ok", result: $(i) };
     } catch (t) {
       return { status: -1, message: t.message };
     }
@@ -320,9 +322,9 @@ class F {
       return t;
     this.projectName = t.result, console.timeEnd("md5用时"), this.openDriveServer = e.server, await this.makeMd5FromFile(e.file);
     const i = `http://${this.openDriveServer}/api/openDrive/uploadXodr`;
-    let o;
+    let r;
     try {
-      o = await b.post(
+      r = await b.post(
         i,
         {},
         {
@@ -335,31 +337,31 @@ class F {
     } catch (m) {
       return { status: -1, message: m.message };
     }
-    if (o.status !== 200)
-      return { status: -1, message: o.statusText };
+    if (r.status !== 200)
+      return { status: -1, message: r.statusText };
     console.time("渲染用时");
-    const s = o.data.result.geoSetting;
+    const s = r.data.result.geoSetting;
     P.setGeoData(
       s.geoReference,
       s.offsetX,
       s.offsetY
     );
-    let c = o.data.result.json;
+    let c = r.data.result.json;
     c.startsWith(window.location.protocol) || (c = `${window.location.protocol}//${e.server}${c}`);
-    const l = await (await fetch(c)).arrayBuffer(), r = O.inflate(l, { to: "string" }), n = JSON.parse(r);
+    const a = await (await fetch(c)).arrayBuffer(), o = O.inflate(a, { to: "string" }), l = JSON.parse(o);
     await this.showAllLanes(
-      n,
+      l,
       ((g = e.options) == null ? void 0 : g.showJunctionLane) || !1,
       ((p = e.options) == null ? void 0 : p.showRoadName) || !0
     );
-    const h = o.data.result.junctions;
-    this.showJunction(h), e.options && e.options.centerMap !== !1 && await this.view.goTo(this.allLaneGraphics), this.mouseMoveHandler || this.monitorMouseMove(), this.mouseClickHandler || this.monitorMouseClick();
-    const d = J.useAppDataStore;
+    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(
-      () => d.isSketching,
+      () => h.isSketching,
       () => {
-        var m, u;
-        d.isSketching ? ((m = this.mouseMoveHandler) == null || m.remove(), this.mouseMoveHandler = void 0, (u = this.mouseClickHandler) == null || u.remove(), this.mouseClickHandler = void 0) : (this.monitorMouseMove(), this.monitorMouseClick());
+        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());
       }
     ), console.timeEnd("渲染用时"), { status: 0, message: "ok" };
   }
@@ -369,7 +371,7 @@ class F {
    * @param projectName
    */
   async showOpenDriveFromServer(e, t) {
-    const i = `http://${e}/api/openDrive/analyzeXodr`, o = await b.get(i, {
+    const i = `http://${e}/api/openDrive/analyzeXodr`, r = await b.get(i, {
       headers: {
         projectName: t
       },
@@ -378,12 +380,12 @@ class F {
         compressed: !0
       }
     });
-    if (o.status !== 200)
-      throw new Error(`OpenDriveRenderer: ${o.statusText}`);
-    let s = o.data.result.json;
+    if (r.status !== 200)
+      throw new Error(`OpenDriveRenderer: ${r.statusText}`);
+    let s = r.data.result.json;
     s.startsWith(window.location.protocol) || (s = `${window.location.protocol}//${e}${s}`);
-    const a = await (await fetch(s)).arrayBuffer(), l = O.inflate(a, { to: "string" }), r = JSON.parse(l);
-    return await this.showAllLanes(r, !1, !1), { status: 0, message: "ok" };
+    const n = await (await fetch(s)).arrayBuffer(), a = O.inflate(n, { to: "string" }), o = JSON.parse(a);
+    return await this.showAllLanes(o, !1, !1), { status: 0, message: "ok" };
   }
   /**
    * 显示所有车道
@@ -393,90 +395,89 @@ class F {
    * @returns
    */
   async showAllLanes(e, t, i) {
-    const o = await this.laneLayer.queryFeatures();
-    return o.features.length > 0 && this.laneLayer.applyEdits({
-      deleteFeatures: o.features
+    const r = await this.laneLayer.queryFeatures();
+    return r.features.length > 0 && this.laneLayer.applyEdits({
+      deleteFeatures: r.features
     }), this.roadNameLayer.visible = i, new Promise((s) => {
       let c = 0;
       this.allLaneGraphics = [], this.allRefLineGraphics = [];
-      const a = [];
-      console.log(e.length);
-      for (const r of e) {
-        if (!t && r.junction !== "-1")
+      const n = [];
+      for (const o of e) {
+        if (!t && o.junction !== "-1")
           continue;
-        const { id: n, refLine: h } = r;
-        let d = r.name;
-        d.includes("(") && (d = d.slice(0, d.indexOf("("))), d = d.replace(/(.)/g, "$1 ");
+        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({
           geometry: {
             type: "polyline",
-            paths: [h]
+            paths: [d]
           },
           attributes: {
             ObjectID: c++,
-            roadId: n,
-            roadName: d
+            roadId: l,
+            roadName: h
           }
         });
-        this.allRefLineGraphics.push(g), r.laneSections.sort((p, m) => Number(p.id) - Number(m.id));
-        for (let p = 0; p < r.laneSections.length; p++) {
-          const m = r.laneSections[p], u = Number(m.id);
-          for (const f of m.lanePaths) {
-            const w = Number(f.id);
+        this.allRefLineGraphics.push(g), 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);
+          for (const u of m.lanePaths) {
+            const w = Number(u.id);
             if (w === 0)
               continue;
-            const v = f.type, $ = [...f.outerPath], N = f.innerPath.concat(
-              $.reverse()
+            const I = u.type, M = [...u.outerPath], S = u.innerPath.concat(
+              M.reverse()
             );
-            if (N.length <= 3) {
+            if (S.length <= 3) {
               console.warn(`lane ${w} has less than 3 points`);
               continue;
             }
-            N.push(f.innerPath[0]);
-            const A = new S({
-              rings: [N]
+            S.push(u.innerPath[0]);
+            const A = new N({
+              rings: [S]
             });
             if (A) {
               const D = new y({
                 geometry: A,
                 attributes: {
                   ObjectID: c++,
-                  id: `${n}+${u}+${w}`,
-                  fromNode: r.fromNode,
-                  toNode: r.toNode,
-                  roadId: String(n),
-                  roadName: r.name,
-                  sectionId: String(u),
+                  id: `${l}+${f}+${w}`,
+                  fromNode: o.fromNode,
+                  toNode: o.toNode,
+                  roadId: String(l),
+                  roadName: o.name,
+                  sectionId: String(f),
                   sectionIndex: p,
                   laneId: w,
-                  type: v,
+                  type: I,
                   sumoId: "",
                   // 记录左右边线的起始点，用于按长度高亮车道的一部分
-                  leftLine: f.innerPath,
-                  rightLine: f.outerPath
+                  leftLine: u.innerPath,
+                  rightLine: u.outerPath
                 }
               });
-              this.allLaneGraphics.push(D), a.push(D);
+              this.allLaneGraphics.push(D), n.push(D);
             }
           }
         }
       }
-      const l = setInterval(() => {
-        if (a.length > 0 || this.allRefLineGraphics.length > 0) {
-          if (a.length > 0) {
-            const r = a.splice(0, 100);
+      const a = setInterval(() => {
+        if (n.length > 0 || this.allRefLineGraphics.length > 0) {
+          if (n.length > 0) {
+            const o = n.splice(0, 100);
             this.laneLayer.applyEdits({
-              addFeatures: r
+              addFeatures: o
             });
           }
           if (this.allRefLineGraphics.length > 0) {
-            const r = this.allRefLineGraphics.splice(0, 10);
+            const o = this.allRefLineGraphics.splice(0, 10);
             this.roadNameLayer.applyEdits({
-              addFeatures: r
+              addFeatures: o
             });
           }
         } else
-          clearInterval(l), s();
+          clearInterval(a), s();
       }, 10);
     });
   }
@@ -491,7 +492,7 @@ class F {
       if (!i)
         continue;
       this.junctionNames.set(i.id, i.name), i.nodeType = i.type;
-      const o = new y({
+      const r = new y({
         geometry: {
           type: "point",
           x: i.coordinates[0],
@@ -527,7 +528,7 @@ class F {
           ]
         }
       });
-      t.push(o);
+      t.push(r);
     }
     this.junctionLayer.addMany(t);
   }
@@ -537,32 +538,31 @@ class F {
   monitorMouseMove() {
     const e = j.debounce(async (t) => {
       var c;
-      const o = (c = (await this.view.hitTest(t, {
+      const r = (c = (await this.view.hitTest(t, {
         include: [this.laneLayer, this.junctionLayer]
       })).results) == null ? void 0 : c.filter(
-        (a) => a.type === "graphic"
+        (n) => n.type === "graphic"
       );
-      if (o.length === 0) {
-        this.currentSectionCode !== "" && (this.currentSectionCode = "", this.highlightGraphic = void 0, this.highlightLayer.removeAll()), this.currentJunctionId !== "" && (this.currentJunctionId = "", this.view.closePopup());
+      if (r.length === 0) {
+        this.currentSectionCode !== "" && (this.currentSectionCode = "", this.highlightLayer.removeAll()), this.currentJunctionId !== "" && (this.currentJunctionId = ""), this.view.closePopup();
         return;
       }
-      const s = o[0];
+      const s = r[0];
       if (this.hitGraphic = s.graphic, s.layer.id === "OpenDriveLane") {
-        const a = `${this.hitGraphic.getAttribute(
+        const n = `${this.hitGraphic.getAttribute(
           "roadId"
         )}+${this.hitGraphic.getAttribute("sectionId")}`;
-        if (a === this.currentSectionCode || this.sectionLayer.graphics.findIndex(
-          (u) => u.getAttribute("id") === a
+        if (this.currentSectionCode === n || this.selectedSectionIds.includes(n) || this.sectionLayer.graphics.findIndex(
+          (u) => u.getAttribute("id") === n
         ) >= 0)
           return;
-        this.currentSectionCode = a;
-        const r = this.allLaneGraphics.filter(
-          (u) => `${u.attributes.roadId}+${u.attributes.sectionId}` === a
-        ), n = L.union(
-          r.map((u) => u.geometry)
-        ), h = this.hitGraphic.getAttribute("fromNode"), d = this.hitGraphic.getAttribute("toNode"), g = this.junctionNames.get(h) || h, p = this.junctionNames.get(d) || d;
-        this.highlightGraphic = new y({
-          geometry: n,
+        this.currentSectionCode = n;
+        const o = this.allLaneGraphics.filter(
+          (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({
+          geometry: l,
           symbol: {
             type: "simple-fill",
             color: [0, 255, 255, 0.5],
@@ -574,11 +574,11 @@ class F {
           },
           attributes: {
             type: "OpenDriveSection",
-            id: a,
+            id: n,
             selected: !1,
             fromNodeName: g,
             toNodeName: p,
-            laneCount: r.length
+            laneCount: o.length
           },
           popupTemplate: {
             title: this.hitGraphic.getAttribute("roadName"),
@@ -602,17 +602,18 @@ class F {
               }
             ]
           }
-        }), this.highlightLayer.removeAll(), this.highlightLayer.add(this.highlightGraphic);
-        const m = this.view.toMap(t);
+        });
+        this.highlightLayer.removeAll(), this.highlightLayer.add(m);
+        const f = this.view.toMap(t);
         this.view.openPopup({
-          features: [this.highlightGraphic],
-          location: m
+          features: [m],
+          location: f
         });
       } else if (s.layer.id === "OpenDriveJunction") {
-        const a = this.hitGraphic.getAttribute("id");
-        if (a === this.currentJunctionId)
+        const n = this.hitGraphic.getAttribute("id");
+        if (n === this.currentJunctionId)
           return;
-        this.currentJunctionId = a, this.view.openPopup({
+        this.currentJunctionId = n, this.view.openPopup({
           features: [this.hitGraphic],
           location: this.hitGraphic.geometry
         });
@@ -628,58 +629,62 @@ class F {
    */
   monitorMouseClick() {
     const e = j.debounce(async (t) => {
-      var l;
-      const o = (l = (await this.view.hitTest(t, {
+      var a;
+      const r = (a = (await this.view.hitTest(t, {
         include: [this.highlightLayer, this.junctionLayer, this.sectionLayer]
-      })).results) == null ? void 0 : l.filter(
-        (r) => r.type === "graphic"
+      })).results) == null ? void 0 : a.filter(
+        (o) => o.type === "graphic"
       );
-      if (o.length === 0)
+      if (r.length === 0)
         return;
-      const s = o[0].graphic, c = s.getAttribute("type"), a = s.getAttribute("id");
+      const s = r[0].graphic, c = s.getAttribute("type"), n = s.getAttribute("id");
       if (c === "OpenDriveJunction")
         if (s.getAttribute("selected") === !1) {
-          const r = `http://${this.openDriveServer}/api/sumo/getSumoJunction`, n = await b.get(r, {
+          const o = `http://${this.openDriveServer}/api/sumo/getSumoJunction`, l = await b.get(o, {
             params: {
-              id: a,
+              id: n,
               projectName: this.projectName
             }
           });
-          n.status === 200 && n.data.status === 0 && (this.openDriveClickCallback && this.openDriveClickCallback({
+          l.status === 200 && l.data.status === 0 && (this.openDriveClickCallback && this.openDriveClickCallback({
             type: "OpenDriveJunction",
-            id: a,
-            details: n.data.result
+            id: n,
+            details: l.data.result
           }), s.setAttribute("selected", !0), s.symbol.url = "/GisViewerAssets/Images/point_red.png", this.increasePictureMarkerSize(s, 50));
         } else {
           this.openDriveClickCallback && this.openDriveClickCallback({
             type: "OpenDriveJunction",
-            id: a,
+            id: n,
             details: void 0
           }), s.setAttribute("selected", !1);
-          const r = s.getAttribute("crossId");
-          s.symbol.url = r ? "/GisViewerAssets/Images/point_green.png" : "/GisViewerAssets/Images/point_yellow.png", this.decreasePictureMarkerSize(s, 30);
+          const o = s.getAttribute("crossId");
+          s.symbol.url = o ? "/GisViewerAssets/Images/point_green.png" : "/GisViewerAssets/Images/point_yellow.png", this.decreasePictureMarkerSize(s, 30);
         }
       else if (c === "OpenDriveSection")
-        if (s.getAttribute("selected"))
-          this.sectionLayer.remove(s), this.openDriveClickCallback && this.openDriveClickCallback({
-            type: "OpenDriveSection",
-            id: a,
-            details: void 0
-          });
-        else {
-          this.highlightLayer.remove(s), this.sectionLayer.add(s), s.setAttribute("selected", !0);
-          const r = `http://${this.openDriveServer}/api/sumo/getSumoEdge`, n = await b.get(r, {
+        if (s.layer.id === "OpenDriveHighlight") {
+          this.highlightLayer.remove(s), this.sectionLayer.add(s), s.setAttribute("selected", !0), this.selectedSectionIds.push(n);
+          const o = `http://${this.openDriveServer}/api/sumo/getSumoEdge`, l = await b.get(o, {
             params: {
-              id: a,
+              id: n,
               projectName: this.projectName
             }
           });
-          n.status === 200 && n.data.status === 0 && this.openDriveClickCallback && (s.setAttribute("edgeId", n.data.result.obj_id), this.openDriveClickCallback({
+          if (l.status === 200 && l.data.status === 0 && this.openDriveClickCallback) {
+            const d = l.data.result.obj_id;
+            s.setAttribute("edgeId", d), this.openDriveClickCallback({
+              type: "OpenDriveSection",
+              id: d,
+              details: l.data.result
+            });
+          }
+        } else
+          this.sectionLayer.remove(s), this.selectedSectionIds = this.selectedSectionIds.filter(
+            (o) => o !== n
+          ), this.openDriveClickCallback && this.openDriveClickCallback({
             type: "OpenDriveSection",
-            id: a,
-            details: n.data.result
-          }));
-        }
+            id: s.getAttribute("edgeId"),
+            details: void 0
+          });
     });
     this.mouseClickHandler = this.view.on("immediate-click", async (t) => {
       e(t).catch(() => {
@@ -693,10 +698,10 @@ class F {
    */
   increasePictureMarkerSize(e, t) {
     const i = setInterval(() => {
-      const o = e.symbol, s = o.width;
+      const r = e.symbol, s = r.width;
       s < t ? e.symbol = {
         type: "picture-marker",
-        url: o.url,
+        url: r.url,
         width: s + 1,
         height: s + 1
       } : clearInterval(i);
@@ -709,10 +714,10 @@ class F {
    */
   decreasePictureMarkerSize(e, t) {
     const i = setInterval(() => {
-      const o = e.symbol, s = o.width;
+      const r = e.symbol, s = r.width;
       s > t ? e.symbol = {
         type: "picture-marker",
-        url: o.url,
+        url: r.url,
         width: s - 1,
         height: s - 1
       } : clearInterval(i);
@@ -733,21 +738,21 @@ class F {
         const t = e.id.split("#");
         let i = t[0];
         i.startsWith("-") && (i = i.slice(1));
-        let o = 0;
-        t.length === 2 && (o = Number(t[1]));
+        let r = 0;
+        t.length === 2 && (r = Number(t[1]));
         const s = this.allLaneGraphics.find(
-          (c) => c.getAttribute("roadId") === i && c.getAttribute("sectionIndex") === o
+          (c) => c.getAttribute("roadId") === i && c.getAttribute("sectionIndex") === r
         );
         if (s) {
           const c = `${i}+${s.getAttribute(
             "sectionId"
-          )}`, a = `http://${this.openDriveServer}/api/sumo/getSumoEdge`, l = await b.get(a, {
+          )}`, n = `http://${this.openDriveServer}/api/sumo/getSumoEdge`, a = await b.get(n, {
             params: {
               id: c,
               projectName: this.projectName
             }
           });
-          return l.status === 200 ? l.data : { status: -1, message: `路段信息查询失败: ${c}` };
+          return a.status === 200 ? a.data : { status: -1, message: `路段信息查询失败: ${c}` };
         } else
           return { status: -1, message: "未知类型" };
       }
@@ -773,29 +778,29 @@ class F {
    * @returns
    */
   async findSumo(e) {
-    const { type: t, id: i } = e, o = e.flash === void 0 ? !0 : e.flash;
+    const { type: t, id: i } = e, r = e.flash === void 0 ? !0 : e.flash;
     if (t === "junction")
-      return await this.findJunction(i, o);
+      return await this.findJunction(i, r);
     if (t === "edge") {
       const s = i.split("_");
       if (s.length > 2)
         return { status: -1, message: "id格式错误" };
-      const c = s.length === 2 ? Number(s[1]) : void 0, a = s[0].split("#");
-      if (a.length > 2)
+      const c = s.length === 2 ? Number(s[1]) : void 0, n = s[0].split("#");
+      if (n.length > 2)
         return { status: -1, message: "id格式错误" };
-      const l = a[0], r = a.length === 2 ? Number(a[1]) : void 0;
-      return await this.findLane({ roadsectId: l, segmentId: r, laneId: c, flash: o });
+      const a = n[0], o = n.length === 2 ? Number(n[1]) : void 0;
+      return await this.findLane({ roadsectId: a, segmentId: o, laneId: c, flash: r });
     } else
       return { status: -1, message: "未知类型" };
   }
   async findJunction(e, t) {
     const i = this.junctionLayer.graphics.find(
-      (o) => o.attributes.id === e
+      (r) => r.attributes.id === e
     );
     if (!i)
       return { status: -1, message: "未找到。请检查路口编号" };
     if (t) {
-      const o = new y({
+      const r = new y({
         geometry: i.geometry,
         symbol: {
           type: "simple-marker",
@@ -808,7 +813,7 @@ class F {
           }
         }
       });
-      this.flashGraphic(o);
+      this.flashGraphic(r);
     }
     return await this.view.goTo(i.geometry, { duration: 1e3 }), { status: 0, message: "ok" };
   }
@@ -818,41 +823,41 @@ class F {
    * @returns
    */
   async findLane(e) {
-    let { roadsectId: t, segmentId: i, laneId: o } = e;
+    let { roadsectId: t, segmentId: i, laneId: r } = e;
     t.startsWith("-") && (t = t.slice(1));
     let s = this.allLaneGraphics.filter(
-      (l) => l.attributes.roadId === t
+      (a) => a.attributes.roadId === t
     );
     if (s.length === 0)
       return { status: -1, message: "未找到。请检查路段编号" };
     if (i !== void 0) {
-      const l = [];
-      if (s.forEach((r) => {
-        const n = Number(r.attributes.sectionId);
-        l.indexOf(n) === -1 && l.push(n);
-      }), l.sort((r, n) => r - n), i > l.length - 1)
+      const a = [];
+      if (s.forEach((o) => {
+        const l = Number(o.attributes.sectionId);
+        a.indexOf(l) === -1 && a.push(l);
+      }), a.sort((o, l) => o - l), i > a.length - 1)
         return { status: -1, message: "未找到。请检查基本段编号" };
-      i = l[i], s = s.filter(
-        (r) => Number(r.attributes.sectionId) === i
+      i = a[i], s = s.filter(
+        (o) => Number(o.attributes.sectionId) === i
       );
     }
-    if (o !== void 0) {
-      const l = [];
-      if (s.forEach((r) => {
-        const n = Number(r.attributes.laneId);
-        l.indexOf(n) === -1 && l.push(n);
-      }), l.sort((r, n) => r - n), o > l.length - 1)
+    if (r !== void 0) {
+      const a = [];
+      if (s.forEach((o) => {
+        const l = Number(o.attributes.laneId);
+        a.indexOf(l) === -1 && a.push(l);
+      }), a.sort((o, l) => o - l), r > a.length - 1)
         return { status: -1, message: "未找到。请检查车道编号" };
-      o = l[o], s = s.filter(
-        (r) => Number(r.attributes.laneId) === o
+      r = a[r], s = s.filter(
+        (o) => Number(o.attributes.laneId) === r
       );
     }
     const c = s.map(
-      (l) => l.geometry
-    ), a = L.union(c);
+      (a) => a.geometry
+    ), n = L.union(c);
     if (e.flash) {
-      const l = new y({
-        geometry: a,
+      const a = new y({
+        geometry: n,
         symbol: {
           type: "simple-fill",
           color: [255, 0, 0, 0.5],
@@ -863,9 +868,9 @@ class F {
           }
         }
       });
-      this.flashGraphic(l);
+      this.flashGraphic(a);
     }
-    return await this.view.goTo(a, { duration: 1e3 }), { status: 0, message: "ok" };
+    return await this.view.goTo(n, { duration: 1e3 }), { status: 0, message: "ok" };
   }
   /**
    * graphic渐隐渐显闪烁
@@ -874,8 +879,8 @@ class F {
   flashGraphic(e) {
     this.flashLayer.removeAll(), this.flashLayer.add(e);
     let t = 0, i = !0;
-    const o = setInterval(() => {
-      i ? (this.flashLayer.opacity -= 0.02, this.flashLayer.opacity <= 0.1 && (i = !1, t++)) : (this.flashLayer.opacity += 0.02, this.flashLayer.opacity >= 1 && (i = !0)), t >= 5 && (this.flashLayer.removeAll(), this.flashLayer.opacity = 1, clearInterval(o));
+    const r = setInterval(() => {
+      i ? (this.flashLayer.opacity -= 0.02, this.flashLayer.opacity <= 0.1 && (i = !1, t++)) : (this.flashLayer.opacity += 0.02, this.flashLayer.opacity >= 1 && (i = !0)), t >= 5 && (this.flashLayer.removeAll(), this.flashLayer.opacity = 1, clearInterval(r));
     }, 10);
   }
   /**
@@ -890,15 +895,15 @@ class F {
         const i = t.getAttribute("crossId");
         t.symbol.url = i ? "/GisViewerAssets/Images/point_green.png" : "/GisViewerAssets/Images/point_yellow.png", this.decreasePictureMarkerSize(t, 30);
       }
-    }), !e || e.type === "edge")
-      if (!e || !e.id || e.id === "")
-        this.sectionLayer.removeAll();
-      else {
-        const t = this.sectionLayer.graphics.find(
-          (i) => i.getAttribute("edgeId") === e.id
+    }), !e || e.type === "edge") {
+      let t;
+      !e || !e.id || e.id === "" ? t = this.sectionLayer.graphics.toArray() : t = this.sectionLayer.graphics.filter((i) => i.getAttribute("edgeId") === e.id).toArray(), t.length > 0 && (t.forEach((i) => {
+        const r = i.getAttribute("id");
+        this.selectedSectionIds = this.selectedSectionIds.filter(
+          (s) => s !== r
         );
-        t && this.sectionLayer.remove(t);
-      }
+      }), this.sectionLayer.removeMany(t));
+    }
     return { status: 0, message: "ok" };
   }
   /**
@@ -917,34 +922,41 @@ class F {
         const t = e.id.split("#");
         let i = String(t[0]);
         i.startsWith("-") && (i = i.slice(1));
-        let o = "0";
-        t.length === 2 && (o = String(t[1]));
+        let r = 0;
+        t.length === 2 && (r = Number(t[1]));
         let s = [];
         if (t.length === 1 ? s = this.allLaneGraphics.filter(
           (c) => c.getAttribute("roadId") === i
         ) : t.length === 2 && (s = this.allLaneGraphics.filter(
-          (c) => c.getAttribute("roadId") === i && c.getAttribute("sectionId") === o
+          (c) => c.getAttribute("roadId") === i && c.getAttribute("sectionIndex") === r
         )), s.length > 0) {
-          const c = L.union(
-            s.map((l) => l.geometry)
-          ), a = new y({
-            geometry: c,
-            symbol: {
-              type: "simple-fill",
-              color: [0, 255, 255, 0.5],
-              style: "solid",
-              outline: {
-                color: [0, 255, 255],
-                width: 1
+          const c = /* @__PURE__ */ new Map();
+          return s.forEach((n) => {
+            const a = n.getAttribute("roadId") + "+" + n.getAttribute("sectionId");
+            this.selectedSectionIds.includes(a) || this.selectedSectionIds.push(a);
+            let o = c.get(a);
+            o ? o.push(n.geometry) : (o = [n.geometry], c.set(a, o));
+          }), c.forEach((n, a) => {
+            const o = L.union(n), l = new y({
+              geometry: o,
+              symbol: {
+                type: "simple-fill",
+                color: [0, 255, 255, 0.5],
+                style: "solid",
+                outline: {
+                  color: [0, 255, 255],
+                  width: 1
+                }
+              },
+              attributes: {
+                type: "OpenDriveSection",
+                id: a,
+                edgeId: e.id,
+                selected: !0
               }
-            },
-            attributes: {
-              type: "OpenDriveSection",
-              edgeId: e.id,
-              selected: !0
-            }
-          });
-          return this.sectionLayer.add(a), { status: 0, message: "ok" };
+            });
+            this.sectionLayer.add(l);
+          }), { status: 0, message: "ok" };
         } else
           return { status: -1, message: "未找到路段" };
       }
@@ -953,51 +965,51 @@ class F {
     }
   }
   async geometrySearch(e) {
-    const t = new S({
+    const t = new N({
       rings: [e]
     }), i = await this.laneLayer.queryFeatures({
       geometry: t,
       outFields: ["*"]
-    }), o = [], s = [];
-    for (const l of i.features) {
-      const r = l.getAttribute("roadId"), n = l.getAttribute("sectionId"), h = `${r}#${n}`;
-      if (o.indexOf(h) === -1) {
-        o.push(h), this.selectSumo({
+    }), r = [], s = [];
+    for (const a of i.features) {
+      const o = a.getAttribute("roadId"), l = a.getAttribute("sectionIndex"), d = `${o}#${l}`;
+      if (r.indexOf(d) === -1) {
+        r.push(d), this.selectSumo({
           type: "edge",
-          id: h
+          id: d
         });
-        const d = `http://${this.openDriveServer}/api/sumo/getSumoEdge`, g = await b.get(d, {
+        const h = `http://${this.openDriveServer}/api/sumo/getSumoEdge`, g = await b.get(h, {
           params: {
-            id: `${r}+${n}`,
+            id: `${o}+${a.getAttribute("sectionId")}`,
             projectName: this.projectName
           }
         });
         g.status === 200 && g.data.status === 0 && s.push(g.data.result);
       }
     }
-    const c = this.junctionLayer.graphics.filter((l) => {
-      const r = l.geometry;
-      return L.contains(t, r);
-    }), a = [];
-    for (const l of c) {
-      const r = l.getAttribute("id");
+    const c = this.junctionLayer.graphics.filter((a) => {
+      const o = a.geometry;
+      return L.contains(t, o);
+    }), n = [];
+    for (const a of c) {
+      const o = a.getAttribute("id");
       this.selectSumo({
         type: "junction",
-        id: r
+        id: o
       });
-      const n = `http://${this.openDriveServer}/api/sumo/getSumoJunction`, h = await b.get(n, {
+      const l = `http://${this.openDriveServer}/api/sumo/getSumoJunction`, d = await b.get(l, {
         params: {
-          id: r,
+          id: o,
           projectName: this.projectName
         }
       });
-      h.status === 200 && h.data.status === 0 && a.push(h.data.result);
+      d.status === 200 && d.data.status === 0 && n.push(d.data.result);
     }
     return {
       status: 0,
       message: "ok",
       result: {
-        junctions: a,
+        junctions: n,
         edges: s
       }
     };
@@ -1006,43 +1018,43 @@ class F {
     const i = e.id.split("_");
     if (i.length !== 2)
       return { status: -1, message: "车道编号格式错误" };
-    const o = Number(i[1]), s = i[0].split("#"), c = s.length === 2 ? Number(s[1]) : 0;
-    let a = s[0];
-    a.startsWith("-") && (a = a.slice(1));
-    const l = this.allLaneGraphics.filter((v) => v.getAttribute("roadId") === a && v.getAttribute("sectionIndex") === c);
-    if (l.length === 0)
+    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);
+    if (a.length === 0)
       return { status: -1, message: "未找到路段" };
-    const r = l.length - o, n = l.find(
-      (v) => Math.abs(v.getAttribute("laneId")) === r
+    const o = a.length - r, l = a.find(
+      (I) => Math.abs(I.getAttribute("laneId")) === o
     );
-    if (!n)
+    if (!l)
       return { status: -1, message: "未找到车道" };
-    const h = e.start || 0, d = e.end || 100, g = G.lineString(n.getAttribute("leftLine")), p = C(g, h, d, {
+    const d = e.start || 0, h = e.end || 100, g = G.lineString(l.getAttribute("leftLine")), p = C(g, d, h, {
       units: "meters"
-    }), m = G.lineString(n.getAttribute("rightLine")), u = C(m, h, d, {
+    }), m = G.lineString(l.getAttribute("rightLine")), f = C(m, d, h, {
       units: "meters"
-    }), f = p.geometry.coordinates.concat(
-      u.geometry.coordinates.reverse()
+    }), u = p.geometry.coordinates.concat(
+      f.geometry.coordinates.reverse()
     );
-    f.push(f[f.length - 1]);
+    u.push(u[u.length - 1]);
     const w = new y({
-      geometry: new S({
-        rings: [f]
+      geometry: new N({
+        rings: [u]
       }),
       attributes: {
-        ObjectID: n.getAttribute("ObjectID"),
-        id: n.getAttribute("id"),
-        fromNode: n.getAttribute("fromNode"),
-        toNode: n.getAttribute("toNode"),
-        roadId: n.getAttribute("roadId"),
-        roadName: n.getAttribute("roadName"),
-        sectionId: n.getAttribute("sectionId"),
-        sectionIndex: n.getAttribute("sectionIndex"),
-        laneId: n.getAttribute("laneId"),
-        type: n.getAttribute("type"),
-        sumoId: n.getAttribute("sumoId"),
+        ObjectID: l.getAttribute("ObjectID"),
+        id: l.getAttribute("id"),
+        fromNode: l.getAttribute("fromNode"),
+        toNode: l.getAttribute("toNode"),
+        roadId: l.getAttribute("roadId"),
+        roadName: l.getAttribute("roadName"),
+        sectionId: l.getAttribute("sectionId"),
+        sectionIndex: l.getAttribute("sectionIndex"),
+        laneId: l.getAttribute("laneId"),
+        type: l.getAttribute("type"),
+        sumoId: l.getAttribute("sumoId"),
         leftLine: p.geometry.coordinates,
-        rightLine: u.geometry.coordinates
+        rightLine: f.geometry.coordinates
       },
       symbol: {
         type: "simple-fill",