@ino-cesium/draw 0.0.10 → 0.0.12

package/README.MD

@@ -1,39 +1,3 @@
 # ino-cesium  绘制
 
-绘制
 
-
-## 使用
-``` ts
-
-  // 创建绘制工具
-  const drawHadler = createDrawHandler(viewer)
-
-  // 绘制
-  drawHadler.draw({
-    // "polyline" | "polygon" | "point" | "circle" | "rectangle" | "vertical-line" | "vertical-surface-line"
-    shape: "polyline",
-    edit: isEdit.value,
-    clampToGround: clampToGround.value,
-  })
-
-   // 删除绘制
-  drawHadler.remov(drawData)
-
-  // 删除所有绘制
-  drawHadler.removeAll()
-
-  // 绘制监听
-  drawHadler.Event.drawEnd = (drawData) => {
-    console.log('drawEnd', drawData)
-  }
-
-  drawHadler.Event.drawEditEnd = (drawData) => {
-    console.log('drawEditEnd', drawData)
-  }
-
-  drawHadler.Event.drawRemove = (drawData) => {
-    console.log('drawRemove', drawData)
-  }
-
-```

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as Cesium from 'cesium';
-import { Cartesian3, PointPrimitiveCollection, PrimitiveCollection, Primitive, Cartesian2, HeightReference, PointPrimitive, Viewer } from 'cesium';
+import { Cartesian3, PointPrimitiveCollection, PrimitiveCollection, Primitive, Cartesian2, PointPrimitive, Viewer } from 'cesium';
 import { BasePrimitive, Common } from '@ino-cesium/common';
 
 declare class MeasurePrimitive extends BasePrimitive<any> {
@@ -8,7 +8,6 @@ declare class MeasurePrimitive extends BasePrimitive<any> {
     private measureDivs;
     private cesiumWidget;
     private viewer;
-    private labelOptions;
     constructor(drawData: IDrawAttrInfo, viewer: Cesium.Viewer);
     getPrimitive(): Cesium.LabelCollection | undefined;
     updateUnit(unit: string[]): void;
@@ -385,51 +384,6 @@ interface IDrawStyle {
          */
         depthFailColor: string;
     };
-    /**
-     * 标签样式
-     */
-    label: {
-        /**
-         * 标签字体
-         */
-        font: string;
-        /**
-         * 标签填充颜色
-         */
-        fillColor: string;
-        /**
-         * 标签轮廓颜色
-         */
-        outlineColor: string;
-        /**
-         * 标签背景颜色
-         */
-        backgroundColor: string;
-        /**
-         * 标签轮廓宽度
-         */
-        outlineWidth: number;
-        /**
-         * 标签像素偏移
-         */
-        pixelOffset: number[];
-        /**
-         * 标签背景填充
-         */
-        backgroundPadding: number[];
-        /**
-         * 标签缩放比例
-         */
-        scale: number;
-        /**
-         * 是否显示背景
-         */
-        showBackground: boolean;
-        /**
-         * 高度参考
-         */
-        heightReference: HeightReference;
-    };
 }
 
 type types_DrawEvent = DrawEvent;

package/dist/index.js

@@ -1 +1 @@
-import*as i from"cesium";import{HeightReference as e,ScreenSpaceEventHandler as t,ScreenSpaceEventType as o,Cartesian3 as n,PrimitiveCollection as s,Color as r,PointPrimitiveCollection as a,PointPrimitive as l}from"cesium";import{calcArea as d,calcPoistionCenter as p,calcGeodesicDistance as c,calcSpaceDistance as h,BasePrimitive as m,makePositiontoLnglat as u,Tooltip as g,numberId as A}from"@ino-cesium/common";var w=(i=>(i.DRAW_ADD="drawAdd",i.DRAW_MOVE="drawMove",i.DRAW_PICK="drawPick",i.DRAW_DB_CLICK="drawDbClick",i.DRAW_RIGHT_CLICK="drawRightClick",i))(w||{}),v=Object.freeze({__proto__:null,DrawEventType:w});const C="cm",E="厘米",y="m",D="米",f="km",P="千米",b="公里",I="㎡",R="平方厘米",T="㎡",F="平方米",U="km²",x="平方千米",M="平方公里",k="亩",_="公顷",S={cm:"cm²",m:"㎡",km:"km²","米":"平方米","千米":"平方千米","公里":"平方公里"},G=(i,e,t)=>e===t?i:i*B(t),N=(i,e,t)=>e===t?i:i*function(i){switch(i){case I:return 1e4;case T:return 1;case U:return 1e-6;case R:return 1e4;case F:return 1;case x:case M:return 1e-6;case k:return.0015;case _:return 1e-4;default:return 1}}(t),O=i=>S[i],B=i=>{switch(i){case y:return 1;case C:case E:return 100;case f:return.001;case D:return 1;case P:case b:return.001;default:return 1}};const V=(i,e,t,o,n)=>{t.push(...i.map(((t,n)=>{const s=i[n+1];if(s){let i=e?c(t,s):h(t,s);return i=G(i,"m",o),{value:Number(i.toFixed(2)),unit:o,position:p([t,s]),positions:[t,s]}}return null})).filter((i=>i&&i.value>0)))},L=i=>{if(2===i.length)return i;let[e,t]=i;return t||(t=O(e)),[e,t]},K={drawStart:{circle:"单击左键绘制圆的中心点，单机右键取消绘制。",rectangle:"单击左键绘制矩形左上角。",point:"单击左键结束绘制，单机右键取消绘制。","vertical-surface-line":"单击左键结束绘制，单机右键取消绘制。",default:"单击左键绘制第一个节点，单机右键取消绘制。"},drawMove:{circle:"单击左键确定圆的半径并结束绘制，单机右键取消绘制。",rectangle:"单击左键结束绘制，单机右键取消绘制。","vertical-line":"单击左键结束绘制，单机右键取消绘制。","vertical-surface-line":"单击左键结束绘制，单机右键取消绘制。",default:"单机左键绘制下一个节点，双击左键结束绘制，单机右键撤销上次绘制。"},pointEnter:"双击左键编辑节点。",drawEditMove:{default:"移动鼠标修改节点，单击左键确定修改，单机右键取消修改。"}},H={point:{color:"rgba(255,255,0,0.8)",pixelSize:8,outlineColor:"rgba(255,255,255,0.8)",outlineWidth:2,disableDepthTestDistance:Number.POSITIVE_INFINITY},polyline:{width:2,color:"rgba(81,255,0,0.8)",depthFailColor:"rgba(255,0,0,0.5)"},polygon:{color:"rgba(255,255,54,0.3)",depthFailColor:"rgba(255,0,0,0.3)"},label:{fillColor:"rgba(255,255,255,0.8)",outlineColor:"rgba(0,0,0,0.5)",backgroundColor:"rgba(0,0,0,0.5)",showBackground:!0,pixelOffset:[0,-15],backgroundPadding:[5,5],scale:.7,heightReference:e.CLAMP_TO_3D_TILE}};class Q extends m{positions;drawData;appearanceTran;depthFailAppearance;linePrimitiveCollection;constructor(e){super(),this.drawData=e,this.positions=e.positions,this.linePrimitiveCollection=new i.PrimitiveCollection,this.setAppearance()}getGeometry(){const e=((e,t)=>{let o=e;if("vertical-surface-line"===t&&e.length>=1){const t=e[0],n=i.Cartographic.fromCartesian(t),s=i.Math.toDegrees(n.longitude),r=i.Math.toDegrees(n.latitude),a=0;o=[i.Cartesian3.fromDegrees(s,r,n.height),i.Cartesian3.fromDegrees(s,r,a)]}if("polygon"===t&&e.length>=2&&(o=[...e,e[0]]),"vertical-line"===t&&e.length>=2){const t=e[0],n=e[1],s=i.Cartographic.fromCartesian(t),r=i.Cartographic.fromCartesian(n).height,a=i.Math.toDegrees(s.longitude),l=i.Math.toDegrees(s.latitude);o=[i.Cartesian3.fromDegrees(a,l,s.height),i.Cartesian3.fromDegrees(a,l,r)]}if("circle"===t&&e.length>=2){const t=h(e[0],e[1]),n=i.Cartographic.fromCartesian(e[0]).height,s=new i.CircleOutlineGeometry({center:e[0],height:n,radius:t}),r=i.CircleOutlineGeometry.createGeometry(s);let a=[];if(r){const e=[].slice.call(r.attributes.position.values);a=i.Cartesian3.unpackArray(e),a.push(a[0]),o=a}}if("rectangle"===t&&e.length>=2){const t=i.Cartographic.fromCartesian(e[0]).height,n=i.Rectangle.fromCartesianArray(e),s=new i.RectangleOutlineGeometry({rectangle:n,height:t}),r=i.RectangleOutlineGeometry.createGeometry(s);let a=[];if(r){const e=[].slice.call(r.attributes.position.values);a=i.Cartesian3.unpackArray(e),a.push(a[0]),o=a}}return o})(this.positions,this.drawData.shape);if(this.drawData.shapePositions=e,"vertical-line"===this.drawData.shape||"vertical-surface-line"===this.drawData.shape){const i=this.drawData.pointPrimitives.get(1);i&&(i.position=this.drawData.shapePositions[1])}if(!(e.length<2))return this.drawData.clampToGround?new i.GroundPolylineGeometry({positions:e,width:H.polyline.width}):new i.PolylineGeometry({positions:e,width:H.polyline.width})}getPrimitive(){if(!this.drawData.isEditing)return this._primitive;const e=this.getGeometry();if(!e)return;const t=new i.GeometryInstance({geometry:e,id:this.drawData.id});return e?this.drawData.clampToGround?new i.GroundPolylinePrimitive({geometryInstances:t,appearance:this.appearance,asynchronous:!1}):(this.linePrimitiveCollection.removeAll(),this.linePrimitiveCollection.add(new i.Primitive({geometryInstances:t,appearance:this.appearance,asynchronous:!1})),this.linePrimitiveCollection.add(new i.Primitive({geometryInstances:t,appearance:this.appearanceTran,depthFailAppearance:this.drawData.disDepthFail?void 0:this.depthFailAppearance,asynchronous:!1})),this.linePrimitiveCollection):void 0}setAppearance(e){e?this.appearance=e:(this.appearance=new i.PolylineMaterialAppearance({material:new i.Material({fabric:{type:"Color",uniforms:{color:i.Color.fromCssColorString(H.polyline.color)}}})}),this.appearanceTran=new i.MaterialAppearance({material:new i.Material({fabric:{type:"Color",uniforms:{color:new i.Color(0,0,0,0)}}})}),this.depthFailAppearance=new i.PolylineMaterialAppearance({material:i.Material.fromType(i.Material.PolylineDashType,{color:i.Color.fromCssColorString(H.polyline.depthFailColor)})}))}}class j extends m{positions;drawData;depthFailAppearance;constructor(i){super(),this.drawData=i,this.positions=i.positions,this.setAppearance()}getPrimitive(){if(!this.drawData.isEditing)return this._primitive;if(this.positions.length<3)return;const e=JSON.parse(JSON.stringify(this.positions)),t=[new i.GeometryInstance({geometry:new i.PolygonGeometry({polygonHierarchy:new i.PolygonHierarchy(e),perPositionHeight:!0}),id:`${this.drawData.id}-polygon`})];return this.drawData.clampToGround?new i.GroundPrimitive({geometryInstances:t,appearance:this.appearance,asynchronous:!1}):new i.Primitive({geometryInstances:t,appearance:this.appearance,depthFailAppearance:this.drawData.disDepthFail?void 0:this.depthFailAppearance,asynchronous:!1})}setAppearance(){this.appearance=new i.MaterialAppearance({material:i.Material.fromType("Color",{color:i.Color.fromCssColorString(H.polygon.color)})}),this.depthFailAppearance=new i.MaterialAppearance({material:i.Material.fromType("Color",{color:i.Color.fromCssColorString(H.polygon.depthFailColor)})})}}class W extends m{positions;drawData;depthFailAppearance;primitiveCollection;constructor(e){super(),this.drawData=e,this.positions=e.positions,this.primitiveCollection=new i.PrimitiveCollection,this.setAppearance()}getPrimitive(){if(!this.drawData.isEditing)return this._primitive;if(this.positions.length<2)return;this.primitiveCollection.removeAll();const e=JSON.parse(JSON.stringify(this.positions)),t=this.drawData.clampToGround?c(e[0],e[1]):h(e[0],e[1]);if(!t)return;const o=i.Cartographic.fromCartesian(e[0]).height,n=[new i.GeometryInstance({geometry:new i.CircleGeometry({center:e[0],height:o,radius:t}),id:`${this.drawData.id}`})];return this.drawData.clampToGround?this.primitiveCollection.add(new i.GroundPrimitive({geometryInstances:n,appearance:this.appearance,asynchronous:!1})):this.primitiveCollection.add(new i.Primitive({geometryInstances:n,appearance:this.appearance,depthFailAppearance:this.drawData.disDepthFail?void 0:this.depthFailAppearance,asynchronous:!1})),this.primitiveCollection}setAppearance(){this.appearance=new i.MaterialAppearance({material:i.Material.fromType("Color",{color:i.Color.fromCssColorString(H.polygon.color)})}),this.depthFailAppearance=new i.MaterialAppearance({material:i.Material.fromType("Color",{color:i.Color.fromCssColorString(H.polygon.depthFailColor)})})}}class J extends m{positions;drawData;depthFailAppearance;primitiveCollection;constructor(e){super(),this.drawData=e,this.positions=e.positions,this.primitiveCollection=new i.PrimitiveCollection,this.setAppearance()}getPrimitive(){if(!this.drawData.isEditing)return this._primitive;if(this.positions.length<2)return this.primitiveCollection;this.primitiveCollection.removeAll();const e=JSON.parse(JSON.stringify(this.positions));e.length=2;const t=i.Cartographic.fromCartesian(e[0]).height,o=i.Rectangle.fromCartesianArray(e),n=[new i.GeometryInstance({geometry:new i.RectangleGeometry({rectangle:o,height:t}),id:`${this.drawData.id}`})];return this.drawData.clampToGround?this.primitiveCollection.add(new i.GroundPrimitive({geometryInstances:n,appearance:this.appearance,asynchronous:!1})):this.primitiveCollection.add(new i.Primitive({geometryInstances:n,appearance:this.appearance,depthFailAppearance:this.drawData.disDepthFail?void 0:this.depthFailAppearance,asynchronous:!1})),this.primitiveCollection}setAppearance(){this.appearance=new i.MaterialAppearance({material:i.Material.fromType("Color",{color:i.Color.fromCssColorString(H.polygon.color)})}),this.depthFailAppearance=new i.MaterialAppearance({material:i.Material.fromType("Color",{color:i.Color.fromCssColorString(H.polygon.depthFailColor)})})}}class z extends m{drawData;labelCollection;measureDivs;cesiumWidget;viewer;labelOptions;constructor(e,t){super(),this.viewer=t,this.cesiumWidget=t._element.getElementsByClassName("cesium-widget")[0],this.drawData=e,this.labelCollection=new i.LabelCollection({scene:t.scene}),this.drawData.measureLabel&&this.setAppearance(),this.measureDivs=[],this.renderDivPosition()}getPrimitive(){return this.drawData.isEditing&&this.drawData.measureLabel?"point"===this.drawData.shape?(this.updatePointDivLabel(),this.labelCollection):this.drawData.shapePositions.length>=2?(this.updateUnit(this.drawData.measureUnit),this.labelCollection):void 0:this.labelCollection}updateUnit(i){if("point"===this.drawData.shape)return;this.drawData.measureUnit=i,this.clearAllDiv();const e=(i=>{let{shapePositions:e,positions:t,shape:o,clampToGround:n,measureUnit:s}=i;e||(e=t),n||(n=!1);const[r,a]=L(s),l=O(r);i.measureUnit=[r,a];const m=[];if("polyline"===o&&(V(t,n,m,r),m.push({value:0,unit:r,position:t[0],positions:t,prefixText:"起点"}),m.push({value:Number(m.reduce(((i,e)=>i+e.value),0).toFixed(2)),unit:r,position:t[t.length-1],positions:t})),"vertical-line"!==o&&"vertical-surface-line"!==o||(V(e,n,m,r),m.length&&(m[0].position=e[0])),"polygon"===o){V(e,n,m,r);const i=N(d(e),l,a);m.push({value:Number(i.toFixed(2)),unit:a,position:p(e),positions:e})}if("rectangle"===o){V(e,n,m,r);const i=N(d(e),l,a);m.push({value:Number(i.toFixed(2)),unit:a,position:p(e),positions:e})}if("circle"===o){const i=n?c(t[0],t[1]):h(t[0],t[1]);m.push({value:Number(G(i,"m",r).toFixed(2)),unit:r,position:t[1],positions:t,prefixText:"半径"});const e=N(i*i*Math.PI,r,a);i>0&&m.push({value:Number(e.toFixed(2)),unit:a,position:t[0],positions:t})}return m})(this.drawData);this.drawData.measureResult=e,e.forEach(((i,e)=>{let t="";i.prefixText?(t=`${i.prefixText}`,i.value&&(t+=`:${i.value}${i.unit}`)):t+=`${i.value}${i.unit}`;const o=this.createDiv(`measure-label-${this.drawData.id}-${e}`,t);this.measureDivs.push({position:i.position,divEle:o})}))}updatePointDivLabel(){this.clearAllDiv(),this.drawData.positions.forEach((i=>{const e=u(i),t=this.createDiv(`measure-label-${this.drawData.id}-0`,`经度：${e.longitude.toFixed(6)}\n纬度：${e.latitude.toFixed(6)}\n高度：${e.height.toFixed(6)}`);this.measureDivs.push({position:i,divEle:t})}))}renderDivPosition(){this.viewer.scene.postRender.addEventListener((()=>{this.measureDivs.forEach((i=>{const e=this.viewer.scene.cartesianToCanvasCoordinates(i.position);if(e){i.divEle.style.display="block";const t=i.divEle.getBoundingClientRect();i.divEle.style.left=e.x-t.width/2+"px",i.divEle.style.top=e.y-t.height+"px"}else i.divEle.style.display="none"}))}))}destroy(){super.destroy(),this.clearAllDiv()}setAppearance(){this.labelOptions={position:new i.Cartesian3(0,0,0),font:"20px sans-serif",fillColor:i.Color.fromCssColorString(H.label.fillColor),outlineColor:i.Color.fromCssColorString(H.label.outlineColor),showBackground:H.label.showBackground,backgroundColor:i.Color.fromCssColorString(H.label.backgroundColor),outlineWidth:1,pixelOffset:i.Cartesian2.fromArray(H.label.pixelOffset),backgroundPadding:i.Cartesian2.fromArray(H.label.backgroundPadding),scale:H.label.scale,disableDepthTestDistance:Number.POSITIVE_INFINITY,horizontalOrigin:0,verticalOrigin:1,heightReference:H.label.heightReference}}clearAllDiv(){this.measureDivs.forEach((i=>{i.divEle.remove()})),this.measureDivs=[]}createDiv(i,e,t=48){const o=`\n        <div style="\n            background: rgba(0, 0, 0, 0.6);\n            color: white;\n            border-radius: 5px;\n            padding: 0 10px 0 10px;\n            font-size: 14px;\n            white-space: nowrap;\n            pointer-events: none;\n        ">\n            ${e.split("\n").map((i=>`\n        <div style="height: 24px; line-height: 24px">\n            ${i}\n        </div>\n        `)).join(" ")}\n        </div>\n        <div style="\n            height: ${t}px;\n            width: 2px;\n            background: rgba(0, 0, 0, 0.6);\n            margin: auto;\n        ">\n        </div>\n    `,n=document.createElement("div");return n.id=i,n.innerHTML=o,n.style.position="absolute",n.style.pointerEvents="none",n.className=`measure-label measure-label-${this.drawData.id}`,this.cesiumWidget.appendChild(n),n}}const Y="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAAQBJREFUWEft2MsNgkAQBuAZtABCBctBErvATryiRRibkKudGKvgwMFtQGIBumOAYAxCArsTs4fZ8w758032wSJ4PtDzfCABXTvEKhjmhXpka+0a6rueNWB0KgmAdLVLYq6QbAHDvEwDgksdzOAz5pKUgK6tFkERnCogq3iq1Ng8ERRBS4HBjTrKywMAqjnfJCKFAGlTg3ieU9vOJV1lq2O/bjhgcyv59yBt8LXpXzLYBFsE2toKojHX+z75kWc8iwsV0PLm8XVLArotivp/RFrsYiiCLnp1rQiKoKWAHHWWcJ8yZsFF8zbj5eNRt9VwPRp1hGyCrq0cq5eArrLeC74BlkT4KR3TrCoAAAAASUVORK5CYII=",X="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAAY9JREFUWEftmNFRwzAMhiVYAMoC5Y50jjAJ9LFliMIQNI/NJtA1CA9hAHIsgMWZYC5xHVtNajcHzqtl+ctvSZaNMPIPR84HEXDoDv1tBc/XxRMCpFaVEPNqcTXvq6RTwbOsSE8FTfUFBOKNE05NQsxRiK3u4/MEy49F8myDdwJOstcNEN32VWCouhHQu4JetnYPp84tVr4uHl8OGofvd7Ocw8kGnKwL4jjk2lTLhLU2y0guGgE7pI8KdsVkuBhEzDtPGstYEEAkmstyMcmKFRDcN9WyjUk774AKQEE1IW1jyt47IACV1XJ22VRNQqKgN70Im9qyAIASbRdST4qunjEQoB3S1tAGBATQY05iy7ObEDdHLzMmOFPi6KBBFLTBuSC9A5rg6pijqSm79TrpHRC021o7IdrZfbwy8wNpztYacgRlhtuitu38b3E/rt9Z/w+Q9czBVtV9RCpX7I7adTKw2QBAIFy7njz2Bvy+OGXFighS9pvMDjWVdXlKHrg/xFaQ6/DQdhFwqKJRwaEKfgEJRgs46ima/wAAAABJRU5ErkJggg==",Z="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAAMdJREFUWEdjZBjkgHGQu49h1IGUxtBoCI6GIKUhQKn+0TQ4GoKUhgCl+kfT4GgIUhoClOofTYM0DUGh6bfrGRgYFSi1BJ9+xn//Dr7NVluASw3eKBaadvs/LR0HM/sfI4Pjh0zVA9jswulAgenXFZj+s9ynjwP/KH7I1HxAkgNBioWn3kr4z8RkT1tH/n/wLlO1kawopq3DiDN9tJghLpxwqxoNwdEQpDQEKNU/mgZHQ5DSEKBU/2gaHA1BSkOAUv2jaXDYhyAAbjwcKU1UyjYAAAAASUVORK5CYII=",q="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAAkJJREFUWEftl19SwkAMxpPCARAvgDPijKewnER4BA8hHEJ5FE8CnsIZccZ6AJEDMF1Ny5Zu/6bNMvQBXmk3vyZfvmQRGv7DhvPBGVBaIasZ7M4/XwhoM74eScH0+9YAAzilhuHByttMbq5sQFoBNOE0lh1IMeDF83qJAG52tuSQIsBiODuZrA14+fQxVIhBUwSqA1hFmURcHPQIAIiLuo1TG5CguvP14z/Z1EcYtHzVi4ARpj7sXh3V/iLw30l/ULdhRIAUtDN/723Ht56RUYTpZtyf6f/qwtF7YkAdPAtQAmbdB08KSMF/Hm4WRRmpCkjeyWmc0hJHVlLSiaQ3gHYv/IidR7rM+6CDPZX7ZCFg0ueoW7fj/kqiLfoQ6u7DGcWQuYDHgNNQVSAzAZNwgQkjpDJHXldUSm1DDrTv01nHnmHmOQtGCpA3vsJwnJJ35mvXUbBkySJD5ylAPR04B54EMD7C4kJGBbMkdJn16BK3/FZq21GOc8eZ17lNYmZSeeHA76cgOZlOPpMse9G8zgUMOo3ErWC631c8H3Fk22bKlolCHzQgLRq1rk4ZHGtZIEjSUJneqo46zvhkAXI1VhWQe27pLOYe1FhAXapGLqzhddN3yYLQV9/myg9vwQQR3EdEGkz6pAL09KXJuECFUYIrAFcu8edqazDtk9nhOVZSBF4b0NhUIjM3Q0nhRCU2djtj4uznjvC6qc8XZTCer7gmbWTOOqDegpQCV3JRT+rRWgbrdCjnnTMgJ0tHsxlpcM77f6iGZThXF5iUAAAAAElFTkSuQmCC";class ${static editUI;_editUi;viewer;_editUiPosition=null;_editPointPrimitive=null;_drawEditEvent;elementId="draw-edit-ui";constructor(i,e){this._editUi=null,this.viewer=i,this.create(),this.setVisible(!1),this.renderPosition(),this._drawEditEvent=e}create(){if(this._editUi=document.getElementById(this.elementId),this._editUi)return this._editUi;const i=document.createElement("DIV");i.id=this.elementId,i.className="draw-edit-ui";const e=document.createElement("DIV");e.title="点击移动节点";const t=document.createElement("img");t.src=q,t.className="draw-edit-icon",e.appendChild(t),e.addEventListener("click",(()=>{this._drawEditEvent.drawEditMove&&this._drawEditEvent.drawEditMove(this._editPointPrimitive)}));const o=document.createElement("DIV");o.id="addPoint";const n=document.createElement("img");n.src=Y,n.title="点击添加节点",n.className="draw-edit-icon",o.appendChild(n),o.addEventListener("click",(()=>{this._drawEditEvent.drawEditAdd&&this._drawEditEvent.drawEditAdd(this._editPointPrimitive)}));const s=document.createElement("DIV"),r=document.createElement("img");s.id="removePoint",r.src=Z,r.title="点击删除节点",r.className="draw-edit-icon",s.appendChild(r),s.addEventListener("click",(()=>{this._drawEditEvent.drawEditRemove&&this._drawEditEvent.drawEditRemove(this._editPointPrimitive)}));const a=document.createElement("DIV"),l=document.createElement("img");l.src=X,l.title="点击删除绘制",l.className="draw-edit-icon",a.appendChild(l),a.addEventListener("click",(()=>{this._drawEditEvent.drawDelete&&this._drawEditEvent.drawDelete(this._editPointPrimitive)})),i.appendChild(e),i.appendChild(o),i.appendChild(s),i.appendChild(a),document.body.appendChild(i),this._editUi=i}setAddElementStatus(i){const e=document.getElementById("addPoint"),t=document.getElementById("removePoint");e&&(e.style.display=i?"block":"none"),t&&(t.style.display=i?"block":"none")}static createEditUi(i,e){return $.editUI||($.editUI=new $(i,e)),$.editUI}showAt(i,e,t){this.setVisible(!0),this._editUiPosition=i,this._editPointPrimitive=e,this.setAddElementStatus(!["point","circle","rectangle","vertical-line"].includes(t))}setVisible(i){this._editUi&&(this._editUi.style.display=i?"flex":"none")}renderPosition(){this.viewer.scene.postRender.addEventListener((()=>{if(this._editUiPosition&&this._editUi&&"flex"===this._editUi.style.display){const i=this.viewer.scene.cartesianToCanvasCoordinates(this._editUiPosition);this._editUi.style.position="fixed",this._editUi.style.top=i.y-28+"px",this._editUi.style.left=`${i.x+15}px`}}))}destroy(){$.editUI&&(this._editUi&&this._editUi.parentNode.removeChild(this._editUi),this._editUi=null)}}const ii=i=>{let e;const d=[];let p=new n(0,0,0);const c=[];let h,m,u,v;const C=H.point;let E=!1;((i,e)=>{const n=i.scene,s=new t(n.canvas);let r;i.cesiumWidget.screenSpaceEventHandler.removeInputAction(o.LEFT_DOUBLE_CLICK),s.setInputAction((t=>{const o=n.pickPosition(t.position),s=(new Date).getTime();if(r&&s-r<270){const n=i.scene.pick(t.position);e(w.DRAW_DB_CLICK,{position:o,pickPrimitive:n?.primitive,windowPosition:t.position})}else e(w.DRAW_ADD,{position:o}),r=(new Date).getTime()}),o.LEFT_CLICK),s.setInputAction((t=>{const o=i.scene.pick(t.endPosition),s=n.pickPosition(t.endPosition);e(w.DRAW_MOVE,{position:s,pickPrimitive:o?.primitive,windowPosition:t.endPosition}),o&&e(w.DRAW_PICK,{position:s,pickPrimitive:o?.primitive,windowPosition:t.endPosition})}),o.MOUSE_MOVE),s.setInputAction((()=>{e(w.DRAW_RIGHT_CLICK,{})}),o.RIGHT_CLICK)})(i,((i,e)=>{h&&(["drawDbClick","drawPick","drawMove","drawRightClick"].includes(i)||h.isEditing)&&F[i]?.(e)}));const y=new s;y.destroyPrimitives=!1,i.scene.primitives.add(y);const D=i=>{const e=c.findIndex((e=>e.id===i)),t=c[e];t.positions.length=0,c.splice(e,1),B.drawRemove&&B.drawRemove(t),setTimeout((()=>{t.measurePrimitive?.clearAllDiv(),y.remove(t?.primitives)}),300)},f=()=>{i._element.style.cursor="default",p=new n(0,0,0),console.log("绘制完成"),h.positions.pop(),h.isDisAdd=!0,setTimeout((()=>{h.isEditing=!1,h.isDisAdd=!1,B.drawEnd&&B.drawEnd(h),h={}}),300),m=void 0,u&&(h.pointPrimitives.remove(u),u=void 0),M()},P=i=>{const e=new Q(i);i.primitives.add(e)},b=i=>{const e=new j(i);i.primitives.add(e)},I=i=>{const e=new W(i);i.primitives.add(e)},R=i=>{const e=new J(i);i.primitives.add(e)},T=e=>{const t=new z(e,i);e.primitives.add(t),e.measurePrimitive=t,e.primitives.raiseToTop(t)},F={drawAdd:({position:i})=>{if(console.log("drawAdd"),h.positions.push(i),E=!1,_.id)return B.drawEditEnd&&B.drawEditEnd(h),_.id="",void f();const e=O(i,h);B.drawAdd&&B.drawAdd(i,h),"point"!==h.shape&&"vertical-surface-line"!==h.shape||f(),"vertical-line"===h.shape&&h.positions.length<=2&&d.push(e.id),["circle","rectangle","vertical-line"].includes(h.shape)&&h.positions.length>2&&("vertical-line"===h.shape&&(e.position=u.position),f())},drawMove:({position:i,windowPosition:e})=>{if(E=!0,k(),i&&!h.isDisAdd&&h.isEditing){if(M(e),_.id)h.positions.splice(_.index,1,i),_.pointPrimitive.position=i;else{const e=h.positions.findIndex((i=>i.x===p.x&&i.y===p.y&&i.z===p.z));h.positions.push(i),-1!==e&&h.positions.splice(e,1),u&&h.pointPrimitives.remove(u),u=O(i,h)}p=i,B.drawMove&&B.drawMove(i,h)}},drawPick:({pickPrimitive:i,windowPosition:e})=>{h.isEditing||i instanceof l&&U(i,e)},drawDbClick:({position:i,windowPosition:e,pickPrimitive:t})=>{h.isEditing?f():!h.isEditing&&t&&x(i,e,t)},drawRightClick:()=>{h.isEditing?(()=>{if(_.id)return _.id="",h.isDisAdd=!0,h.isEditing=!0,_.originPosition?(h.positions.splice(_.index,1,_.originPosition),_.pointPrimitive.position=_.originPosition):h?.positions.splice(_.index,1),B.drawEditEnd&&B.drawEditEnd(h),setTimeout((()=>{h.isEditing=!1,h.isDisAdd=!1}),300),p=new n(0,0,0),m=void 0,void M();if(["polyline","polygon"].includes(h.shape)&&h.positions.length>2){const i=E?2:1,e=h.pointPrimitives.get(h.positions.length-i);return h.pointPrimitives.remove(e),void h?.positions.splice(h.positions.length-i,1)}p=new n(0,0,0),m=void 0,D(h.id),h={},M()})():e.setVisible(!1)}},U=(e,t)=>{const o=e.id.split("-")[0],n=c.find((i=>i.id===o));d.includes(e.id)||n&&n.edit&&(i._element.style.cursor="pointer",e.pixelSize=1.5*C.pixelSize,e.outlineWidth=1.5*C.outlineWidth,m=e,v.showAt(t,K.pointEnter),v.setVisible(!0))},x=(i,t,o)=>{if(o instanceof l){if(d.includes(o.id))return;const t=o.id.split("-")[0],n=c.find((i=>i.id===t));if(!n)return;if(!n.edit)return;e.showAt(i,o,n.shape),B.drawEditStart&&B.drawEditStart(n)}},M=e=>{if(v)return e&&h.positions?void(_.id?v.showAt(e,K.drawEditMove[h.shape]||K.drawEditMove.default):h.positions.length>1?v.showAt(e,K.drawMove[h.shape]||K.drawMove.default):v.showAt(e,K.drawStart[h.shape]||K.drawStart.default)):(i._element.style.cursor="default",void v.setVisible(!1));i._element.style.cursor="default"},k=()=>{m&&(m.pixelSize=C.pixelSize,m.outlineWidth=C.outlineWidth,M())},_={},S={drawEditAdd:t=>{e.setVisible(!1);const{id:o,index:s,drawData:r}=G(t),a=new n(t.position.x,t.position.y,t.position.z);r?.positions.splice(s,0,a),h=r;const l=O(a,h);i._element.style.cursor="move",Object.assign(_,{id:o,index:s+1,pointPrimitive:l,originPosition:a}),h.isEditing=!0},drawEditMove:t=>{e.setVisible(!1),i._element.style.cursor="move";const{id:o,index:s,drawData:r}=G(t);h=r,Object.assign(_,{id:o,index:s,pointPrimitive:t,originPosition:new n(t.position.x,t.position.y,t.position.z)}),h.isEditing=!0},drawEditRemove:i=>{e.setVisible(!1);const{index:t,drawData:o}=G(i);o.isEditing=!0,o.isDisAdd=!0,o?.positions.splice(t,1),o?.pointPrimitives.remove(i),B.drawEditEnd&&B.drawEditEnd(o),setTimeout((()=>{o.isEditing=!1,o.isDisAdd=!1}),300)},drawDelete:i=>{e.setVisible(!1);const{id:t}=G(i);D(t)}};e=$.createEditUi(i,S);const G=i=>{const e=i.id.split("-")[0],t=c.find((i=>i.id===e)),o=t.positions.findIndex((e=>e.x===i.position.x&&e.y===i.position.y&&e.z===i.position.z));return{id:e,drawData:t,index:o}},N=i=>{const e=new s,t=new a;e.add(t);const o={id:A(),edit:i.edit||!1,measure:i.measure||!1,measureLabel:i.measureLabel||!1,disDepthFail:i.disDepthFail||!1,measureUnit:i.measureUnit||["m"],isEditing:!0,shape:i.shape,positions:[],clampToGround:i.clampToGround,pointPrimitives:t,primitives:e};return y.add(e),o},O=(i,e)=>e.pointPrimitives.add({id:`${e.id}-${A()}`,position:i,...C,color:r.fromCssColorString(C.color),outlineColor:r.fromCssColorString(C.outlineColor)}),B={};return{draw:e=>{i._element.style.cursor="crosshair",v=g.createToolTip(i),m=void 0;const t=N(e);h=t,B.drawStart&&B.drawStart(t),c.push(t),e.shape,"polyline"===e.shape&&P(t),"vertical-line"===e.shape&&(t.clampToGround=!1,P(t)),"vertical-surface-line"===e.shape&&(t.clampToGround=!1,P(t)),"polygon"===e.shape&&(b(t),P(t)),"circle"===e.shape&&(P(t),I(t)),"rectangle"===e.shape&&(P(t),R(t)),e.measure&&T(t),t.primitives.raiseToTop(t.pointPrimitives)},remove:i=>{D(i.id)},removeAll:()=>{c.forEach((i=>{i.measurePrimitive?.clearAllDiv()})),y.removeAll(),c.length=0},setDrawStyle:i=>{Object.assign(H.point,i.point),Object.assign(H.polyline,i.polyline),Object.assign(H.polygon,i.polygon)},Event:B,updateMeasureUnit:(i,e)=>{if(-1===c.findIndex((e=>e.id===i.id)))throw new Error("绘制对象不存在");const t=i.primitives._primitives.find((i=>i instanceof z));t&&t.updateUnit(e)}}};export{v as Draw,ii as createDrawHandler};
+import*as i from"cesium";import{ScreenSpaceEventHandler as e,ScreenSpaceEventType as t,Cartesian3 as n,PrimitiveCollection as s,Color as o,PointPrimitiveCollection as a,PointPrimitive as r}from"cesium";import{calcArea as l,calcPoistionCenter as d,calcGeodesicDistance as p,calcSpaceDistance as c,BasePrimitive as h,makePositiontoLnglat as m,Tooltip as u,numberId as A}from"@ino-cesium/common";var v=(i=>(i.DRAW_ADD="drawAdd",i.DRAW_MOVE="drawMove",i.DRAW_PICK="drawPick",i.DRAW_DB_CLICK="drawDbClick",i.DRAW_RIGHT_CLICK="drawRightClick",i))(v||{}),w=Object.freeze({__proto__:null,DrawEventType:v});const g="cm",C="厘米",E="m",y="米",D="km",f="千米",P="公里",I="㎡",b="平方厘米",R="㎡",U="平方米",F="km²",M="平方千米",T="平方公里",x="亩",_="公顷",S={cm:"cm²",m:"㎡",km:"km²","米":"平方米","千米":"平方千米","公里":"平方公里"},G=(i,e,t)=>e===t?i:i*B(t),k=(i,e,t)=>e===t?i:i*function(i){switch(i){case I:return 1e4;case R:return 1;case F:return 1e-6;case b:return 1e4;case U:return 1;case M:case T:return 1e-6;case x:return.0015;case _:return 1e-4;default:return 1}}(t),N=i=>S[i],B=i=>{switch(i){case E:return 1;case g:case C:return 100;case D:return.001;case y:return 1;case f:case P:return.001;default:return 1}};const O=(i,e,t,n,s)=>{t.push(...i.map((t,s)=>{const o=i[s+1];if(o){let i=e?p(t,o):c(t,o);return i=G(i,"m",n),{value:Number(i.toFixed(2)),unit:n,position:d([t,o]),positions:[t,o]}}return null}).filter(i=>i&&i.value>0))},V=i=>{if(2===i.length)return i;let[e,t]=i;return t||(t=N(e)),[e,t]},K={drawStart:{circle:"单击左键绘制圆的中心点，单机右键取消绘制。",rectangle:"单击左键绘制矩形左上角。",point:"单击左键结束绘制，单机右键取消绘制。","vertical-surface-line":"单击左键结束绘制，单机右键取消绘制。",default:"单击左键绘制第一个节点，单机右键取消绘制。"},drawMove:{circle:"单击左键确定圆的半径并结束绘制，单机右键取消绘制。",rectangle:"单击左键结束绘制，单机右键取消绘制。","vertical-line":"单击左键结束绘制，单机右键取消绘制。","vertical-surface-line":"单击左键结束绘制，单机右键取消绘制。",default:"单机左键绘制下一个节点，双击左键结束绘制，单机右键撤销上次绘制。"},pointEnter:"双击左键编辑节点。",drawEditMove:{default:"移动鼠标修改节点，单击左键确定修改，单机右键取消修改。"}},L={point:{color:"rgba(255,255,0,0.8)",pixelSize:8,outlineColor:"rgba(255,255,255,0.8)",outlineWidth:2,disableDepthTestDistance:Number.POSITIVE_INFINITY},polyline:{width:2,color:"rgba(81,255,0,0.8)",depthFailColor:"rgba(255,0,0,0.5)"},polygon:{color:"rgba(255,255,54,0.3)",depthFailColor:"rgba(255,0,0,0.3)"}};class H extends h{positions;drawData;appearanceTran;depthFailAppearance;linePrimitiveCollection;constructor(e){super(),this.drawData=e,this.positions=e.positions,this.linePrimitiveCollection=new i.PrimitiveCollection,this.setAppearance()}getGeometry(){const e=((e,t)=>{let n=e;if("vertical-surface-line"===t&&e.length>=1){const t=e[0],s=i.Cartographic.fromCartesian(t),o=i.Math.toDegrees(s.longitude),a=i.Math.toDegrees(s.latitude),r=0;n=[i.Cartesian3.fromDegrees(o,a,s.height),i.Cartesian3.fromDegrees(o,a,r)]}if("polygon"===t&&e.length>=2&&(n=[...e,e[0]]),"vertical-line"===t&&e.length>=2){const t=e[0],s=e[1],o=i.Cartographic.fromCartesian(t),a=i.Cartographic.fromCartesian(s).height,r=i.Math.toDegrees(o.longitude),l=i.Math.toDegrees(o.latitude);n=[i.Cartesian3.fromDegrees(r,l,o.height),i.Cartesian3.fromDegrees(r,l,a)]}if("circle"===t&&e.length>=2){const t=c(e[0],e[1]),s=i.Cartographic.fromCartesian(e[0]).height,o=new i.CircleOutlineGeometry({center:e[0],height:s,radius:t}),a=i.CircleOutlineGeometry.createGeometry(o);let r=[];if(a){const e=[].slice.call(a.attributes.position.values);r=i.Cartesian3.unpackArray(e),r.push(r[0]),n=r}}if("rectangle"===t&&e.length>=2){const t=i.Cartographic.fromCartesian(e[0]).height,s=i.Rectangle.fromCartesianArray(e),o=new i.RectangleOutlineGeometry({rectangle:s,height:t}),a=i.RectangleOutlineGeometry.createGeometry(o);let r=[];if(a){const e=[].slice.call(a.attributes.position.values);r=i.Cartesian3.unpackArray(e),r.push(r[0]),n=r}}return n})(this.positions,this.drawData.shape);if(this.drawData.shapePositions=e,"vertical-line"===this.drawData.shape||"vertical-surface-line"===this.drawData.shape){const i=this.drawData.pointPrimitives.get(1);i&&(i.position=this.drawData.shapePositions[1])}if(!(e.length<2))return this.drawData.clampToGround?new i.GroundPolylineGeometry({positions:e,width:L.polyline.width}):new i.PolylineGeometry({positions:e,width:L.polyline.width})}getPrimitive(){if(!this.drawData.isEditing)return this._primitive;const e=this.getGeometry();if(!e)return;const t=new i.GeometryInstance({geometry:e,id:this.drawData.id});return e?this.drawData.clampToGround?new i.GroundPolylinePrimitive({geometryInstances:t,appearance:this.appearance,asynchronous:!1}):(this.linePrimitiveCollection.removeAll(),this.linePrimitiveCollection.add(new i.Primitive({geometryInstances:t,appearance:this.appearance,asynchronous:!1})),this.linePrimitiveCollection.add(new i.Primitive({geometryInstances:t,appearance:this.appearanceTran,depthFailAppearance:this.drawData.disDepthFail?void 0:this.depthFailAppearance,asynchronous:!1})),this.linePrimitiveCollection):void 0}setAppearance(e){e?this.appearance=e:(this.appearance=new i.PolylineMaterialAppearance({material:new i.Material({fabric:{type:"Color",uniforms:{color:i.Color.fromCssColorString(L.polyline.color)}}})}),this.appearanceTran=new i.MaterialAppearance({material:new i.Material({fabric:{type:"Color",uniforms:{color:new i.Color(0,0,0,0)}}})}),this.depthFailAppearance=new i.PolylineMaterialAppearance({material:i.Material.fromType(i.Material.PolylineDashType,{color:i.Color.fromCssColorString(L.polyline.depthFailColor)})}))}}class Q extends h{positions;drawData;depthFailAppearance;constructor(i){super(),this.drawData=i,this.positions=i.positions,this.setAppearance()}getPrimitive(){if(!this.drawData.isEditing)return this._primitive;if(this.positions.length<3)return;const e=JSON.parse(JSON.stringify(this.positions)),t=[new i.GeometryInstance({geometry:new i.PolygonGeometry({polygonHierarchy:new i.PolygonHierarchy(e),perPositionHeight:!0}),id:`${this.drawData.id}-polygon`})];return this.drawData.clampToGround?new i.GroundPrimitive({geometryInstances:t,appearance:this.appearance,asynchronous:!1}):new i.Primitive({geometryInstances:t,appearance:this.appearance,depthFailAppearance:this.drawData.disDepthFail?void 0:this.depthFailAppearance,asynchronous:!1})}setAppearance(){this.appearance=new i.MaterialAppearance({material:i.Material.fromType("Color",{color:i.Color.fromCssColorString(L.polygon.color)})}),this.depthFailAppearance=new i.MaterialAppearance({material:i.Material.fromType("Color",{color:i.Color.fromCssColorString(L.polygon.depthFailColor)})})}}class j extends h{positions;drawData;depthFailAppearance;primitiveCollection;constructor(e){super(),this.drawData=e,this.positions=e.positions,this.primitiveCollection=new i.PrimitiveCollection,this.setAppearance()}getPrimitive(){if(!this.drawData.isEditing)return this._primitive;if(this.positions.length<2)return;this.primitiveCollection.removeAll();const e=JSON.parse(JSON.stringify(this.positions)),t=this.drawData.clampToGround?p(e[0],e[1]):c(e[0],e[1]);if(!t)return;const n=i.Cartographic.fromCartesian(e[0]).height,s=[new i.GeometryInstance({geometry:new i.CircleGeometry({center:e[0],height:n,radius:t}),id:`${this.drawData.id}`})];return this.drawData.clampToGround?this.primitiveCollection.add(new i.GroundPrimitive({geometryInstances:s,appearance:this.appearance,asynchronous:!1})):this.primitiveCollection.add(new i.Primitive({geometryInstances:s,appearance:this.appearance,depthFailAppearance:this.drawData.disDepthFail?void 0:this.depthFailAppearance,asynchronous:!1})),this.primitiveCollection}setAppearance(){this.appearance=new i.MaterialAppearance({material:i.Material.fromType("Color",{color:i.Color.fromCssColorString(L.polygon.color)})}),this.depthFailAppearance=new i.MaterialAppearance({material:i.Material.fromType("Color",{color:i.Color.fromCssColorString(L.polygon.depthFailColor)})})}}class W extends h{positions;drawData;depthFailAppearance;primitiveCollection;constructor(e){super(),this.drawData=e,this.positions=e.positions,this.primitiveCollection=new i.PrimitiveCollection,this.setAppearance()}getPrimitive(){if(!this.drawData.isEditing)return this._primitive;if(this.positions.length<2)return this.primitiveCollection;this.primitiveCollection.removeAll();const e=JSON.parse(JSON.stringify(this.positions));e.length=2;const t=i.Cartographic.fromCartesian(e[0]).height,n=i.Rectangle.fromCartesianArray(e),s=[new i.GeometryInstance({geometry:new i.RectangleGeometry({rectangle:n,height:t}),id:`${this.drawData.id}`})];return this.drawData.clampToGround?this.primitiveCollection.add(new i.GroundPrimitive({geometryInstances:s,appearance:this.appearance,asynchronous:!1})):this.primitiveCollection.add(new i.Primitive({geometryInstances:s,appearance:this.appearance,depthFailAppearance:this.drawData.disDepthFail?void 0:this.depthFailAppearance,asynchronous:!1})),this.primitiveCollection}setAppearance(){this.appearance=new i.MaterialAppearance({material:i.Material.fromType("Color",{color:i.Color.fromCssColorString(L.polygon.color)})}),this.depthFailAppearance=new i.MaterialAppearance({material:i.Material.fromType("Color",{color:i.Color.fromCssColorString(L.polygon.depthFailColor)})})}}class J extends h{drawData;labelCollection;measureDivs;cesiumWidget;viewer;constructor(e,t){super(),this.viewer=t,this.cesiumWidget=t._element.getElementsByClassName("cesium-widget")[0],this.drawData=e,this.labelCollection=new i.LabelCollection({scene:t.scene}),this.drawData.measureLabel&&this.setAppearance(),this.measureDivs=[],this.renderDivPosition()}getPrimitive(){return this.drawData.isEditing&&this.drawData.measureLabel?"point"===this.drawData.shape?(this.updatePointDivLabel(),this.labelCollection):this.drawData.shapePositions.length>=2?(this.updateUnit(this.drawData.measureUnit),this.labelCollection):void 0:this.labelCollection}updateUnit(i){if("point"===this.drawData.shape)return;this.drawData.measureUnit=i,this.clearAllDiv();const e=(i=>{let{shapePositions:e,positions:t,shape:n,clampToGround:s,measureUnit:o}=i;e||(e=t),s||(s=!1);const[a,r]=V(o),h=N(a);i.measureUnit=[a,r];const m=[];if("polyline"===n&&(O(t,s,m,a),m.push({value:0,unit:a,position:t[0],positions:t,prefixText:"起点"}),m.push({value:Number(m.reduce((i,e)=>i+e.value,0).toFixed(2)),unit:a,position:t[t.length-1],positions:t})),"vertical-line"!==n&&"vertical-surface-line"!==n||(O(e,s,m,a),m.length&&(m[0].position=e[0])),"polygon"===n){O(e,s,m,a);const i=k(l(e),h,r);m.push({value:Number(i.toFixed(2)),unit:r,position:d(e),positions:e})}if("rectangle"===n){O(e,s,m,a);const i=k(l(e),h,r);m.push({value:Number(i.toFixed(2)),unit:r,position:d(e),positions:e})}if("circle"===n){const i=s?p(t[0],t[1]):c(t[0],t[1]);m.push({value:Number(G(i,"m",a).toFixed(2)),unit:a,position:t[1],positions:t,prefixText:"半径"});const e=k(i*i*Math.PI,a,r);i>0&&m.push({value:Number(e.toFixed(2)),unit:r,position:t[0],positions:t})}return m})(this.drawData);this.drawData.measureResult=e,e.forEach((i,e)=>{let t="";i.prefixText?(t=`${i.prefixText}`,i.value&&(t+=`:${i.value}${i.unit}`)):t+=`${i.value}${i.unit}`;const n=this.createDiv(`measure-label-${this.drawData.id}-${e}`,t);this.measureDivs.push({position:i.position,divEle:n})})}updatePointDivLabel(){this.clearAllDiv(),this.drawData.positions.forEach(i=>{const e=m(i),t=this.createDiv(`measure-label-${this.drawData.id}-0`,`经度：${e.longitude.toFixed(6)}\n纬度：${e.latitude.toFixed(6)}\n高度：${e.height.toFixed(6)}`);this.measureDivs.push({position:i,divEle:t})})}renderDivPosition(){this.viewer.scene.postRender.addEventListener(()=>{this.measureDivs.forEach(i=>{const e=this.viewer.scene.cartesianToCanvasCoordinates(i.position);if(e){i.divEle.style.display="block";const t=i.divEle.getBoundingClientRect();i.divEle.style.left=e.x-t.width/2+"px",i.divEle.style.top=e.y-t.height+"px"}else i.divEle.style.display="none"})})}destroy(){super.destroy(),this.clearAllDiv()}setAppearance(){}clearAllDiv(){this.measureDivs.forEach(i=>{i.divEle.remove()}),this.measureDivs=[]}createDiv(i,e,t=48){const n=`\n        <div style="\n            background: rgba(0, 0, 0, 0.6);\n            color: white;\n            border-radius: 5px;\n            padding: 0 10px 0 10px;\n            font-size: 14px;\n            white-space: nowrap;\n            pointer-events: none;\n        ">\n            ${e.split("\n").map(i=>`\n        <div style="height: 24px; line-height: 24px">\n            ${i}\n        </div>\n        `).join(" ")}\n        </div>\n        <div style="\n            height: ${t}px;\n            width: 2px;\n            background: rgba(0, 0, 0, 0.6);\n            margin: auto;\n        ">\n        </div>\n    `,s=document.createElement("div");return s.id=i,s.innerHTML=n,s.style.position="absolute",s.style.pointerEvents="none",s.className=`measure-label measure-label-${this.drawData.id}`,this.cesiumWidget.appendChild(s),s}}const z="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAAQBJREFUWEft2MsNgkAQBuAZtABCBctBErvATryiRRibkKudGKvgwMFtQGIBumOAYAxCArsTs4fZ8w758032wSJ4PtDzfCABXTvEKhjmhXpka+0a6rueNWB0KgmAdLVLYq6QbAHDvEwDgksdzOAz5pKUgK6tFkERnCogq3iq1Ng8ERRBS4HBjTrKywMAqjnfJCKFAGlTg3ieU9vOJV1lq2O/bjhgcyv59yBt8LXpXzLYBFsE2toKojHX+z75kWc8iwsV0PLm8XVLArotivp/RFrsYiiCLnp1rQiKoKWAHHWWcJ8yZsFF8zbj5eNRt9VwPRp1hGyCrq0cq5eArrLeC74BlkT4KR3TrCoAAAAASUVORK5CYII=",Y="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAAY9JREFUWEftmNFRwzAMhiVYAMoC5Y50jjAJ9LFliMIQNI/NJtA1CA9hAHIsgMWZYC5xHVtNajcHzqtl+ctvSZaNMPIPR84HEXDoDv1tBc/XxRMCpFaVEPNqcTXvq6RTwbOsSE8FTfUFBOKNE05NQsxRiK3u4/MEy49F8myDdwJOstcNEN32VWCouhHQu4JetnYPp84tVr4uHl8OGofvd7Ocw8kGnKwL4jjk2lTLhLU2y0guGgE7pI8KdsVkuBhEzDtPGstYEEAkmstyMcmKFRDcN9WyjUk774AKQEE1IW1jyt47IACV1XJ22VRNQqKgN70Im9qyAIASbRdST4qunjEQoB3S1tAGBATQY05iy7ObEDdHLzMmOFPi6KBBFLTBuSC9A5rg6pijqSm79TrpHRC021o7IdrZfbwy8wNpztYacgRlhtuitu38b3E/rt9Z/w+Q9czBVtV9RCpX7I7adTKw2QBAIFy7njz2Bvy+OGXFighS9pvMDjWVdXlKHrg/xFaQ6/DQdhFwqKJRwaEKfgEJRgs46ima/wAAAABJRU5ErkJggg==",X="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAAMdJREFUWEdjZBjkgHGQu49h1IGUxtBoCI6GIKUhQKn+0TQ4GoKUhgCl+kfT4GgIUhoClOofTYM0DUGh6bfrGRgYFSi1BJ9+xn//Dr7NVluASw3eKBaadvs/LR0HM/sfI4Pjh0zVA9jswulAgenXFZj+s9ynjwP/KH7I1HxAkgNBioWn3kr4z8RkT1tH/n/wLlO1kawopq3DiDN9tJghLpxwqxoNwdEQpDQEKNU/mgZHQ5DSEKBU/2gaHA1BSkOAUv2jaXDYhyAAbjwcKU1UyjYAAAAASUVORK5CYII=",Z="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAAkJJREFUWEftl19SwkAMxpPCARAvgDPijKewnER4BA8hHEJ5FE8CnsIZccZ6AJEDMF1Ny5Zu/6bNMvQBXmk3vyZfvmQRGv7DhvPBGVBaIasZ7M4/XwhoM74eScH0+9YAAzilhuHByttMbq5sQFoBNOE0lh1IMeDF83qJAG52tuSQIsBiODuZrA14+fQxVIhBUwSqA1hFmURcHPQIAIiLuo1TG5CguvP14z/Z1EcYtHzVi4ARpj7sXh3V/iLw30l/ULdhRIAUtDN/723Ht56RUYTpZtyf6f/qwtF7YkAdPAtQAmbdB08KSMF/Hm4WRRmpCkjeyWmc0hJHVlLSiaQ3gHYv/IidR7rM+6CDPZX7ZCFg0ueoW7fj/kqiLfoQ6u7DGcWQuYDHgNNQVSAzAZNwgQkjpDJHXldUSm1DDrTv01nHnmHmOQtGCpA3vsJwnJJ35mvXUbBkySJD5ylAPR04B54EMD7C4kJGBbMkdJn16BK3/FZq21GOc8eZ17lNYmZSeeHA76cgOZlOPpMse9G8zgUMOo3ErWC631c8H3Fk22bKlolCHzQgLRq1rk4ZHGtZIEjSUJneqo46zvhkAXI1VhWQe27pLOYe1FhAXapGLqzhddN3yYLQV9/myg9vwQQR3EdEGkz6pAL09KXJuECFUYIrAFcu8edqazDtk9nhOVZSBF4b0NhUIjM3Q0nhRCU2djtj4uznjvC6qc8XZTCer7gmbWTOOqDegpQCV3JRT+rRWgbrdCjnnTMgJ0tHsxlpcM77f6iGZThXF5iUAAAAAElFTkSuQmCC";class q{static editUI;_editUi;viewer;_editUiPosition=null;_editPointPrimitive=null;_drawEditEvent;elementId="draw-edit-ui";constructor(i,e){this._editUi=null,this.viewer=i,this.create(),this.setVisible(!1),this.renderPosition(),this._drawEditEvent=e}create(){if(this._editUi=document.getElementById(this.elementId),this._editUi)return this._editUi;const i=document.createElement("DIV");i.id=this.elementId,i.className="draw-edit-ui";const e=document.createElement("DIV");e.title="点击移动节点";const t=document.createElement("img");t.src=Z,t.className="draw-edit-icon",e.appendChild(t),e.addEventListener("click",()=>{this._drawEditEvent.drawEditMove&&this._drawEditEvent.drawEditMove(this._editPointPrimitive)});const n=document.createElement("DIV");n.id="addPoint";const s=document.createElement("img");s.src=z,s.title="点击添加节点",s.className="draw-edit-icon",n.appendChild(s),n.addEventListener("click",()=>{this._drawEditEvent.drawEditAdd&&this._drawEditEvent.drawEditAdd(this._editPointPrimitive)});const o=document.createElement("DIV"),a=document.createElement("img");o.id="removePoint",a.src=X,a.title="点击删除节点",a.className="draw-edit-icon",o.appendChild(a),o.addEventListener("click",()=>{this._drawEditEvent.drawEditRemove&&this._drawEditEvent.drawEditRemove(this._editPointPrimitive)});const r=document.createElement("DIV"),l=document.createElement("img");l.src=Y,l.title="点击删除绘制",l.className="draw-edit-icon",r.appendChild(l),r.addEventListener("click",()=>{this._drawEditEvent.drawDelete&&this._drawEditEvent.drawDelete(this._editPointPrimitive)}),i.appendChild(e),i.appendChild(n),i.appendChild(o),i.appendChild(r),document.body.appendChild(i),this._editUi=i}setAddElementStatus(i){const e=document.getElementById("addPoint"),t=document.getElementById("removePoint");e&&(e.style.display=i?"block":"none"),t&&(t.style.display=i?"block":"none")}static createEditUi(i,e){return q.editUI||(q.editUI=new q(i,e)),q.editUI}showAt(i,e,t){this.setVisible(!0),this._editUiPosition=i,this._editPointPrimitive=e,this.setAddElementStatus(!["point","circle","rectangle","vertical-line"].includes(t))}setVisible(i){this._editUi&&(this._editUi.style.display=i?"flex":"none")}renderPosition(){this.viewer.scene.postRender.addEventListener(()=>{if(this._editUiPosition&&this._editUi&&"flex"===this._editUi.style.display){const i=this.viewer.scene.cartesianToCanvasCoordinates(this._editUiPosition);this._editUi.style.position="fixed",this._editUi.style.top=i.y-28+"px",this._editUi.style.left=`${i.x+15}px`}})}destroy(){q.editUI&&(this._editUi&&this._editUi.parentNode.removeChild(this._editUi),this._editUi=null)}}const $=i=>{let l;const d=[];let p=new n(0,0,0);const c=[];let h,m,w,g;const C=L.point;let E=!1;((i,n)=>{const s=i.scene,o=new e(s.canvas);let a;i.cesiumWidget.screenSpaceEventHandler.removeInputAction(t.LEFT_DOUBLE_CLICK),o.setInputAction(e=>{const t=s.pickPosition(e.position),o=(new Date).getTime();if(a&&o-a<270){const s=i.scene.pick(e.position);return void n(v.DRAW_DB_CLICK,{position:t,pickPrimitive:s?.primitive,windowPosition:e.position})}n(v.DRAW_ADD,{position:t}),a=(new Date).getTime()},t.LEFT_CLICK),o.setInputAction(e=>{const t=i.scene.pick(e.endPosition),o=s.pickPosition(e.endPosition);n(v.DRAW_MOVE,{position:o,pickPrimitive:t?.primitive,windowPosition:e.endPosition}),t&&n(v.DRAW_PICK,{position:o,pickPrimitive:t?.primitive,windowPosition:e.endPosition})},t.MOUSE_MOVE),o.setInputAction(()=>{n(v.DRAW_RIGHT_CLICK,{})},t.RIGHT_CLICK)})(i,(i,e)=>{h&&(["drawDbClick","drawPick","drawMove","drawRightClick"].includes(i)||h.isEditing)&&F[i]?.(e)});const y=new s;y.destroyPrimitives=!1,i.scene.primitives.add(y);const D=i=>{const e=c.findIndex(e=>e.id===i),t=c[e];t.positions.length=0,c.splice(e,1),O.drawRemove&&O.drawRemove(t),setTimeout(()=>{t.measurePrimitive?.clearAllDiv(),y.remove(t?.primitives)},300)},f=()=>{i._element.style.cursor="default",p=new n(0,0,0),h.positions.pop(),h.isDisAdd=!0,setTimeout(()=>{h.isEditing=!1,h.isDisAdd=!1,O.drawEnd&&O.drawEnd(h),h={}},300),m=void 0,w&&(h.pointPrimitives.remove(w),w=void 0),x()},P=i=>{const e=new H(i);i.primitives.add(e)},I=i=>{const e=new Q(i);i.primitives.add(e)},b=i=>{const e=new j(i);i.primitives.add(e)},R=i=>{const e=new W(i);i.primitives.add(e)},U=e=>{const t=new J(e,i);e.primitives.add(t),e.measurePrimitive=t,e.primitives.raiseToTop(t)},F={drawAdd:({position:i})=>{if(h.positions.push(i),E=!1,S.id)return O.drawEditEnd&&O.drawEditEnd(h),S.id="",void f();const e=B(i,h);O.drawAdd&&O.drawAdd(i,h),"point"!==h.shape&&"vertical-surface-line"!==h.shape||f(),"vertical-line"===h.shape&&h.positions.length<=2&&d.push(e.id),["circle","rectangle","vertical-line"].includes(h.shape)&&h.positions.length>2&&("vertical-line"===h.shape&&(e.position=w.position),f())},drawMove:({position:i,windowPosition:e})=>{if(E=!0,_(),i&&!h.isDisAdd&&h.isEditing){if(x(e),S.id)h.positions.splice(S.index,1,i),S.pointPrimitive.position=i;else{const e=h.positions.findIndex(i=>i.x===p.x&&i.y===p.y&&i.z===p.z);h.positions.push(i),-1!==e&&h.positions.splice(e,1),w&&h.pointPrimitives.remove(w),w=B(i,h)}p=i,O.drawMove&&O.drawMove(i,h)}},drawPick:({pickPrimitive:i,windowPosition:e})=>{h.isEditing||i instanceof r&&M(i,e)},drawDbClick:({position:i,windowPosition:e,pickPrimitive:t})=>{h.isEditing?f():!h.isEditing&&t&&T(i,e,t)},drawRightClick:()=>{h.isEditing?(()=>{if(S.id)return S.id="",h.isDisAdd=!0,h.isEditing=!0,S.originPosition?(h.positions.splice(S.index,1,S.originPosition),S.pointPrimitive.position=S.originPosition):h?.positions.splice(S.index,1),O.drawEditEnd&&O.drawEditEnd(h),setTimeout(()=>{h.isEditing=!1,h.isDisAdd=!1},300),p=new n(0,0,0),m=void 0,void x();if(["polyline","polygon"].includes(h.shape)&&h.positions.length>2){const i=E?2:1,e=h.pointPrimitives.get(h.positions.length-i);return h.pointPrimitives.remove(e),void h?.positions.splice(h.positions.length-i,1)}p=new n(0,0,0),m=void 0,D(h.id),h={},x()})():l.setVisible(!1)}},M=(e,t)=>{const n=e.id.split("-")[0],s=c.find(i=>i.id===n);d.includes(e.id)||s&&s.edit&&(i._element.style.cursor="pointer",e.pixelSize=1.5*C.pixelSize,e.outlineWidth=1.5*C.outlineWidth,m=e,g.showAt(t,K.pointEnter),g.setVisible(!0))},T=(i,e,t)=>{if(t instanceof r){if(d.includes(t.id))return;const e=t.id.split("-")[0],n=c.find(i=>i.id===e);if(!n)return;if(!n.edit)return;l.showAt(i,t,n.shape),O.drawEditStart&&O.drawEditStart(n)}},x=e=>{if(g)return e&&h.positions?void(S.id?g.showAt(e,K.drawEditMove[h.shape]||K.drawEditMove.default):h.positions.length>1?g.showAt(e,K.drawMove[h.shape]||K.drawMove.default):g.showAt(e,K.drawStart[h.shape]||K.drawStart.default)):(i._element.style.cursor="default",void g.setVisible(!1));i._element.style.cursor="default"},_=()=>{m&&(m.pixelSize=C.pixelSize,m.outlineWidth=C.outlineWidth,x())},S={},G={drawEditAdd:e=>{l.setVisible(!1);const{id:t,index:s,drawData:o}=k(e),a=new n(e.position.x,e.position.y,e.position.z);o?.positions.splice(s,0,a),h=o;const r=B(a,h);i._element.style.cursor="move",Object.assign(S,{id:t,index:s+1,pointPrimitive:r,originPosition:a}),h.isEditing=!0},drawEditMove:e=>{l.setVisible(!1),i._element.style.cursor="move";const{id:t,index:s,drawData:o}=k(e);h=o,Object.assign(S,{id:t,index:s,pointPrimitive:e,originPosition:new n(e.position.x,e.position.y,e.position.z)}),h.isEditing=!0},drawEditRemove:i=>{l.setVisible(!1);const{index:e,drawData:t}=k(i);t.isEditing=!0,t.isDisAdd=!0,t?.positions.splice(e,1),t?.pointPrimitives.remove(i),O.drawEditEnd&&O.drawEditEnd(t),setTimeout(()=>{t.isEditing=!1,t.isDisAdd=!1},300)},drawDelete:i=>{l.setVisible(!1);const{id:e}=k(i);D(e)}};l=q.createEditUi(i,G);const k=i=>{const e=i.id.split("-")[0],t=c.find(i=>i.id===e),n=t.positions.findIndex(e=>e.x===i.position.x&&e.y===i.position.y&&e.z===i.position.z);return{id:e,drawData:t,index:n}},N=i=>{const e=new s,t=new a;e.add(t);const n={id:A(),edit:i.edit||!1,measure:i.measure||!1,measureLabel:i.measureLabel||!1,disDepthFail:i.disDepthFail||!1,measureUnit:i.measureUnit||["m"],isEditing:!0,shape:i.shape,positions:[],clampToGround:i.clampToGround,pointPrimitives:t,primitives:e};return y.add(e),n},B=(i,e)=>e.pointPrimitives.add({id:`${e.id}-${A()}`,position:i,...C,color:o.fromCssColorString(C.color),outlineColor:o.fromCssColorString(C.outlineColor)}),O={};return{draw:e=>{i._element.style.cursor="crosshair",g=u.createToolTip(i),m=void 0;const t=N(e);h=t,O.drawStart&&O.drawStart(t),c.push(t),e.shape,"polyline"===e.shape&&P(t),"vertical-line"===e.shape&&(t.clampToGround=!1,P(t)),"vertical-surface-line"===e.shape&&(t.clampToGround=!1,P(t)),"polygon"===e.shape&&(I(t),P(t)),"circle"===e.shape&&(P(t),b(t)),"rectangle"===e.shape&&(P(t),R(t)),e.measure&&U(t),t.primitives.raiseToTop(t.pointPrimitives)},remove:i=>{D(i.id)},removeAll:()=>{c.forEach(i=>{i.measurePrimitive?.clearAllDiv()}),y.removeAll(),c.length=0},setDrawStyle:i=>{Object.assign(L.point,i.point),Object.assign(L.polyline,i.polyline),Object.assign(L.polygon,i.polygon)},Event:O,updateMeasureUnit:(i,e)=>{if(-1===c.findIndex(e=>e.id===i.id))throw new Error("绘制对象不存在");const t=i.primitives._primitives.find(i=>i instanceof J);t&&t.updateUnit(e)}}};export{w as Draw,$ as createDrawHandler};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ino-cesium/draw",
   "type": "module",
-  "version": "0.0.10",
+  "version": "0.0.12",
   "author": "koino",
   "keywords": [
     "cesium",
@@ -32,7 +32,7 @@
     "html2canvas": "^1.4.1"
   },
   "dependencies": {
-    "@ino-cesium/common": "0.0.10",
+    "@ino-cesium/common": "0.0.12",
     "html2canvas": "^1.4.1"
   },
   "types": "./dist/index.d.ts",