gisviewer-vue3-arcgis 1.0.142 → 1.0.144

package/lib/src/gis-map/utils/sketchView.d.ts

@@ -1,9 +1,9 @@
+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 SketchViewModel from '@arcgis/core/widgets/Sketch/SketchViewModel';
 import Sketch from '@arcgis/core/widgets/Sketch';
-import Graphic from '@arcgis/core/Graphic';
+import SketchViewModel from '@arcgis/core/widgets/Sketch/SketchViewModel';
 interface sketchViewOptions {
     /**
      * 最大允许绘制的图形数量
@@ -16,7 +16,7 @@ interface sketchViewOptions {
     /**
      * 绘制工具显示的元素
      */
-    sketchvisibleElements?: {};
+    sketchVisibleElements?: {};
     /**
      * 绘制工具显示的位置
      */
@@ -27,7 +27,7 @@ interface sketchViewOptions {
      * @type {boolean}
      * @memberof sketchViewOptions
      */
-    defaultsketchVisible?: boolean;
+    defaultSketchVisible?: boolean;
     sketchViewModelItemSymbol?: {
         polylineSymbol?: any;
         polygonSymbol?: any;
@@ -42,7 +42,7 @@ declare type LinearUnits = 'meters' | 'feet' | 'kilometers' | 'miles' | 'nautica
 export default class SketchView {
     private viewer;
     graphicsLayer: GraphicsLayer;
-    TextgraphicsLayer: GraphicsLayer;
+    TextGraphicsLayer: GraphicsLayer;
     sketchViewModel: SketchViewModel;
     sketch: Sketch;
     options: sketchViewOptions;
@@ -74,10 +74,10 @@ export default class SketchView {
      * @returns
      * @memberof SketchView
      */
-    inintSectionArea(data: any, reverse?: boolean): any;
+    initSectionArea(data: any, reverse?: boolean): any;
     createPolylineGraphic(paths: any, lineSymbol: any, attributes: any): Graphic;
     createPolygonGraphic(rings: any, lineSymbol: any, attributes: any): Graphic;
-    on(callcack?: (type: string, points: any, event?: any) => void): void;
+    on(callback?: (type: string, points: any, event?: any) => void): void;
     /**
      * 获取当前绘制的计算区域
      * @returns
@@ -105,7 +105,7 @@ export default class SketchView {
                 attributes: any;
             };
         };
-        rawdata: {
+        rawData: {
             point: any;
             type: string;
             attributes: any;
@@ -115,7 +115,7 @@ export default class SketchView {
      * 获取进口道所在的进口道编号
      *
      * @param {armData} armData 进口道编号区域
-     * @param {*} graphicPpolygon 绘制的区域
+     * @param {*} graphicPolygon 绘制的区域
      * @returns
      * @memberof SketchView
      */
@@ -126,7 +126,7 @@ export default class SketchView {
      *
      * @private
      * @param {*} geometry
-     * @param {boolean} [isfilterData=true] 是否过滤首尾相同点数据
+     * @param {boolean} [isFilterData=true] 是否过滤首尾相同点数据
      * @returns
      * @memberof SketchView
      */
@@ -152,7 +152,7 @@ export default class SketchView {
      * @returns
      * @memberof SketchView
      */
-    getshiftLine(lineGeometry: __esri.Geometry, distance: number, offsetUnit?: LinearUnits): __esri.Geometry | __esri.Geometry[];
+    getShiftLine(lineGeometry: __esri.Geometry, distance: number, offsetUnit?: LinearUnits): __esri.Geometry | __esri.Geometry[];
     /**
      * 设置线的平移
      *
@@ -161,7 +161,7 @@ export default class SketchView {
      * @param {*} symbol 线的样式
      * @memberof SketchView
      */
-    setshiftLine(distance: number, offsetUnit?: LinearUnits, symbol?: any): void;
+    setShiftLine(distance: number, offsetUnit?: LinearUnits, symbol?: any): void;
     /**
      * 移除平移线
      *
@@ -173,7 +173,7 @@ export default class SketchView {
      *
      * @memberof SketchView
      */
-    removedraw(): void;
+    removeDraw(): void;
     addGraphic(geometry: any, symbol?: any, attributes?: any): void;
     /**
      * 获取方向
@@ -202,7 +202,7 @@ export default class SketchView {
      *  设置最大允许绘制的图形数量
      * @param num  数量
      */
-    setmaxAllowedGraphics(num: number): void;
+    setMaxAllowedGraphics(num: number): void;
     deepClone(obj: any): void;
     destroy(): void;
 }

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

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("@arcgis/core/layers/GraphicsLayer"),b=require("@arcgis/core/widgets/Sketch/SketchViewModel"),P=require("@arcgis/core/widgets/Sketch"),G=require("@arcgis/core/geometry/support/webMercatorUtils.js"),k=require("@arcgis/core/geometry/geometryEngine.js"),l=require("@arcgis/core/Graphic"),S=require("uuid"),M=require("@arcgis/core/geometry/Polygon.js"),A=require("@arcgis/core/geometry/Polyline.js"),v=require("@turf/intersect"),x=require("@turf/helpers");function f(a){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(a){for(const e in a)if(e!=="default"){const i=Object.getOwnPropertyDescriptor(a,e);Object.defineProperty(t,e,i.get?i:{enumerable:!0,get:()=>a[e]})}}return t.default=a,Object.freeze(t)}const y=f(G),E=f(k),m=f(x);function L(a,t=[]){if(a===null||typeof a!="object")return a;if(Object.prototype.toString.call(a)==="[object Date]")return new Date(a);if(Object.prototype.toString.call(a)==="[object RegExp]")return new RegExp(a);if(Object.prototype.toString.call(a)==="[object Error]")return new Error(a);const e=t.filter(s=>s.original===a)[0];if(e)return e.copy;const i=Array.isArray(a)?[]:{};return t.push({original:a,copy:i}),Object.keys(a).forEach(s=>{i[s]=L(a[s],t)}),i}const V={maxAllowedGraphics:0,GraphicsLayer:{},sketchvisibleElements:{},sketchPosition:"top-left",defaultsketchVisible:!0,sketchViewModelItemSymbol:{}},w={type:"simple-line",color:"#556DEA",width:2},d={type:"simple-fill",color:[227,139,79,.4],outline:{color:[255,255,255],width:1}};class O{constructor(t,e){this.viewer=t,this.options={...V,...e},this.graphicsLayer=new u({...this.options.GraphicsLayer}),this.TextgraphicsLayer=new u,this.viewer.map.layers.add(this.graphicsLayer),this.viewer.map.layers.add(this.TextgraphicsLayer),this.init()}init(){this.sketchViewModel=new b({layer:this.graphicsLayer,view:this.viewer,updateOnGraphicClick:!0,polylineSymbol:w,polygonSymbol:d,...this.options.sketchViewModelItemSymbol});const t=this.findLayerById("TrafficMarkings"),e=[];t&&e.push({layer:t,enabled:!0}),this.sketch=new P({view:this.viewer,viewModel:this.sketchViewModel,layer:this.graphicsLayer,visible:this.options.defaultsketchVisible,snappingOptions:{enabled:!0,featureSources:e}}),this.sketch.visibleElements={...this.options.sketchvisibleElements},this.viewer.ui.add(this.sketch,this.options.sketchPosition)}initPoint(t,e="all",i=!1){if(!t)return;const{crossArea:s,sectionArea:r}=t;if(s&&(e=="crossArea"||e=="all")){const o=this.initCrossArea(s);this.graphicsLayer.add(o)}if(r&&(e=="sectionArea"||e=="all")){const o=this.inintSectionArea(r,i);this.graphicsLayer.addMany(o)}}initEntranceFusionZone(t){const e=[],i=d;t.map(s=>{e.push(this.createPolygonGraphic(s,i,{}))}),this.graphicsLayer.addMany(e)}initCrossArea(t){const e=d;return this.createPolygonGraphic(t,e,{})}inintSectionArea(t,e=!1){const i=[],s=w,r={type:"simple-line",color:[0,0,255],width:2};return Object.keys(t).map(o=>{const c=t[o][0],n=t[o][1];e&&(c.reverse(),n.reverse());const h=S.v4(),p=this.createPolylineGraphic(c,s,{type:"draw",id:h}),g=this.createPolylineGraphic(n,r,{type:"shiftLine",id:h});i.push(p,g)}),i}createPolylineGraphic(t,e,i){const s=new A({paths:t}),r=y.geographicToWebMercator(s);return new l({geometry:r,symbol:e,attributes:i})}createPolygonGraphic(t,e,i){const s=new M({rings:t}),r=y.geographicToWebMercator(s);return new l({geometry:r,symbol:e,attributes:i})}on(t){const e=this;this.sketchViewModel.on("create",function(i){var r,o,c;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"&&((c=i.graphic)!=null&&c.geometry)){console.log(i.graphic);const n=i.graphic.geometry;i.graphic.setAttribute("type","draw"),i.graphic.setAttribute("id",new Date().getTime());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];e.graphicsLayer.remove(s);return}if(i.state==="complete"&&i.graphics.length>0){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,e.graphicsLayer.graphics),i.graphics.length>0){const r=i.graphics[0].geometry,o=e.getGraphicPoint(r);t&&t("delete",o,i)}})}graphicPoint(){const t=[];return this.graphicsLayer.graphics.map(e=>{var r;const i=e.geometry,s=this.getGraphicPoint(i);t.push({point:s,type:(r=e.attributes)==null?void 0:r.type,attributes:e.attributes})}),t}getEntranceRoad(){const t={},e=this.graphicPoint().filter(n=>n.point.type==="polyline");if(console.log("🚀 ~ file: sketchView.ts:378 ~ SketchView ~ getEntranceRoad ~ graphics:",e),!e.length)return!1;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)throw"绘制的线和平移的线数量不一致！";const r=i.sort((n,h)=>n.point.angle-h.point.angle),o=r.findIndex(n=>n.point.angle>135);return[...r.slice(o),...r.slice(0,o).reverse()].map((n,h)=>{const p=s.find(g=>g.attributes.id==n.attributes.id);if(!p)throw"绘制的线和平移的线不匹配！";console.log("🚀 ~ file: sketchView.ts:393 ~ SketchView ~ getEntranceRoad ~ m:",n,p),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]]}}),t}getEntranceFusionZone(t){const e=[],i={};this.graphicsLayer.graphics.map(r=>{var n;const o=r.geometry,c=this.getGraphicPoint(o,!1);e.push({point:c,type:(n=r.attributes)==null?void 0:n.type,attributes:r.attributes})});const s=e;return t.map((r,o)=>{i[r]=e[o]}),{graphics:i,rawdata:s}}getIntersectionArea(t,e){const i=Object.keys(t);let s=!1;for(let r=0;r<i.length;r++){const o=i[r],c=t[o];if(v(m.polygon(e),m.polygon(c))){s=o;break}}return s}filterData(t){const e=L(t);return e.length>0&&e[0][0]===e[e.length-1][0]&&e[0][1]===e[e.length-1][1]&&e.pop(),e}getGraphicPoint(t,e=!0){const i=y.webMercatorToGeographic(t);let s;if(t.type==="point")s={type:t.type,x:i.x,y:i.y};else if(t.type==="polyline"){s={type:t.type,paths:[]},i.paths.forEach(n=>{let h=n;e&&(h=this.filterData(n)),h.forEach(p=>{s.paths.push(p)})});const r={x:s.paths[0][0],y:s.paths[0][1]},o={x:s.paths[s.paths.length-1][0],y:s.paths[s.paths.length-1][1]},c=this.getAngle(r,o);s.angle=c}else t.type==="polygon"&&(s={type:t.type,rings:[]},i.rings.forEach(r=>{let o=r;e&&(o=this.filterData(r)),o.forEach(c=>{s.rings.push(c)})}));return s}close(){this.sketch.visible=!1}show(){this.sketch.visible=!0}removeAll(){this.graphicsLayer.removeAll()}getAngle(t,e){const i=e.x-t.x,s=e.y-t.y;return Math.atan2(s,i)*180/Math.PI}getshiftLine(t,e,i="meters"){const s=t,r=-e;return E.offset(s,r,i)}setshiftLine(t,e="meters",i){i||(i={type:"simple-line",color:[0,0,255],width:2}),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 c=o.id,n=this.getshiftLine(r,t,e),h=new l({geometry:n,symbol:i,attributes:{type:"shiftLine",id:c}});this.graphicsLayer.add(h)}})}removeShiftLine(){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)}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:t,symbol:e,attributes:i});this.graphicsLayer.add(s)}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(t){return this.viewer.map.findLayerById(t)}findShiftLineGraphicsById(t){return this.graphicsLayer.graphics.find(i=>i.attributes.id===t&&i.attributes.type==="shiftLine")}remove(t){this.graphicsLayer.remove(t)}setmaxAllowedGraphics(t){this.options.maxAllowedGraphics=t===0?void 0:t}deepClone(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()}}exports.default=O;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const b=require("@arcgis/core/geometry/geometryEngine.js"),P=require("@arcgis/core/geometry/support/webMercatorUtils.js"),l=require("@arcgis/core/Graphic"),u=require("@arcgis/core/layers/GraphicsLayer"),G=require("@arcgis/core/widgets/Sketch"),S=require("@arcgis/core/widgets/Sketch/SketchViewModel"),k=require("@arcgis/core/geometry/Polygon.js"),M=require("@arcgis/core/geometry/Polyline.js"),A=require("@turf/helpers"),x=require("@turf/intersect"),v=require("uuid"),E=require("../stores/index.js");function f(a){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(a){for(const t in a)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(a,t);Object.defineProperty(e,t,i.get?i:{enumerable:!0,get:()=>a[t]})}}return e.default=a,Object.freeze(e)}const V=f(b),g=f(P),d=f(A);function w(a,e=[]){if(a===null||typeof a!="object")return a;if(Object.prototype.toString.call(a)==="[object Date]")return new Date(a);if(Object.prototype.toString.call(a)==="[object RegExp]")return new RegExp(a);if(Object.prototype.toString.call(a)==="[object Error]")return new Error(a);const t=e.filter(s=>s.original===a)[0];if(t)return t.copy;const i=Array.isArray(a)?[]:{};return e.push({original:a,copy:i}),Object.keys(a).forEach(s=>{i[s]=w(a[s],e)}),i}const O={maxAllowedGraphics:0,GraphicsLayer:{},sketchVisibleElements:{},sketchPosition:"top-right",defaultSketchVisible:!0,sketchViewModelItemSymbol:{}},m={type:"simple-line",color:"#556DEA",width:2},y={type:"simple-fill",color:[227,139,79,.4],outline:{color:[255,255,255],width:1}};class D{constructor(e,t){this.viewer=e,this.options={...O,...t},this.graphicsLayer=new u({...this.options.GraphicsLayer}),this.TextGraphicsLayer=new u,this.viewer.map.layers.add(this.graphicsLayer),this.viewer.map.layers.add(this.TextGraphicsLayer),this.init()}init(){this.sketchViewModel=new S({layer:this.graphicsLayer,view:this.viewer,updateOnGraphicClick:!0,polylineSymbol:m,polygonSymbol:y,...this.options.sketchViewModelItemSymbol});const e=this.findLayerById("TrafficMarkings"),t=[];e&&t.push({layer:e,enabled:!0}),this.sketch=new G({view:this.viewer,viewModel:this.sketchViewModel,layer:this.graphicsLayer,visible:this.options.defaultSketchVisible,snappingOptions:{enabled:!0,featureSources:t}}),this.sketch.visibleElements={...this.options.sketchVisibleElements},this.viewer.ui.add(this.sketch,this.options.sketchPosition);const i=E.default.useAppDataStore;this.sketch.on("create",s=>{s.state==="complete"?i.isSketching=!1:s.state==="start"&&(i.isSketching=!0)})}initPoint(e,t="all",i=!1){if(!e)return;const{crossArea:s,sectionArea:r}=e;if(s&&(t=="crossArea"||t=="all")){const o=this.initCrossArea(s);this.graphicsLayer.add(o)}if(r&&(t=="sectionArea"||t=="all")){const o=this.initSectionArea(r,i);this.graphicsLayer.addMany(o)}}initEntranceFusionZone(e){const t=[];e.map(i=>{t.push(this.createPolygonGraphic(i,y,{}))}),this.graphicsLayer.addMany(t)}initCrossArea(e){return this.createPolygonGraphic(e,y,{})}initSectionArea(e,t=!1){const i=[],s={type:"simple-line",color:[0,0,255],width:2};return Object.keys(e).map(r=>{const o=e[r][0],c=e[r][1];t&&(o.reverse(),c.reverse());const n=v.v4(),h=this.createPolylineGraphic(o,m,{type:"draw",id:n}),p=this.createPolylineGraphic(c,s,{type:"shiftLine",id:n});i.push(h,p)}),i}createPolylineGraphic(e,t,i){const s=new M({paths:e}),r=g.geographicToWebMercator(s);return new l({geometry:r,symbol:t,attributes:i})}createPolygonGraphic(e,t,i){const s=new k({rings:e}),r=g.geographicToWebMercator(s);return new l({geometry:r,symbol:t,attributes:i})}on(e){const t=this;this.sketchViewModel.on("create",function(i){var r,o,c;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("已达到最大图形数量，无法继续绘制！");return}if(i.state==="complete"&&((c=i.graphic)!=null&&c.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)}}),this.sketchViewModel.on("update",function(i){if(console.log("update",i),i.aborted){const s=i.graphics[0];t.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)}}),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)}})}graphicPoint(){const e=[];return this.graphicsLayer.graphics.map(t=>{var r;const i=t.geometry,s=this.getGraphicPoint(i);e.push({point:s,type:(r=t.attributes)==null?void 0:r.type,attributes:t.attributes})}),e}getEntranceRoad(){const e={},t=this.graphicPoint().filter(n=>n.point.type==="polyline");if(console.log("🚀 ~ file: sketchView.ts:378 ~ SketchView ~ getEntranceRoad ~ graphics:",t),!t.length)return!1;const i=t.filter(n=>n.type=="draw"),s=t.filter(n=>n.type=="shiftLine");if(s.length==0)throw"未绘制平移！";if(i.length!=s.length)throw"绘制的线和平移的线数量不一致！";const r=i.sort((n,h)=>n.point.angle-h.point.angle),o=r.findIndex(n=>n.point.angle>135);return[...r.slice(o),...r.slice(0,o).reverse()].map((n,h)=>{const p=s.find(L=>L.attributes.id==n.attributes.id);if(!p)throw"绘制的线和平移的线不匹配！";console.log("🚀 ~ file: sketchView.ts:393 ~ SketchView ~ getEntranceRoad ~ m:",n,p),e[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}getEntranceFusionZone(e){const t=[],i={};this.graphicsLayer.graphics.map(r=>{var n;const o=r.geometry,c=this.getGraphicPoint(o,!1);t.push({point:c,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}}getIntersectionArea(e,t){const i=Object.keys(e);let s=!1;for(let r=0;r<i.length;r++){const o=i[r],c=e[o];if(x(d.polygon(t),d.polygon(c))){s=o;break}}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}getGraphicPoint(e,t=!0){let i=e;this.viewer.spatialReference.isWebMercator&&(i=g.webMercatorToGeographic(e));let s;if(e.type==="point")s={type:e.type,x:i.x,y:i.y};else if(e.type==="polyline"){s={type:e.type,paths:[]},i.paths.forEach(n=>{let h=n;t&&(h=this.filterData(n)),h.forEach(p=>{s.paths.push(p)})});const r={x:s.paths[0][0],y:s.paths[0][1]},o={x:s.paths[s.paths.length-1][0],y:s.paths[s.paths.length-1][1]},c=this.getAngle(r,o);s.angle=c}else e.type==="polygon"&&(s={type:e.type,rings:[]},i.rings.forEach(r=>{let o=r;t&&(o=this.filterData(r)),o.forEach(c=>{s.rings.push(c)})}));return s}close(){this.sketch.visible=!1}show(){this.sketch.visible=!0}removeAll(){this.graphicsLayer.removeAll()}getAngle(e,t){const i=t.x-e.x,s=t.y-e.y;return Math.atan2(s,i)*180/Math.PI}getShiftLine(e,t,i="meters"){const s=e,r=-t;return V.offset(s,r,i)}setShiftLine(e,t="meters",i){i||(i={type:"simple-line",color:[0,0,255],width:2}),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 c=o.id,n=this.getShiftLine(r,e,t),h=new l({geometry:n,symbol:i,attributes:{type:"shiftLine",id:c}});this.graphicsLayer.add(h)}})}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)}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={type:"simple-line",color:[0,0,255],width:2},i){const s=new l({geometry:e,symbol:t,attributes:i});this.graphicsLayer.add(s)}getDirection(e,t){const i=t.x-e.x,s=t.y-e.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)}findShiftLineGraphicsById(e){return this.graphicsLayer.graphics.find(i=>i.attributes.id===e&&i.attributes.type==="shiftLine")}remove(e){this.graphicsLayer.remove(e)}setMaxAllowedGraphics(e){this.options.maxAllowedGraphics=e===0?void 0:e}deepClone(e){}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()}}exports.default=D;

package/lib/src/gis-map/utils/sketchViewTool.d.ts

@@ -1,9 +1,9 @@
+import Graphic from '@arcgis/core/Graphic.js';
 import GraphicsLayer from '@arcgis/core/layers/GraphicsLayer';
 import MapView from '@arcgis/core/views/MapView';
 import SceneView from '@arcgis/core/views/SceneView';
-import SketchViewModel from '@arcgis/core/widgets/Sketch/SketchViewModel';
 import Sketch from '@arcgis/core/widgets/Sketch';
-import Graphic from '@arcgis/core/Graphic.js';
+import SketchViewModel from '@arcgis/core/widgets/Sketch/SketchViewModel';
 import * as turf from '@turf/turf';
 interface sketchViewOptions {
     /**
@@ -17,7 +17,7 @@ interface sketchViewOptions {
     /**
      * 绘制工具显示的元素
      */
-    sketchvisibleElements?: {};
+    sketchVisibleElements?: {};
     /**
      * 绘制工具显示的位置
      */
@@ -28,7 +28,7 @@ interface sketchViewOptions {
      * @type {boolean}
      * @memberof sketchViewOptions
      */
-    defaultsketchVisible?: boolean;
+    defaultSketchVisible?: boolean;
     sketchViewModelItemSymbol?: {
         polylineSymbol?: any;
         polygonSymbol?: any;
@@ -45,7 +45,7 @@ declare type dimensionTypeFace = 'distance' | 'area' | 'angle' | null;
 export default class sketchViewTool {
     private viewer;
     graphicsLayer: GraphicsLayer;
-    TextgraphicsLayer: GraphicsLayer;
+    textGraphicsLayer: GraphicsLayer;
     sketchViewModel: SketchViewModel;
     sketch: Sketch;
     options: sketchViewOptions;
@@ -78,12 +78,12 @@ export default class sketchViewTool {
     dimensionType: dimensionTypeFace;
     constructor(view: MapView | SceneView, options?: sketchViewOptions);
     init(): void;
-    on(callcack?: (type: string, state: string, event: any) => void): void;
-    onCreate(event: __esri.SketchCreateEvent, callcack?: (type: string, state: string, event?: any) => void): void;
+    on(callback?: (type: string, state: string, event: any) => void): void;
+    onCreate(event: __esri.SketchCreateEvent, callback?: (type: string, state: string, event?: any) => void): void;
     onCreateToCancel(): void;
-    onUpdate(event: __esri.SketchUpdateEvent, callcack?: (type: string, state: string, event?: any) => void): void;
-    onDelete(event: __esri.SketchDeleteEvent, callcack?: (type: string, state: string, event: any) => void): void;
-    addpolyline(paths: number[][][]): void;
+    onUpdate(event: __esri.SketchUpdateEvent, callback?: (type: string, state: string, event?: any) => void): void;
+    onDelete(event: __esri.SketchDeleteEvent, callback?: (type: string, state: string, event: any) => void): void;
+    addPolyline(paths: number[][][]): void;
     createPolylineGraphic(paths: number[][], lineSymbol: any, attributes: any): Graphic;
     createDom(): HTMLDivElement | undefined;
     removeDom(): void;
@@ -145,8 +145,8 @@ export default class sketchViewTool {
      */
     calculatePointHeading(path: number[][], direction?: string): number;
     drawPolylinePoint(drawStartGraphic: __esri.Geometry, parentId: string, actions?: string): void;
-    updatePpolylinePoint(drawStartGraphic: Graphic[]): void;
-    delPpolylinePoint(drawStartGraphic: Graphic[]): void;
+    updatePolylinePoint(drawStartGraphic: Graphic[]): void;
+    deletePolylinePoint(drawStartGraphic: Graphic[]): void;
     /**
      * 添加或者更新标记点
      *
@@ -186,7 +186,7 @@ export default class sketchViewTool {
      *  获取当前绘制的图形的长度
      * @returns
      */
-    getDrawgraphicLength(): string | 0;
+    getDrawGraphicLength(): string | 0;
     /**
      *  获取两点的角度
      *
@@ -204,7 +204,7 @@ export default class sketchViewTool {
      * @returns
      * @memberof sketchViewTool
      */
-    getbearing(startPoint: ITPoint, endPoint: ITPoint): number;
+    getBearing(startPoint: ITPoint, endPoint: ITPoint): number;
     /**
      *  获取两点的距离
      * @param startPoint
@@ -243,11 +243,11 @@ export default class sketchViewTool {
     /**
      * 开启图层捕捉
      */
-    turnonlayerSnap(): void;
+    turnOnLayerSnap(): void;
     /**
      * 关闭图层捕捉
      */
-    turnofflayerSnap(): void;
+    turnOffLayerSnap(): void;
     setDimensionType(Type: dimensionTypeFace): void;
     /**
      *  删除指定的图形

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

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("@arcgis/core/layers/GraphicsLayer"),b=require("@arcgis/core/widgets/Sketch/SketchViewModel"),G=require("@arcgis/core/widgets/Sketch"),M=require("@arcgis/core/geometry/support/webMercatorUtils.js"),D=require("@arcgis/core/geometry/geometryEngine.js"),m=require("@arcgis/core/Graphic.js"),f=require("@arcgis/core/geometry/Polyline.js"),L=require("@turf/turf");function y(d){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const e in d)if(e!=="default"){const i=Object.getOwnPropertyDescriptor(d,e);Object.defineProperty(t,e,i.get?i:{enumerable:!0,get:()=>d[e]})}}return t.default=d,Object.freeze(t)}const p=y(M),w=y(D),c=y(L),T={maxAllowedGraphics:0,GraphicsLayer:{},sketchvisibleElements:{},sketchPosition:"top-left",defaultsketchVisible:!0,sketchViewModelItemSymbol:{}},x={type:"simple-line",color:"#556DEA",width:2},k={type:"simple-fill",color:[227,139,79,.4],outline:{color:[255,255,255],width:1}};class S{constructor(t,e){this.isDraw=!1,this.drawStartGraphicId=null,this.drawPointGraphic=new Map,this.dimensionType=null,this.viewer=t,this.options={...T,...e},this.graphicsLayer=new u({...this.options.GraphicsLayer}),this.TextgraphicsLayer=new u,this.viewer.map.layers.add(this.graphicsLayer),this.viewer.map.layers.add(this.TextgraphicsLayer),this.init()}init(){this.sketchViewModel=new b({layer:this.graphicsLayer,view:this.viewer,updateOnGraphicClick:!0,polylineSymbol:x,polygonSymbol:k,...this.options.sketchViewModelItemSymbol});const t=this.findLayerById("TrafficToolMarkings"),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,snappingOptions:{enabled:!0,featureSources:e}}),this.sketch.visibleElements={...this.options.sketchvisibleElements},this.viewer.ui.add(this.sketch,this.options.sketchPosition);const i=this;this.viewer.on("pointer-move",function(s){const r={x:s.x,y:s.y};if(i.isDraw&&i.dimensionType=="distance"){i.tipsDom||(i.tipsDom=i.createDom());const o=i.getDrawgraphicLength();i.tipsDom.innerText=`${o}米`,i.tipsDom.style.left=`${r.x}px`,i.tipsDom.style.top=`${r.y+3}px`,i.tipsDom.style.pointerEvents="none"}})}on(t){const e=this;this.sketch.on("create",function(i){e.onCreate(i,t)}),this.sketch.on("update",function(i){e.onUpdate(i,t)}),this.sketch.on("delete",function(i){e.onDelete(i,t)}),this.sketch.on("redo",function(i){console.log("redo",i),t&&t("redo","complete",i)}),this.sketch.on("undo",function(i){console.log("undo",i),t&&t("undo","complete",i)})}onCreate(t,e){if(console.log("create",t),this.drawStartGraphicId||(this.drawStartGraphicId=new Date().getTime().toString()),t.graphic.getAttribute("id")||(t.graphic.setAttribute("type","draw"),t.graphic.setAttribute("id",this.drawStartGraphicId)),t.state==="start"&&t.graphic.geometry.type==="polyline"&&(this.isDraw=!0,this.drawStartGraphic=p.webMercatorToGeographic(t.graphic.geometry),this.dimensionType=="distance")){const i=this.getGeometryXY(this.drawStartGraphic,0),s=`${this.drawStartGraphicId}-start`;this.addOrUpdateMarkPoint("起点",i,s)}if(t.state==="active"&&t.graphic.geometry.type==="polyline"){const i=p.webMercatorToGeographic(t.graphic.geometry),s=this.drawStartGraphicId;this.dimensionType=="distance"&&(this.drawPolylinePoint(i,s),this.drawStartGraphic=i)}if(t.state==="complete"&&t.graphic.geometry.type==="polyline"&&this.dimensionType=="distance"){const i=this.getDrawgraphicLength(),s=`${this.drawStartGraphicId}-end`,r=p.webMercatorToGeographic(t.graphic.geometry),o=r.paths[0],n=this.getGeometryXY(r,o.length-1);this.addOrUpdateMarkPoint(`总长度：${i}米`,n,s),this.drawStartGraphic=null,this.removeDom(),this.isDraw=!1,this.drawStartGraphicId=null}t.state==="cancel"&&t.graphic.geometry.type==="polyline"&&this.onCreateToCancel(),e&&e("create",t.state,t.graphic)}onCreateToCancel(){this.removeDom(),this.isDraw=!1,this.drawStartGraphic=null;const t=this.drawStartGraphicId;this.drawPointGraphic.forEach((e,i)=>{new RegExp(`^${t}-`).test(i)&&(this.TextgraphicsLayer.remove(e),this.drawPointGraphic.delete(i))}),this.drawStartGraphicId=null}onUpdate(t,e){console.log("update",t),this.updatePpolylinePoint(t.graphics.filter(i=>i.geometry.type==="polyline")),e&&e("update",t.state,t.graphics)}onDelete(t,e){console.log("delete",t),this.delPpolylinePoint(t.graphics.filter(i=>i.geometry.type==="polyline")),e&&e("delete","complete",t.graphics)}addpolyline(t){const e=[],i=x,s={type:"draw",id:new Date().getTime().toString()};t.map(r=>{e.push(this.createPolylineGraphic(r,i,{...s}))}),this.graphicsLayer.addMany(e)}createPolylineGraphic(t,e,i){const s=new f({paths:[t]}),r=p.geographicToWebMercator(s);return new m({geometry:r,symbol:e,attributes:i})}createDom(){const t=document.createElement("div");t.style.position="absolute",t.style.top="0px",t.style.left="0px",t.style.width="100px",t.style.height="80px",t.style.zIndex="999",t.style.display="flex",t.style.justifyContent="center",t.style.alignItems="center",t.style.color="#fff",t.style.fontSize="20px",t.style.fontWeight="bold",t.innerText="";const e=document.getElementsByClassName("esri-view-root");if(e.length>0)return e[0].appendChild(t),t}removeDom(){this.tipsDom&&(this.tipsDom.remove(),this.tipsDom=null)}sketchCreate(t,e){this.sketchViewModel.create(t,e)}sketchCancel(){this.sketchViewModel.cancel()}getCalculateDistance(t="meters"){const e=[];return this.graphicsLayer.graphics.map(i=>{i.geometry.type==="polyline"&&e.push(this.calculateDistance(i.geometry,t))}),e}getCalculateHeading(t="north"){const e=[];return this.graphicsLayer.graphics.map(i=>{i.geometry.type==="polyline"&&e.push(this.calculateHeading(i.geometry,t))}),e}getAllPolylineGraphicPath(t="meters"){const e=[];return this.graphicsLayer.graphics.map(i=>{i.geometry.type==="polyline"&&e.push({paths:p.webMercatorToGeographic(i.geometry).paths[0],distance:this.calculateDistance(i.geometry,t)})}),e}close(){this.sketch.visible=!1}show(){this.sketch.visible=!0}removeAll(){this.graphicsLayer.removeAll(),this.TextgraphicsLayer.removeAll(),this.drawPointGraphic.clear()}calculateDistance(t,e="meters"){return w.geodesicLength(t,e)}calculateHeading(t,e="north"){const s=p.webMercatorToGeographic(t).paths[0];return this.calculatePointHeading(s,e)}calculatePointHeading(t,e="north"){const i={longitude:t[0][0],latitude:t[0][1]},s={longitude:t[t.length-1][0],latitude:t[t.length-1][1]},r=i.longitude,o=i.latitude,n=s.longitude,a=s.latitude,h=n-r,g=Math.sin(h)*Math.cos(a),P=Math.cos(o)*Math.sin(a)-Math.sin(o)*Math.cos(a)*Math.cos(h);let l=(Math.atan2(g,P)*(180/Math.PI)+360)%360;return e==="east"?l=(l+90)%360:e==="south"?l=(l+180)%360:e==="west"&&(l=(l+270)%360),l}drawPolylinePoint(t,e,i="add"){const s=t==null?void 0:t.paths[0],r=[];for(let o=0;o<s.length-1;o++){const n=s[o];r.push([...n]);const a={x:n[0],y:n[1]};if(o==0){i=="update"&&this.addOrUpdateMarkPoint("起点",a,`${e}-start`);continue}const h=`${e}-${o+1}`,g=this.getPointLength(r,"meters");this.addOrUpdateMarkPoint(`${g.toFixed(2)}米`,a,h)}if(i=="update"&&s.length>1){const o=this.getGeometryXY(t,s.length-1);r.push([o.x,o.y]);const n=this.getPointLength(r,"meters");this.addOrUpdateMarkPoint(`总长度：${n.toFixed(2)}米`,o,`${e}-end`)}}updatePpolylinePoint(t){for(let e=0;e<t.length;e++){console.log(t[e]);const i=t[e].getAttribute("id"),s=p.webMercatorToGeographic(t[e].geometry);this.drawPolylinePoint(s,i,"update")}}delPpolylinePoint(t){var e;for(let i=0;i<t.length;i++){const s=t[i].getAttribute("id"),r=`${s}-start`,o=`${s}-end`,n=[r,o];(e=t[i].geometry)==null||e.paths[0].map((a,h)=>{n.push(`${s}-${h+1}`)}),n.map(a=>{const h=this.drawPointGraphic.get(a);h&&(this.TextgraphicsLayer.remove(h),this.drawPointGraphic.delete(a))})}}addOrUpdateMarkPoint(t,e,i,s={}){if(this.drawPointGraphic.has(i)){const o=this.drawPointGraphic.get(i);this.TextgraphicsLayer.remove(o);const n=this.createTextGraphic(t,e,{...s,id:i});this.drawPointGraphic.set(i,n),this.TextgraphicsLayer.add(n);return}const r=this.createTextGraphic(t,e,{...s,id:i});this.drawPointGraphic.set(i,r),this.TextgraphicsLayer.add(r)}getGeometryXY(t,e=0){const i=t==null?void 0:t.paths[0];return{x:i[e][0],y:i[e][1]}}createTextGraphic(t,e,i={}){return new m({geometry:{type:"point",x:e.x,y:e.y},symbol:{type:"text",text:t,color:"white",haloColor:"black",haloSize:"1px",xoffset:3,yoffset:3},attributes:{...i}})}getDrawgraphicLength(){return this.drawStartGraphic?this.calculateDistance(this.drawStartGraphic,"meters").toFixed(2):0}getAngle(t,e){const i=e.x-t.x,s=e.y-t.y;return Math.atan2(s,i)*180/Math.PI}getbearing(t,e){return c.bearing(c.point([t.x,t.y]),c.point([e.x,e.y]))}getPointLength(t,e="meters"){const i=new f({paths:[t]});return w.geodesicLength(i,e)}featureCollection(t){const e=c.featureCollection(t.map(s=>c.point([s.x,s.y])));return c.center(e)}midpoint(t,e){return c.midpoint(c.point([t.x,t.y]),c.point([e.x,e.y]))}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(t){return this.viewer.map.findLayerById(t)}turnonlayerSnap(){this.sketchViewModel.snappingOptions.enabled=!0}turnofflayerSnap(){this.sketchViewModel.snappingOptions.enabled=!1}setDimensionType(t){this.dimensionType=t}remove(t){this.graphicsLayer.remove(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()}}exports.default=S;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const P=require("@arcgis/core/geometry/geometryEngine.js"),u=require("@arcgis/core/geometry/Polyline.js"),M=require("@arcgis/core/geometry/support/webMercatorUtils.js"),m=require("@arcgis/core/Graphic.js"),f=require("@arcgis/core/layers/GraphicsLayer"),b=require("@arcgis/core/widgets/Sketch"),L=require("@arcgis/core/widgets/Sketch/SketchViewModel"),D=require("@turf/turf");function g(d){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const e in d)if(e!=="default"){const i=Object.getOwnPropertyDescriptor(d,e);Object.defineProperty(t,e,i.get?i:{enumerable:!0,get:()=>d[e]})}}return t.default=d,Object.freeze(t)}const w=g(P),p=g(M),h=g(D),k={maxAllowedGraphics:0,GraphicsLayer:{},sketchVisibleElements:{},sketchPosition:"top-left",defaultSketchVisible:!0,sketchViewModelItemSymbol:{}},G={type:"simple-line",color:"#556DEA",width:2},S={type:"simple-fill",color:[227,139,79,.4],outline:{color:[255,255,255],width:1}};class T{constructor(t,e){this.isDraw=!1,this.drawStartGraphicId=null,this.drawPointGraphic=new Map,this.dimensionType=null,this.viewer=t,this.options={...k,...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({layer:this.graphicsLayer,view:this.viewer,updateOnGraphicClick:!0,polylineSymbol:G,polygonSymbol:S,...this.options.sketchViewModelItemSymbol});const t=this.findLayerById("TrafficToolMarkings"),e=[];t&&e.push({layer:t,enabled:!0}),this.sketch=new b({view:this.viewer,viewModel:this.sketchViewModel,layer:this.graphicsLayer,visible:this.options.defaultSketchVisible,snappingOptions:{enabled:!0,featureSources:e}}),this.sketch.visibleElements={...this.options.sketchVisibleElements},this.viewer.ui.add(this.sketch,this.options.sketchPosition);const i=this;this.viewer.on("pointer-move",function(s){const r={x:s.x,y:s.y};if(i.isDraw&&i.dimensionType=="distance"){i.tipsDom||(i.tipsDom=i.createDom());const o=i.getDrawGraphicLength();i.tipsDom.innerText=`${o}米`,i.tipsDom.style.left=`${r.x}px`,i.tipsDom.style.top=`${r.y+3}px`,i.tipsDom.style.pointerEvents="none"}})}on(t){const e=this;this.sketch.on("create",function(i){e.onCreate(i,t)}),this.sketch.on("update",function(i){e.onUpdate(i,t)}),this.sketch.on("delete",function(i){e.onDelete(i,t)}),this.sketch.on("redo",function(i){console.log("redo",i),t&&t("redo","complete",i)}),this.sketch.on("undo",function(i){console.log("undo",i),t&&t("undo","complete",i)})}onCreate(t,e){if(console.log("create",t),this.drawStartGraphicId||(this.drawStartGraphicId=new Date().getTime().toString()),t.graphic.getAttribute("id")||(t.graphic.setAttribute("type","draw"),t.graphic.setAttribute("id",this.drawStartGraphicId)),t.state==="start"&&t.graphic.geometry.type==="polyline"&&(this.isDraw=!0,this.drawStartGraphic=p.webMercatorToGeographic(t.graphic.geometry),this.dimensionType=="distance")){const i=this.getGeometryXY(this.drawStartGraphic,0),s=`${this.drawStartGraphicId}-start`;this.addOrUpdateMarkPoint("起点",i,s)}if(t.state==="active"&&t.graphic.geometry.type==="polyline"){const i=p.webMercatorToGeographic(t.graphic.geometry),s=this.drawStartGraphicId;this.dimensionType=="distance"&&(this.drawPolylinePoint(i,s),this.drawStartGraphic=i)}if(t.state==="complete"&&t.graphic.geometry.type==="polyline"&&this.dimensionType=="distance"){const i=this.getDrawGraphicLength(),s=`${this.drawStartGraphicId}-end`,r=p.webMercatorToGeographic(t.graphic.geometry),o=r.paths[0],n=this.getGeometryXY(r,o.length-1);this.addOrUpdateMarkPoint(`总长度：${i}米`,n,s),this.drawStartGraphic=null,this.removeDom(),this.isDraw=!1,this.drawStartGraphicId=null}t.state==="cancel"&&t.graphic.geometry.type==="polyline"&&this.onCreateToCancel(),e&&e("create",t.state,t.graphic)}onCreateToCancel(){this.removeDom(),this.isDraw=!1,this.drawStartGraphic=null;const t=this.drawStartGraphicId;this.drawPointGraphic.forEach((e,i)=>{new RegExp(`^${t}-`).test(i)&&(this.textGraphicsLayer.remove(e),this.drawPointGraphic.delete(i))}),this.drawStartGraphicId=null}onUpdate(t,e){console.log("update",t),this.updatePolylinePoint(t.graphics.filter(i=>i.geometry.type==="polyline")),e&&e("update",t.state,t.graphics)}onDelete(t,e){console.log("delete",t),this.deletePolylinePoint(t.graphics.filter(i=>i.geometry.type==="polyline")),e&&e("delete","complete",t.graphics)}addPolyline(t){const e=[],i={type:"draw",id:new Date().getTime().toString()};t.map(s=>{e.push(this.createPolylineGraphic(s,G,{...i}))}),this.graphicsLayer.addMany(e)}createPolylineGraphic(t,e,i){const s=new u({paths:[t]}),r=p.geographicToWebMercator(s);return new m({geometry:r,symbol:e,attributes:i})}createDom(){const t=document.createElement("div");t.style.position="absolute",t.style.top="0px",t.style.left="0px",t.style.width="100px",t.style.height="80px",t.style.zIndex="999",t.style.display="flex",t.style.justifyContent="center",t.style.alignItems="center",t.style.color="#fff",t.style.fontSize="20px",t.style.fontWeight="bold",t.innerText="";const e=document.getElementsByClassName("esri-view-root");if(e.length>0)return e[0].appendChild(t),t}removeDom(){this.tipsDom&&(this.tipsDom.remove(),this.tipsDom=null)}sketchCreate(t,e){this.sketchViewModel.create(t,e)}sketchCancel(){this.sketchViewModel.cancel()}getCalculateDistance(t="meters"){const e=[];return this.graphicsLayer.graphics.map(i=>{i.geometry.type==="polyline"&&e.push(this.calculateDistance(i.geometry,t))}),e}getCalculateHeading(t="north"){const e=[];return this.graphicsLayer.graphics.map(i=>{i.geometry.type==="polyline"&&e.push(this.calculateHeading(i.geometry,t))}),e}getAllPolylineGraphicPath(t="meters"){const e=[];return this.graphicsLayer.graphics.map(i=>{i.geometry.type==="polyline"&&e.push({paths:p.webMercatorToGeographic(i.geometry).paths[0],distance:this.calculateDistance(i.geometry,t)})}),e}close(){this.sketch.visible=!1}show(){this.sketch.visible=!0}removeAll(){this.graphicsLayer.removeAll(),this.textGraphicsLayer.removeAll(),this.drawPointGraphic.clear()}calculateDistance(t,e="meters"){return w.geodesicLength(t,e)}calculateHeading(t,e="north"){const s=p.webMercatorToGeographic(t).paths[0];return this.calculatePointHeading(s,e)}calculatePointHeading(t,e="north"){const i={longitude:t[0][0],latitude:t[0][1]},s={longitude:t[t.length-1][0],latitude:t[t.length-1][1]},r=i.longitude,o=i.latitude,n=s.longitude,a=s.latitude,c=n-r,y=Math.sin(c)*Math.cos(a),x=Math.cos(o)*Math.sin(a)-Math.sin(o)*Math.cos(a)*Math.cos(c);let l=(Math.atan2(y,x)*(180/Math.PI)+360)%360;return e==="east"?l=(l+90)%360:e==="south"?l=(l+180)%360:e==="west"&&(l=(l+270)%360),l}drawPolylinePoint(t,e,i="add"){const s=t==null?void 0:t.paths[0],r=[];for(let o=0;o<s.length-1;o++){const n=s[o];r.push([...n]);const a={x:n[0],y:n[1]};if(o==0){i=="update"&&this.addOrUpdateMarkPoint("起点",a,`${e}-start`);continue}const c=`${e}-${o+1}`,y=this.getPointLength(r,"meters");this.addOrUpdateMarkPoint(`${y.toFixed(2)}米`,a,c)}if(i=="update"&&s.length>1){const o=this.getGeometryXY(t,s.length-1);r.push([o.x,o.y]);const n=this.getPointLength(r,"meters");this.addOrUpdateMarkPoint(`总长度：${n.toFixed(2)}米`,o,`${e}-end`)}}updatePolylinePoint(t){for(let e=0;e<t.length;e++){console.log(t[e]);const i=t[e].getAttribute("id"),s=p.webMercatorToGeographic(t[e].geometry);this.drawPolylinePoint(s,i,"update")}}deletePolylinePoint(t){var e;for(let i=0;i<t.length;i++){const s=t[i].getAttribute("id"),r=`${s}-start`,o=`${s}-end`,n=[r,o];(e=t[i].geometry)==null||e.paths[0].map((a,c)=>{n.push(`${s}-${c+1}`)}),n.map(a=>{const c=this.drawPointGraphic.get(a);c&&(this.textGraphicsLayer.remove(c),this.drawPointGraphic.delete(a))})}}addOrUpdateMarkPoint(t,e,i,s={}){if(this.drawPointGraphic.has(i)){const o=this.drawPointGraphic.get(i);this.textGraphicsLayer.remove(o);const n=this.createTextGraphic(t,e,{...s,id:i});this.drawPointGraphic.set(i,n),this.textGraphicsLayer.add(n);return}const r=this.createTextGraphic(t,e,{...s,id:i});this.drawPointGraphic.set(i,r),this.textGraphicsLayer.add(r)}getGeometryXY(t,e=0){const i=t==null?void 0:t.paths[0];return{x:i[e][0],y:i[e][1]}}createTextGraphic(t,e,i={}){return new m({geometry:{type:"point",x:e.x,y:e.y},symbol:{type:"text",text:t,color:"white",haloColor:"black",haloSize:"1px",xoffset:3,yoffset:3},attributes:{...i}})}getDrawGraphicLength(){return this.drawStartGraphic?this.calculateDistance(this.drawStartGraphic,"meters").toFixed(2):0}getAngle(t,e){const i=e.x-t.x,s=e.y-t.y;return Math.atan2(s,i)*180/Math.PI}getBearing(t,e){return h.bearing(h.point([t.x,t.y]),h.point([e.x,e.y]))}getPointLength(t,e="meters"){const i=new u({paths:[t]});return w.geodesicLength(i,e)}featureCollection(t){const e=h.featureCollection(t.map(s=>h.point([s.x,s.y])));return h.center(e)}midpoint(t,e){return h.midpoint(h.point([t.x,t.y]),h.point([e.x,e.y]))}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(t){return this.viewer.map.findLayerById(t)}turnOnLayerSnap(){this.sketchViewModel.snappingOptions.enabled=!0}turnOffLayerSnap(){this.sketchViewModel.snappingOptions.enabled=!1}setDimensionType(t){this.dimensionType=t}remove(t){this.graphicsLayer.remove(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()}}exports.default=T;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gisviewer-vue3-arcgis",
-  "version": "1.0.142",
+  "version": "1.0.144",
   "main": "lib/index.js",
   "module": "es/index.mjs",
   "files": [

package/es/_virtual/_plugin-vue_export-helper.mjs

@@ -1,9 +0,0 @@
-const s = (t, e) => {
-  const o = t.__vccOpts || t;
-  for (const [r, c] of e)
-    o[r] = c;
-  return o;
-};
-export {
-  s as default
-};

package/es/src/gis-map/utils/components/sketch-tool.vue.d.ts

@@ -1,18 +0,0 @@
-import SketchViewModel from '@arcgis/core/widgets/Sketch/SketchViewModel';
-declare const _sfc_main: import("vue").DefineComponent<{
-    view: {
-        type: null;
-        required: true;
-    };
-}, {
-    props: any;
-    sketchVM: SketchViewModel;
-    resetButtonHandler: () => void;
-    geometrySelectionHandler: (event: any) => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    view: {
-        type: null;
-        required: true;
-    };
-}>>, {}, {}>;
-export default _sfc_main;

package/es/src/gis-map/utils/components/sketch-tool.vue.mjs

@@ -1,7 +0,0 @@
-import o from "./sketch-tool.vue2.mjs";
-import "./sketch-tool.vue3.mjs";
-import t from "../../../../_virtual/_plugin-vue_export-helper.mjs";
-const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-ac0f5d06"]]);
-export {
-  f as default
-};

package/es/src/gis-map/utils/components/sketch-tool.vue2.mjs

@@ -1,48 +0,0 @@
-import { defineComponent as a, onMounted as m, onUnmounted as p, openBlock as u, createElementBlock as d, createElementVNode as n } from "vue";
-import g from "@arcgis/core/layers/GraphicsLayer";
-import k from "@arcgis/core/widgets/Sketch/SketchViewModel";
-const y = { class: "gisviewer-sketch-tool gisviewer-sketch-tool-position" }, _ = /* @__PURE__ */ a({
-  __name: "sketch-tool",
-  props: {
-    view: {}
-  },
-  setup(l) {
-    const c = l;
-    let o;
-    m(() => {
-      const e = new g();
-      c.view.map.add(e), o = new k({
-        layer: e,
-        view: c.view
-      });
-    }), p(() => {
-      o.destroy();
-    });
-    const i = () => {
-    }, s = (e) => {
-      var r;
-      console.log(e);
-      const t = (r = e.target) == null ? void 0 : r.value;
-      console.log(t), o.create(t);
-    };
-    return (e, t) => (u(), d("div", y, [
-      n("button", {
-        class: "esri-icon-pan geometry-button",
-        onClick: i
-      }),
-      n("button", {
-        class: "esri-icon-checkbox-unchecked geometry-button",
-        value: "rectangle",
-        onClick: s
-      }),
-      n("button", {
-        class: "esri-icon-polygon geometry-button",
-        value: "polygon",
-        onClick: s
-      })
-    ]));
-  }
-});
-export {
-  _ as default
-};

package/es/src/gis-map/utils/components/sketch-tool.vue3.mjs

@@ -1,4 +0,0 @@
-const e = "";
-export {
-  e as default
-};

package/lib/_virtual/_plugin-vue_export-helper.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=(e,o)=>{const t=e.__vccOpts||e;for(const[r,s]of o)t[r]=s;return t};exports.default=u;

package/lib/src/gis-map/utils/components/sketch-tool.vue.d.ts

@@ -1,18 +0,0 @@
-import SketchViewModel from '@arcgis/core/widgets/Sketch/SketchViewModel';
-declare const _sfc_main: import("vue").DefineComponent<{
-    view: {
-        type: null;
-        required: true;
-    };
-}, {
-    props: any;
-    sketchVM: SketchViewModel;
-    resetButtonHandler: () => void;
-    geometrySelectionHandler: (event: any) => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    view: {
-        type: null;
-        required: true;
-    };
-}>>, {}, {}>;
-export default _sfc_main;

package/lib/src/gis-map/utils/components/sketch-tool.vue.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./sketch-tool.vue2.js");require("./sketch-tool.vue3.js");const t=require("../../../../_virtual/_plugin-vue_export-helper.js"),u=t.default(e.default,[["__scopeId","data-v-ac0f5d06"]]);exports.default=u;

package/lib/src/gis-map/utils/components/sketch-tool.vue2.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),a=require("@arcgis/core/layers/GraphicsLayer"),u=require("@arcgis/core/widgets/Sketch/SketchViewModel"),d={class:"gisviewer-sketch-tool gisviewer-sketch-tool-position"},g=e.defineComponent({__name:"sketch-tool",props:{view:{}},setup(l){const c=l;let t;e.onMounted(()=>{const o=new a;c.view.map.add(o),t=new u({layer:o,view:c.view})}),e.onUnmounted(()=>{t.destroy()});const i=()=>{},s=o=>{var r;console.log(o);const n=(r=o.target)==null?void 0:r.value;console.log(n),t.create(n)};return(o,n)=>(e.openBlock(),e.createElementBlock("div",d,[e.createElementVNode("button",{class:"esri-icon-pan geometry-button",onClick:i}),e.createElementVNode("button",{class:"esri-icon-checkbox-unchecked geometry-button",value:"rectangle",onClick:s}),e.createElementVNode("button",{class:"esri-icon-polygon geometry-button",value:"polygon",onClick:s})]))}});exports.default=g;

package/lib/src/gis-map/utils/components/sketch-tool.vue3.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="";exports.default=e;