gisviewer-vue3-arcgis 1.0.85

package/es/src/gis-map/utils/road-config-tool/index.mjs

@@ -0,0 +1,112 @@
+import l from "@arcgis/core/Graphic";
+import { Point as w } from "@arcgis/core/geometry";
+import h from "@arcgis/core/layers/GraphicsLayer";
+import { TextSymbol as y, SimpleMarkerSymbol as f } from "@arcgis/core/symbols";
+import p from "../common-utils.mjs";
+import L from "./cross.mjs";
+import A from "./search-nearby-lanes.mjs";
+import N from "./indicator-area.mjs";
+class k {
+  /**
+   * 道路配置工具相关功能
+   * @param map map实例
+   * @param mapConfig 地图配置
+   */
+  constructor(e) {
+    this.view = e, this.laneNumberLayer = new h({
+      minScale: 2257
+    }), this.view.map.add(this.laneNumberLayer), this.crossIndicatorAreaLayer = new h(), this.view.map.add(this.crossIndicatorAreaLayer);
+  }
+  /**
+   * 在进口道的顶端显示车道序号
+   * @param params
+   * @returns
+   */
+  showLaneNumber(e) {
+    const { lanes: i } = e, s = [], o = [];
+    for (const m of i) {
+      const { crossId: n, laneNumber: a, stopLineCenter: r, laneDirection: c } = m;
+      if (!r[0] || !r[1])
+        continue;
+      let t = new w({
+        longitude: r[0],
+        latitude: r[1]
+      });
+      c && (t = p.destinationWithPoint(
+        t,
+        c,
+        -3
+      ));
+      const d = {
+        type: "laneNumber",
+        id: `${n}_${a}`,
+        crossId: n,
+        laneNumber: a
+      }, u = new l({
+        geometry: t,
+        symbol: new y({
+          text: a,
+          color: "red",
+          verticalAlignment: "middle",
+          font: {
+            size: 10
+          }
+        })
+      });
+      o.push(u);
+      const b = new l({
+        geometry: t,
+        // 半透明白色圆点
+        symbol: new f({
+          style: "circle",
+          color: [255, 255, 255, 0.8],
+          size: 14,
+          outline: {
+            color: "white",
+            width: 1
+          }
+        }),
+        attributes: d
+      });
+      s.push(b);
+    }
+    return this.laneNumberLayer.addMany(s), this.laneNumberLayer.addMany(o), { status: 0, message: "车道序号显示成功" };
+  }
+  /** 清除车道序号 */
+  clearLaneNumber() {
+    this.laneNumberLayer.removeAll();
+  }
+  /**
+   * 初始化算法区域生成工具
+   * @param params
+   * @returns Promise<IResult>
+   */
+  async initializeSearch(e) {
+    var i;
+    return this.searchLaneTool || (this.searchLaneTool = new A(this.view)), this.cross = new L({ id: e.crossId, center: e.crossCenter }), (i = this.indicatorAreaTool) == null || i.clearIndicatorArea(), this.searchLaneTool.initializeSearch(e);
+  }
+  /**
+   * 生成路口指标计算区
+   */
+  async calCrossIndicatorArea() {
+    this.cross.initialized || await this.initializeCross(), this.indicatorAreaTool || (this.indicatorAreaTool = new N(this.view)), await this.indicatorAreaTool.showCrossIndicatorArea(this.cross);
+  }
+  /**
+   * 路口初始化，计算周边进口道与车道
+   * @returns
+   */
+  async initializeCross() {
+    if (!this.searchLaneTool)
+      return {
+        status: -1,
+        message: "算法区域生成工具未初始化, 请先执行initializeSearch"
+      };
+    const e = await this.searchLaneTool.getCurrentSearchResult();
+    this.searchLaneTool.clearResult(), await this.cross.initialize(e);
+    const i = this.cross.getLaneNumberInfo();
+    this.showLaneNumber({ lanes: i });
+  }
+}
+export {
+  k as default
+};

package/es/src/gis-map/utils/road-config-tool/indicator-area.d.ts

