gisviewer-vue3-arcgis 1.0.142 → 1.0.144

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

@@ -1,15 +1,16 @@
-import d from "@arcgis/core/layers/GraphicsLayer";
-import L from "@arcgis/core/widgets/Sketch/SketchViewModel";
-import b from "@arcgis/core/widgets/Sketch";
-import * as y from "@arcgis/core/geometry/support/webMercatorUtils.js";
-import * as G from "@arcgis/core/geometry/geometryEngine.js";
+import * as L from "@arcgis/core/geometry/geometryEngine.js";
+import * as g from "@arcgis/core/geometry/support/webMercatorUtils.js";
 import l from "@arcgis/core/Graphic";
-import { v4 as P } from "uuid";
-import k from "@arcgis/core/geometry/Polygon.js";
-import x from "@arcgis/core/geometry/Polyline.js";
-import A from "@turf/intersect";
-import * as m from "@turf/helpers";
-function w(c, e = []) {
+import f from "@arcgis/core/layers/GraphicsLayer";
+import G from "@arcgis/core/widgets/Sketch";
+import P from "@arcgis/core/widgets/Sketch/SketchViewModel";
+import S from "@arcgis/core/geometry/Polygon.js";
+import b from "@arcgis/core/geometry/Polyline.js";
+import * as d from "@turf/helpers";
+import k from "@turf/intersect";
+import { v4 as A } from "uuid";
+import M from "../stores/index.mjs";
+function u(c, t = []) {
   if (c === null || typeof c != "object")
     return c;
   if (Object.prototype.toString.call(c) === "[object Date]")
@@ -18,29 +19,29 @@ function w(c, e = []) {
     return new RegExp(c);
   if (Object.prototype.toString.call(c) === "[object Error]")
     return new Error(c);
-  const t = e.filter((s) => s.original === c)[0];
-  if (t)
-    return t.copy;
+  const e = t.filter((s) => s.original === c)[0];
+  if (e)
+    return e.copy;
   const i = Array.isArray(c) ? [] : {};
-  return e.push({
+  return t.push({
     original: c,
     copy: i
   }), Object.keys(c).forEach((s) => {
-    i[s] = w(c[s], e);
+    i[s] = u(c[s], t);
   }), i;
 }
-const S = {
+const x = {
   maxAllowedGraphics: 0,
   GraphicsLayer: {},
-  sketchvisibleElements: {},
-  sketchPosition: "top-left",
-  defaultsketchVisible: !0,
+  sketchVisibleElements: {},
+  sketchPosition: "top-right",
+  defaultSketchVisible: !0,
   sketchViewModelItemSymbol: {}
-}, u = {
+}, m = {
   type: "simple-line",
   color: "#556DEA",
   width: 2
-}, f = {
+}, y = {
   type: "simple-fill",
   // autocasts as new SimpleFillSymbol()
   color: [227, 139, 79, 0.4],
@@ -50,38 +51,42 @@ const S = {
     width: 1
   }
 };
-class C {
-  constructor(e, t) {
-    this.viewer = e, this.options = {
-      ...S,
-      ...t
-    }, this.graphicsLayer = new d({ ...this.options.GraphicsLayer }), this.TextgraphicsLayer = new d(), this.viewer.map.layers.add(this.graphicsLayer), this.viewer.map.layers.add(this.TextgraphicsLayer), this.init();
+class B {
+  constructor(t, e) {
+    this.viewer = t, this.options = {
+      ...x,
+      ...e
+    }, this.graphicsLayer = new f({ ...this.options.GraphicsLayer }), this.TextGraphicsLayer = new f(), this.viewer.map.layers.add(this.graphicsLayer), this.viewer.map.layers.add(this.TextGraphicsLayer), this.init();
   }
   init() {
-    this.sketchViewModel = new L({
+    this.sketchViewModel = new P({
       layer: this.graphicsLayer,
       view: this.viewer,
       updateOnGraphicClick: !0,
-      polylineSymbol: u,
-      polygonSymbol: f,
+      polylineSymbol: m,
+      polygonSymbol: y,
       ...this.options.sketchViewModelItemSymbol
     });
-    const e = this.findLayerById("TrafficMarkings"), t = [];
-    e && t.push({ layer: e, enabled: !0 }), this.sketch = new b({
+    const t = this.findLayerById("TrafficMarkings"), e = [];
+    t && e.push({ layer: t, enabled: !0 }), this.sketch = new G({
       view: this.viewer,
       viewModel: this.sketchViewModel,
       layer: this.graphicsLayer,
-      visible: this.options.defaultsketchVisible,
+      visible: this.options.defaultSketchVisible,
       snappingOptions: {
         // autocasts to SnappingOptions()
         enabled: !0,
         // global snapping is turned on
         // assigns a collection of FeatureSnappingLayerSource() and enables feature snapping on this layer
-        featureSources: t
+        featureSources: e
       }
     }), this.sketch.visibleElements = {
-      ...this.options.sketchvisibleElements
+      ...this.options.sketchVisibleElements
     }, this.viewer.ui.add(this.sketch, this.options.sketchPosition);
+    const i = M.useAppDataStore;
+    this.sketch.on("create", (s) => {
+      s.state === "complete" ? i.isSketching = !1 : s.state === "start" && (i.isSketching = !0);
+    });
   }
   /**
    * 初始化绘图
@@ -92,16 +97,16 @@ class C {
    * @returns
    * @memberof SketchView
    */
-  initPoint(e, t = "all", i = !1) {
-    if (!e)
+  initPoint(t, e = "all", i = !1) {
+    if (!t)
       return;
-    const { crossArea: s, sectionArea: r } = e;
-    if (s && (t == "crossArea" || t == "all")) {
+    const { crossArea: s, sectionArea: r } = t;
+    if (s && (e == "crossArea" || e == "all")) {
       const o = this.initCrossArea(s);
       this.graphicsLayer.add(o);
     }
-    if (r && (t == "sectionArea" || t == "all")) {
-      const o = this.inintSectionArea(r, i);
+    if (r && (e == "sectionArea" || e == "all")) {
+      const o = this.initSectionArea(r, i);
       this.graphicsLayer.addMany(o);
     }
   }
@@ -111,15 +116,14 @@ class C {
    * @param {any[]} data
    * @memberof SketchView
    */
-  initEntranceFusionZone(e) {
-    const t = [], i = f;
-    e.map((s) => {
-      t.push(this.createPolygonGraphic(s, i, {}));
-    }), this.graphicsLayer.addMany(t);
+  initEntranceFusionZone(t) {
+    const e = [];
+    t.map((i) => {
+      e.push(this.createPolygonGraphic(i, y, {}));
+    }), this.graphicsLayer.addMany(e);
   }
-  initCrossArea(e) {
-    const t = f;
-    return this.createPolygonGraphic(e, t, {});
+  initCrossArea(t) {
+    return this.createPolygonGraphic(t, y, {});
   }
   /**
    * 初始进出口道计算区域
@@ -129,79 +133,83 @@ class C {
    * @returns
    * @memberof SketchView
    */
-  inintSectionArea(e, t = !1) {
-    const i = [], s = u, r = {
+  initSectionArea(t, e = !1) {
+    const i = [], s = {
       type: "simple-line",
       color: [0, 0, 255],
       width: 2
     };
-    return Object.keys(e).map((o) => {
-      const a = e[o][0], n = e[o][1];
-      t && (a.reverse(), n.reverse());
-      const h = P(), p = this.createPolylineGraphic(a, s, {
-        type: "draw",
-        id: h
-      }), g = this.createPolylineGraphic(n, r, {
+    return Object.keys(t).map((r) => {
+      const o = t[r][0], a = t[r][1];
+      e && (o.reverse(), a.reverse());
+      const n = A(), h = this.createPolylineGraphic(
+        o,
+        m,
+        {
+          type: "draw",
+          id: n
+        }
+      ), p = this.createPolylineGraphic(a, s, {
         type: "shiftLine",
-        id: h
+        id: n
       });
-      i.push(p, g);
+      i.push(h, p);
     }), i;
   }
-  createPolylineGraphic(e, t, i) {
-    const s = new x({
-      paths: e
-    }), r = y.geographicToWebMercator(s);
+  createPolylineGraphic(t, e, i) {
+    const s = new b({
+      paths: t
+    }), r = g.geographicToWebMercator(s);
     return new l({
       geometry: r,
       // Add the geometry created in step 3
-      symbol: t,
+      symbol: e,
       // Add the symbol created in step 4
       attributes: i
     });
   }
-  createPolygonGraphic(e, t, i) {
-    const s = new k({
-      rings: e
-    }), r = y.geographicToWebMercator(s);
+  createPolygonGraphic(t, e, i) {
+    const s = new S({
+      rings: t
+    }), r = g.geographicToWebMercator(s);
     return new l({
       geometry: r,
       // Add the geometry created in step 3
-      symbol: t,
+      symbol: e,
       // Add the symbol created in step 4
       attributes: i
     });
   }
-  on(e) {
-    const t = this;
+  on(t) {
+    const e = this;
     this.sketchViewModel.on("create", function(i) {
       var r, o, a;
-      const s = t.graphicsLayer.graphics;
-      if ((r = t.options) != null && r.maxAllowedGraphics && s.length > ((o = t.options) == null ? void 0 : o.maxAllowedGraphics)) {
-        t.graphicsLayer.remove(i.graphic), console.log("已达到最大图形数量，无法继续绘制！");
+      const s = e.graphicsLayer.graphics;
+      if ((r = e.options) != null && r.maxAllowedGraphics && s.length > ((o = e.options) == null ? void 0 : o.maxAllowedGraphics)) {
+        e.graphicsLayer.remove(i.graphic), console.log("已达到最大图形数量，无法继续绘制！");
         return;
       }
       if (i.state === "complete" && ((a = i.graphic) != null && a.geometry)) {
         console.log(i.graphic);
         const n = i.graphic.geometry;
         i.graphic.setAttribute("type", "draw"), i.graphic.setAttribute("id", new Date().getTime());
-        const h = t.getGraphicPoint(n);
-        e && e("create", h, i);
+        const h = e.getGraphicPoint(n);
+        t && t("create", h, i);
       }
     }), this.sketchViewModel.on("update", function(i) {
       if (console.log("update", i), i.aborted) {
         const s = i.graphics[0];
-        t.graphicsLayer.remove(s);
+        e.graphicsLayer.remove(s);
         return;
       }
       if (i.state === "complete" && i.graphics.length > 0) {
-        const r = i.graphics[0].geometry, o = t.getGraphicPoint(r);
-        e && e("update", o, i);
+        const r = i.graphics[0].geometry, o = e.getGraphicPoint(r);
+        t && t("update", o, i);
       }
     }), this.sketchViewModel.on("delete", function(i) {
-      if (console.log("delete", i, t.graphicsLayer.graphics), i.graphics.length > 0) {
-        const r = i.graphics[0].geometry, o = t.getGraphicPoint(r);
-        e && e("delete", o, i);
+      if (console.log("delete", i, e.graphicsLayer.graphics), i.graphics.length > 0) {
+        const r = i.graphics[0].geometry, o = e.getGraphicPoint(r);
+        t && t("delete", o, i);
       }
     });
   }
@@ -210,16 +218,16 @@ class C {
    * @returns
    */
   graphicPoint() {
-    const e = [];
-    return this.graphicsLayer.graphics.map((t) => {
+    const t = [];
+    return this.graphicsLayer.graphics.map((e) => {
       var r;
-      const i = t.geometry, s = this.getGraphicPoint(i);
-      e.push({
+      const i = e.geometry, s = this.getGraphicPoint(i);
+      t.push({
         point: s,
-        type: (r = t.attributes) == null ? void 0 : r.type,
-        attributes: t.attributes
+        type: (r = e.attributes) == null ? void 0 : r.type,
+        attributes: e.attributes
       });
-    }), e;
+    }), t;
   }
   /**
    * 获取进口道区域
@@ -227,15 +235,15 @@ class C {
    * @memberof SketchView
    */
   getEntranceRoad() {
-    const e = {}, t = this.graphicPoint().filter(
+    const t = {}, e = this.graphicPoint().filter(
       (n) => n.point.type === "polyline"
     );
     if (console.log(
       "🚀 ~ file: sketchView.ts:378 ~ SketchView ~ getEntranceRoad ~ graphics:",
-      t
-    ), !t.length)
+      e
+    ), !e.length)
       return !1;
-    const i = t.filter((n) => n.type == "draw"), s = t.filter((n) => n.type == "shiftLine");
+    const i = e.filter((n) => n.type == "draw"), s = e.filter((n) => n.type == "shiftLine");
     if (s.length == 0)
       throw "未绘制平移！";
     if (i.length != s.length)
@@ -246,7 +254,7 @@ class C {
       ...r.slice(0, o).reverse()
     ].map((n, h) => {
       const p = s.find(
-        (g) => g.attributes.id == n.attributes.id
+        (w) => w.attributes.id == n.attributes.id
       );
       if (!p)
         throw "绘制的线和平移的线不匹配！";
@@ -254,14 +262,14 @@ class C {
         "🚀 ~ file: sketchView.ts:393 ~ SketchView ~ getEntranceRoad ~ m:",
         n,
         p
-      ), e[h + 1] = {
+      ), t[h + 1] = {
         0: [n.point.paths[0], n.point.paths[n.point.paths.length - 1]],
         1: [
           p.point.paths[0],
           p.point.paths[p.point.paths.length - 1]
         ]
       };
-    }), e;
+    }), t;
   }
   /**
    * 获进口道融合区
@@ -271,38 +279,38 @@ class C {
    * @returns
    * @memberof SketchView
    */
-  getEntranceFusionZone(e) {
-    const t = [], i = {};
+  getEntranceFusionZone(t) {
+    const e = [], i = {};
     this.graphicsLayer.graphics.map((r) => {
       var n;
       const o = r.geometry, a = this.getGraphicPoint(o, !1);
-      t.push({
+      e.push({
         point: a,
         type: (n = r.attributes) == null ? void 0 : n.type,
         attributes: r.attributes
       });
     });
-    const s = t;
-    return e.map((r, o) => {
-      i[r] = t[o];
-    }), { graphics: i, rawdata: s };
+    const s = e;
+    return t.map((r, o) => {
+      i[r] = e[o];
+    }), { graphics: i, rawData: s };
   }
   /**
    * 获取进口道所在的进口道编号
    *
    * @param {armData} armData 进口道编号区域
-   * @param {*} graphicPpolygon 绘制的区域
+   * @param {*} graphicPolygon 绘制的区域
    * @returns
    * @memberof SketchView
    */
-  getIntersectionArea(e, t) {
-    const i = Object.keys(e);
+  getIntersectionArea(t, e) {
+    const i = Object.keys(t);
     let s = !1;
     for (let r = 0; r < i.length; r++) {
-      const o = i[r], a = e[o];
-      if (A(
-        m.polygon(t),
-        m.polygon(a)
+      const o = i[r], a = t[o];
+      if (k(
+        d.polygon(e),
+        d.polygon(a)
       )) {
         s = o;
         break;
@@ -310,35 +318,36 @@ class C {
     }
     return s;
   }
-  filterData(e) {
-    const t = w(e);
-    return t.length > 0 && t[0][0] === t[t.length - 1][0] && t[0][1] === t[t.length - 1][1] && t.pop(), t;
+  filterData(t) {
+    const e = u(t);
+    return e.length > 0 && e[0][0] === e[e.length - 1][0] && e[0][1] === e[e.length - 1][1] && e.pop(), e;
   }
   /**
    *
    *
    * @private
    * @param {*} geometry
-   * @param {boolean} [isfilterData=true] 是否过滤首尾相同点数据
+   * @param {boolean} [isFilterData=true] 是否过滤首尾相同点数据
    * @returns
    * @memberof SketchView
    */
-  getGraphicPoint(e, t = !0) {
-    const i = y.webMercatorToGeographic(e);
+  getGraphicPoint(t, e = !0) {
+    let i = t;
+    this.viewer.spatialReference.isWebMercator && (i = g.webMercatorToGeographic(t));
     let s;
-    if (e.type === "point")
+    if (t.type === "point")
       s = {
-        type: e.type,
+        type: t.type,
         x: i.x,
         y: i.y
       };
-    else if (e.type === "polyline") {
+    else if (t.type === "polyline") {
       s = {
-        type: e.type,
+        type: t.type,
         paths: []
       }, i.paths.forEach((n) => {
         let h = n;
-        t && (h = this.filterData(n)), h.forEach((p) => {
+        e && (h = this.filterData(n)), h.forEach((p) => {
           s.paths.push(p);
         });
       });
@@ -351,12 +360,12 @@ class C {
       }, a = this.getAngle(r, o);
       s.angle = a;
     } else
-      e.type === "polygon" && (s = {
-        type: e.type,
+      t.type === "polygon" && (s = {
+        type: t.type,
         rings: []
       }, i.rings.forEach((r) => {
         let o = r;
-        t && (o = this.filterData(r)), o.forEach((a) => {
+        e && (o = this.filterData(r)), o.forEach((a) => {
           s.rings.push(a);
         });
       }));
@@ -379,8 +388,8 @@ class C {
    * @returns
    * @memberof SketchView
    */
-  getAngle(e, t) {
-    const i = t.x - e.x, s = t.y - e.y;
+  getAngle(t, e) {
+    const i = e.x - t.x, s = e.y - t.y;
     return Math.atan2(s, i) * 180 / Math.PI;
   }
   /**
@@ -392,9 +401,9 @@ class C {
    * @returns
    * @memberof SketchView
    */
-  getshiftLine(e, t, i = "meters") {
-    const s = e, r = -t;
-    return G.offset(
+  getShiftLine(t, e, i = "meters") {
+    const s = t, r = -e;
+    return L.offset(
       s,
       r,
       i
@@ -408,7 +417,7 @@ class C {
    * @param {*} symbol 线的样式
    * @memberof SketchView
    */
-  setshiftLine(e, t = "meters", i) {
+  setShiftLine(t, e = "meters", i) {
     i || (i = {
       type: "simple-line",
       color: [0, 0, 255],
@@ -416,10 +425,10 @@ class C {
     }), this.removeShiftLine(), this.graphicsLayer.graphics.map((s) => {
       const r = s.geometry, o = s.attributes;
       if ((r == null ? void 0 : r.type) === "polyline" && (o == null ? void 0 : o.type) === "draw") {
-        const a = o.id, n = this.getshiftLine(
+        const a = o.id, n = this.getShiftLine(
           r,
-          e,
-          t
+          t,
+          e
         ), h = new l({
           geometry: n,
           symbol: i,
@@ -435,32 +444,32 @@ class C {
    * @memberof SketchView
    */
   removeShiftLine() {
-    const e = [];
-    this.graphicsLayer.graphics.map((t) => {
-      const i = t.attributes;
-      (i == null ? void 0 : i.type) === "shiftLine" && e.push(t);
-    }), this.graphicsLayer.removeMany(e);
+    const t = [];
+    this.graphicsLayer.graphics.map((e) => {
+      const i = e.attributes;
+      (i == null ? void 0 : i.type) === "shiftLine" && t.push(e);
+    }), this.graphicsLayer.removeMany(t);
   }
   /**
    * 移除绘制的线
    *
    * @memberof SketchView
    */
-  removedraw() {
-    const e = [];
-    this.graphicsLayer.graphics.map((t) => {
-      const i = t.attributes;
-      (i == null ? void 0 : i.type) === "draw" && e.push(t);
-    }), this.graphicsLayer.removeMany(e);
-  }
-  addGraphic(e, t = {
+  removeDraw() {
+    const t = [];
+    this.graphicsLayer.graphics.map((e) => {
+      const i = e.attributes;
+      (i == null ? void 0 : i.type) === "draw" && t.push(e);
+    }), this.graphicsLayer.removeMany(t);
+  }
+  addGraphic(t, e = {
     type: "simple-line",
     color: [0, 0, 255],
     width: 2
   }, i) {
     const s = new l({
-      geometry: e,
-      symbol: t,
+      geometry: t,
+      symbol: e,
       attributes: i
     });
     this.graphicsLayer.add(s);
@@ -473,12 +482,12 @@ class C {
    * @returns
    * @memberof SketchView
    */
-  getDirection(e, t) {
-    const i = t.x - e.x, s = t.y - e.y, o = Math.atan2(s, i) * 180 / Math.PI;
+  getDirection(t, e) {
+    const i = e.x - t.x, s = e.y - t.y, o = Math.atan2(s, i) * 180 / Math.PI;
     return o >= -45 && o <= 45 ? 0 : o > 45 && o <= 135 ? 1 : o > 135 || o <= -135 ? 2 : 3;
   }
-  findLayerById(e) {
-    return this.viewer.map.findLayerById(e);
+  findLayerById(t) {
+    return this.viewer.map.findLayerById(t);
   }
   /**
    *  根据id查找平移线graphic
@@ -487,30 +496,30 @@ class C {
    * @returns
    * @memberof SketchView
    */
-  findShiftLineGraphicsById(e) {
-    return this.graphicsLayer.graphics.find((i) => i.attributes.id === e && i.attributes.type === "shiftLine");
+  findShiftLineGraphicsById(t) {
+    return this.graphicsLayer.graphics.find((i) => i.attributes.id === t && i.attributes.type === "shiftLine");
   }
   /**
    *  删除指定的图形
    * @param graphic 删除指定的图形
    */
-  remove(e) {
-    this.graphicsLayer.remove(e);
+  remove(t) {
+    this.graphicsLayer.remove(t);
   }
   /**
    *  设置最大允许绘制的图形数量
    * @param num  数量
    */
-  setmaxAllowedGraphics(e) {
-    this.options.maxAllowedGraphics = e === 0 ? void 0 : e;
+  setMaxAllowedGraphics(t) {
+    this.options.maxAllowedGraphics = t === 0 ? void 0 : t;
   }
-  deepClone(e) {
+  deepClone(t) {
   }
   destroy() {
-    var e, t;
-    this.viewer.map.remove(this.graphicsLayer), this.viewer.map.remove(this.TextgraphicsLayer), (e = this.sketch) == null || e.destroy(), (t = this.sketchViewModel) == null || t.destroy();
+    var t, e;
+    this.viewer.map.remove(this.graphicsLayer), this.viewer.map.remove(this.TextGraphicsLayer), (t = this.sketch) == null || t.destroy(), (e = this.sketchViewModel) == null || e.destroy();
   }
 }
 export {
-  C as default
+  B as default
 };