@@ -0,0 +1,22 @@
+import MapView from '@arcgis/core/views/MapView';
+import SceneView from '@arcgis/core/views/SceneView';
+import Cross from './cross';
+export default class IndicatorArea {
+    private view;
+    /** 路口指标计算区图层 */
+    private indicatorAreaLayer;
+    /** 路口指标计算区Graphic */
+    private crossIndicatorAreaGraphic?;
+    /** 移动graphic的工具类 */
+    private sketchViewModel;
+    constructor(view: MapView | SceneView);
+    /**
+     * 显示路口指标计算区
+     * @param cross
+     */
+    showCrossIndicatorArea(cross: Cross): Promise<void>;
+    /**
+     * 清除所有指标计算区
+     */
+    clearIndicatorArea(): void;
+}

package/es/src/gis-map/utils/road-config-tool/indicator-area.mjs

@@ -0,0 +1,44 @@
+import a from "@arcgis/core/layers/GraphicsLayer";
+import i from "@arcgis/core/Graphic";
+import { SimpleFillSymbol as o } from "@arcgis/core/symbols";
+import t from "@arcgis/core/widgets/Sketch/SketchViewModel";
+class h {
+  constructor(r) {
+    this.view = r, this.indicatorAreaLayer = new a(), this.view.map.add(this.indicatorAreaLayer), this.sketchViewModel = new t({
+      view: this.view,
+      layer: this.indicatorAreaLayer,
+      defaultUpdateOptions: {
+        tool: "reshape"
+      },
+      snappingOptions: {
+        enabled: !0
+      }
+    });
+  }
+  /**
+   * 显示路口指标计算区
+   * @param cross
+   */
+  async showCrossIndicatorArea(r) {
+    this.indicatorAreaLayer.removeAll();
+    const e = await r.calCrossIndicatorArea();
+    e ? (this.crossIndicatorAreaGraphic = new i({
+      geometry: e,
+      symbol: new o({
+        color: [255, 0, 0, 0.5],
+        outline: {
+          color: [255, 0, 0]
+        }
+      })
+    }), this.indicatorAreaLayer.add(this.crossIndicatorAreaGraphic)) : this.sketchViewModel.create("polygon");
+  }
+  /**
+   * 清除所有指标计算区
+   */
+  clearIndicatorArea() {
+    this.indicatorAreaLayer.removeAll();
+  }
+}
+export {
+  h as default
+};

package/es/src/gis-map/utils/road-config-tool/lane.d.ts

@@ -0,0 +1,21 @@
+import { Point, Polygon, Polyline } from '@arcgis/core/geometry';
+export default class Lane {
+    /** 停止线 */
+    private _stopLine;
+    /** 停止线中点 */
+    stopLineCenter: Point;
+    set stopLine(line: Polyline);
+    get stopLine(): Polyline;
+    private _extendedStopLine;
+    /** 停止线延长线，用于计算和其他进口道停止线的交点 */
+    get extendedStopLine(): __esri.Polyline;
+    /** 行车方向 */
+    laneDirection: number;
+    /** 车道轮廓 */
+    lanePolygon: Polygon;
+    /** 车道id（路口号_进口道号_车道序号(>0为进口道, <0为出口道)） */
+    code: string;
+    /** 是否为进口道 */
+    isEntry: boolean;
+    getLaneDirection(): Promise<void>;
+}

package/es/src/gis-map/utils/road-config-tool/lane.mjs

@@ -0,0 +1,35 @@
+import L from "@turf/bearing";
+import n from "../common-utils.mjs";
+class a {
+  set stopLine(t) {
+    this._stopLine = t, this.stopLineCenter = t.extent.center;
+  }
+  get stopLine() {
+    return this._stopLine;
+  }
+  /** 停止线延长线，用于计算和其他进口道停止线的交点 */
+  get extendedStopLine() {
+    return this._extendedStopLine || (this._extendedStopLine = n.extendLineInTowDir(
+      this._stopLine,
+      100
+    )), this._extendedStopLine;
+  }
+  async getLaneDirection() {
+    const t = n.extendLineInTowDir(this._stopLine, 10), i = this._stopLine.paths[0];
+    let e = await n.getIntersectPointOfLineAndPolygon(
+      t,
+      this.lanePolygon,
+      5
+    );
+    e.length === 0 && (e = await n.getIntersectPointOfLineAndPolygon(
+      t,
+      this.lanePolygon,
+      -5
+    )), (!i.length || !e.length) && console.log("计算方位角失败", i, e);
+    const s = e[0], r = i[0], o = L(r, s);
+    this.laneDirection = o < 0 ? o + 360 : o;
+  }
+}
+export {
+  a as default
+};

package/es/src/gis-map/utils/road-config-tool/search-nearby-lanes.d.ts

@@ -0,0 +1,62 @@
+import Graphic from '@arcgis/core/Graphic';
+import MapView from '@arcgis/core/views/MapView';
+import SceneView from '@arcgis/core/views/SceneView';
+import { IResult, IStartCrossBufferParam } from '../../../types';
+export default class SearchNearbyLanes {
+    private view;
+    /** 显示圆心和边缘点的图层，可响应拖拽事件 */
+    private pointLayer;
+    /** 显示缓冲结果的图层 */
+    private bufferAreaLayer;
+    /** 车道图层 */
+    private laneLayer;
+    /** 停止线图层 */
+    private stopLineLayer;
+    /** 移动graphic的工具类 */
+    private sketchViewModel;
+    /** 显示圆心点的graphic */
+    private centerGraphic;
+    /** 显示边缘点的graphic */
+    private edgeGraphic;
+    /** 显示缓冲圆形的graphic */
+    private bufferGraphic;
+    /** 显示圆心与边缘点连线的graphic */
+    private radiusLineGraphic;
+    /** 鼠标开始拖动边缘点时，圆心点的位置 */
+    private centerGeometryAtStart;
+    /** 地理计算单位，统一为米 */
+    private readonly geometryUnit;
+    constructor(view: MapView | SceneView);
+    /**
+     * 搜索路口中心点周边车道
+     * @param params
+     * @returns Promise<IResult>
+     */
+    initializeSearch(params: IStartCrossBufferParam): Promise<IResult>;
+    /**
+     * 获取当前缓冲区的搜索结果
+     */
+    getCurrentSearchResult(): Promise<{
+        lanes: Graphic[];
+        stopLines: Graphic[];
+    }>;
+    /**
+     * 清除地图上显示的搜索结果
+     */
+    clearResult(): void;
+    /**
+     * 计算缓冲区
+     * 移动边缘点或圆心点后调用
+     * @param vertices 圆心点与边缘点的坐标
+     */
+    private calculateBuffer;
+    /**
+     * 载入车道和停止线图层
+     */
+    private loadLaneAndStopLineLayer;
+    /**
+     * 更新车道与停止线图层的filter，高亮缓冲区内部的要素
+     * @param buffer
+     */
+    private updateLayerFilter;
+}

package/es/src/gis-map/utils/road-config-tool/search-nearby-lanes.mjs

@@ -0,0 +1,265 @@
+import l from "@arcgis/core/Graphic";
+import * as f from "@arcgis/core/core/promiseUtils";
+import { Point as b, Polyline as p } from "@arcgis/core/geometry";
+import S from "@arcgis/core/geometry/SpatialReference";
+import * as h from "@arcgis/core/geometry/geometryEngineAsync";
+import m from "@arcgis/core/layers/FeatureLayer";
+import u from "@arcgis/core/layers/GraphicsLayer";
+import G from "@arcgis/core/layers/support/FeatureEffect";
+import R from "@arcgis/core/layers/support/FeatureFilter";
+import d from "@arcgis/core/renderers/SimpleRenderer";
+import v from "@arcgis/core/rest/support/Query";
+import { SimpleMarkerSymbol as g, SimpleLineSymbol as L, SimpleFillSymbol as w } from "@arcgis/core/symbols";
+import F from "@arcgis/core/widgets/Sketch/SketchViewModel";
+import A from "../../stores/index.mjs";
+import I from "../common-utils.mjs";
+class V {
+  constructor(e) {
+    this.geometryUnit = "meters", this.view = e, this.pointLayer = new u(), this.bufferAreaLayer = new u({
+      blendMode: "color-burn"
+    }), this.view.map.layers.addMany([this.bufferAreaLayer, this.pointLayer]);
+    const i = f.debounce(
+      async (t) => {
+        const r = await this.calculateBuffer(t);
+        this.updateLayerFilter(r);
+      }
+    );
+    this.sketchViewModel = new F({
+      view: e,
+      layer: this.pointLayer
+    }), this.sketchViewModel.on("update", (t) => {
+      var c, s;
+      ((s = (c = t.toolEventInfo) == null ? void 0 : c.mover) == null ? void 0 : s.attributes.type) === "edge" && (t.toolEventInfo.type === "move-start" ? this.centerGeometryAtStart = this.centerGraphic.geometry : this.centerGraphic.geometry = this.centerGeometryAtStart);
+      const r = this.centerGraphic.geometry, o = this.edgeGraphic.geometry, n = [
+        [r.x, r.y],
+        [o.x, o.y]
+      ];
+      i(n).catch((y) => {
+        if (!f.isAbortError(y))
+          throw y;
+      });
+    });
+  }
+  /**
+   * 搜索路口中心点周边车道
+   * @param params
+   * @returns Promise<IResult>
+   */
+  async initializeSearch(e) {
+    if (this.laneLayer)
+      this.laneLayer.visible = !0, this.stopLineLayer.visible = !0;
+    else {
+      const s = await this.loadLaneAndStopLineLayer();
+      if (s.status !== 0)
+        return s;
+    }
+    const { crossId: i, crossCenter: t } = e, r = new b({
+      longitude: t[0],
+      latitude: t[1]
+    });
+    this.view.goTo(
+      {
+        target: r,
+        zoom: 18
+      },
+      { duration: 2e3 }
+    ), this.centerGraphic = new l({
+      geometry: r,
+      symbol: new g({
+        style: "circle",
+        color: [0, 255, 255, 0.5],
+        size: 10
+      }),
+      attributes: {
+        crossId: i,
+        type: "center"
+      }
+    });
+    const o = I.destinationWithPoint(
+      r,
+      90,
+      e.bufferRadius || 70
+    );
+    this.edgeGraphic = new l({
+      geometry: o,
+      symbol: new g({
+        style: "circle",
+        color: [0, 255, 255, 0.5],
+        size: 10
+      }),
+      attributes: {
+        crossId: i,
+        type: "edge"
+      }
+    });
+    const n = new p({
+      paths: [
+        [
+          [r.x, r.y],
+          [o.x, o.y]
+        ]
+      ]
+    });
+    this.radiusLineGraphic = new l({
+      geometry: n,
+      symbol: new L({
+        color: [0, 255, 255],
+        width: 2
+      })
+    }), this.pointLayer.addMany([
+      this.centerGraphic,
+      this.edgeGraphic,
+      this.radiusLineGraphic
+    ]);
+    const c = await h.geodesicBuffer(
+      r,
+      e.bufferRadius || 70,
+      this.geometryUnit
+    );
+    return this.bufferGraphic = new l({
+      geometry: c,
+      symbol: new w({
+        color: [150, 150, 150],
+        outline: {
+          color: "#FFEB00",
+          width: "3px"
+        }
+      })
+    }), this.bufferAreaLayer.add(this.bufferGraphic), this.sketchViewModel.update([this.edgeGraphic, this.centerGraphic], {
+      tool: "move"
+    }), { status: 0, message: "初始化成功" };
+  }
+  /**
+   * 获取当前缓冲区的搜索结果
+   */
+  async getCurrentSearchResult() {
+    const e = new v();
+    e.relationParameter = "intersects", e.geometry = this.bufferGraphic.geometry, e.returnGeometry = !0, e.outSpatialReference = new S({ wkid: 4326 }), e.outFields = ["*"];
+    const i = (await this.laneLayer.queryFeatures(e)).features, t = (await this.stopLineLayer.queryFeatures(e)).features;
+    return {
+      lanes: i,
+      stopLines: t
+    };
+  }
+  /**
+   * 清除地图上显示的搜索结果
+   */
+  clearResult() {
+    this.sketchViewModel.complete(), this.pointLayer.removeAll(), this.bufferAreaLayer.removeAll(), this.laneLayer.visible = !1, this.stopLineLayer.visible = !1;
+  }
+  /**
+   * 计算缓冲区
+   * 移动边缘点或圆心点后调用
+   * @param vertices 圆心点与边缘点的坐标
+   */
+  async calculateBuffer(e) {
+    this.radiusLineGraphic.geometry = new p({
+      paths: [e],
+      spatialReference: this.view.spatialReference
+    });
+    const i = await h.geodesicLength(
+      this.radiusLineGraphic.geometry,
+      this.geometryUnit
+    ), t = await h.geodesicBuffer(
+      this.centerGraphic.geometry,
+      i,
+      this.geometryUnit
+    );
+    return this.bufferGraphic.geometry = t, t;
+  }
+  /**
+   * 载入车道和停止线图层
+   */
+  async loadLaneAndStopLineLayer() {
+    var s, y;
+    const e = A.useAppDataStore, i = JSON.parse(JSON.stringify(e.mapConfig));
+    if (!((s = i.roadConfigTool) != null && s.initLanePolygonLayer))
+      return {
+        status: -1,
+        message: "roadConfigTool.initLanePolygonLayer未配置"
+      };
+    if (!((y = i.roadConfigTool) != null && y.initStopLineLayer))
+      return {
+        status: -1,
+        message: "roadConfigTool.initStopLineLayer"
+      };
+    const t = `${i.assetsRoot}${i.roadConfigTool.initLanePolygonLayer}`;
+    let r;
+    try {
+      r = await (await fetch(t)).json();
+    } catch (a) {
+      return { status: -2, message: `${t}读取失败`, result: a.message };
+    }
+    const o = r.features.filter((a) => a.attributes.RoadSecID !== "").map((a) => l.fromJSON(a));
+    this.laneLayer = new m({
+      objectIdField: "FID",
+      spatialReference: r.spatialReference,
+      geometryType: "polygon",
+      source: o,
+      fields: [
+        {
+          name: "RoadSecID",
+          alias: "RoadSecID",
+          type: "string"
+        }
+      ],
+      renderer: new d({
+        symbol: new w({
+          color: [255, 0, 0, 0.3],
+          outline: {
+            color: "white"
+          }
+        })
+      })
+    }), this.view.map.layers.add(this.laneLayer);
+    const n = `${i.assetsRoot}${i.roadConfigTool.initStopLineLayer}`;
+    try {
+      r = await (await fetch(n)).json();
+    } catch (a) {
+      return {
+        status: -2,
+        message: `${n}读取失败`,
+        result: a.message
+      };
+    }
+    const c = r.features.filter((a) => a.attributes.RoadSecID !== "").map((a) => l.fromJSON(a));
+    return this.stopLineLayer = new m({
+      objectIdField: "FID",
+      spatialReference: r.spatialReference,
+      geometryType: "polyline",
+      source: c,
+      fields: [
+        {
+          name: "RoadSecID",
+          alias: "RoadSecID",
+          type: "string"
+        }
+      ],
+      renderer: new d({
+        symbol: new L({
+          color: "red",
+          width: 4,
+          cap: "butt",
+          join: "miter"
+        })
+      })
+    }), this.view.map.layers.add(this.stopLineLayer), { status: 0, message: "ok" };
+  }
+  /**
+   * 更新车道与停止线图层的filter，高亮缓冲区内部的要素
+   * @param buffer
+   */
+  updateLayerFilter(e) {
+    const i = new R({
+      geometry: e,
+      spatialRelationship: "intersects"
+    }), t = new G({
+      filter: i,
+      excludedEffect: "opacity(0%)"
+    });
+    this.laneLayer.featureEffect = t, this.stopLineLayer.featureEffect = t;
+  }
+}
+export {
+  V as default
+};