三点矩形功能

src/Draw/drawThreeRect.js

@@ -0,0 +1,318 @@
+import MouseTip from '../MouseTip'
+import MouseEvent from '../Event'
+import Draw from './draw'
+
+/**
+ * @extends Draw*/
+class DrawThreeRect extends Draw {
+  /**
+   * @constructor
+   * @param [options] {object} 三点矩形属性
+   * @param [options.color=rgba(185,14,14,0.58)] {object} 线属性
+
+   * */
+  constructor(sdk, options = {}) {
+    super(sdk, options)
+    this.polygonHasCreated = false
+    this.rectObject = []
+  }
+
+  static create_polygon(that, viewer = that.viewer) {
+    that.polygonHasCreated = true
+    let id = that.randomString()
+    viewer.entities.add(
+      new Cesium.Entity({
+        id: id,
+        polygon: {
+          classificationType: Cesium.ClassificationType.BOTH,
+          hierarchy: new Cesium.CallbackProperty((e) => {
+            return new Cesium.PolygonHierarchy(that.positions)
+          }),
+          material: Cesium.Color.fromCssColorString(that.color),
+          zIndex: 99999999
+        },
+        polyline: {
+          positions: new Cesium.CallbackProperty((e) => {
+            // return that.positions.concat(that.positions[0])
+            return that.positionsLine
+          }),
+          width: 2,
+          material: Cesium.Color.fromCssColorString('#c1c505').withAlpha(0.5),
+          clampToGround: true,
+          zIndex: 99999999
+        },
+      })
+    )
+    return id
+  }
+  computedLastPoint(arr) {
+    const start = arr[0];
+    const end = arr[1];
+    // 计算点到线的距离
+    const directionVector = Cesium.Cartesian3.subtract(end, start, new Cesium.Cartesian3());
+    const pointToStart = Cesium.Cartesian3.subtract(arr[2], start, new Cesium.Cartesian3());
+    const projectionLength = Cesium.Cartesian3.dot(pointToStart, directionVector) / Cesium.Cartesian3.magnitudeSquared(directionVector);
+    const projectionVector = Cesium.Cartesian3.multiplyByScalar(directionVector, projectionLength, new Cesium.Cartesian3());
+    const projectionPoint = Cesium.Cartesian3.add(start, projectionVector, new Cesium.Cartesian3());
+    const distance = Cesium.Cartesian3.distance(arr[2], projectionPoint)
+
+    const perp = Cesium.Cartesian3.subtract(arr[2], projectionPoint, new Cesium.Cartesian3());
+    Cesium.Cartesian3.normalize(perp, perp);
+    // 生成偏移向量
+    const offset = Cesium.Cartesian3.multiplyByScalar(perp, distance, new Cesium.Cartesian3());
+    let threePoint = Cesium.Cartesian3.add(end, offset, new Cesium.Cartesian3())
+    let lastPoint = Cesium.Cartesian3.add(start, offset, new Cesium.Cartesian3())
+    return [{ ...threePoint }, { ...lastPoint }]
+  }
+  /**
+   * @desc 开始动态绘制面
+   * @method start
+   * @param cb {function} 回调函数
+   * @memberOf DrawPolygon
+   * @example draw.start((err,positions)=>{
+   *
+   * })
+   * */
+  start(cb) {
+    if (YJ.Measure.GetMeasureStatus()) {
+      cb('上一次测量未结束')
+    } else {
+      this.polygonHasCreated = false
+      super.start()
+      YJ.Measure.SetMeasureStatus(true)
+      let into
+      this.tip = new MouseTip('左键确定，右键结束；CTRL+右键撤销', this.sdk)
+      this.event = new MouseEvent(this.sdk)
+      let cnt = 0
+      this.positions = []
+      this.positionsLine = []
+      this.points_ids = [] //存放左键点击时临时添加的point的id
+      let cache_positions = []
+      let cache_84_position = []
+      this.event.mouse_left((movement, cartesian) => {
+        if (into === '2D') {
+          return
+        }
+        into = '3D'
+        cnt++
+        this.positions = cache_positions.concat({ ...cartesian })
+        this.tip.setPosition(
+          cartesian,
+          movement.position.x,
+          movement.position.y
+        )
+        if (!this.polygonHasCreated) {
+          let polyline_id = DrawThreeRect.create_polygon(this)
+          this.points_ids.push(polyline_id)
+        }
+        cache_positions.push(cartesian)
+        cache_84_position.push(this.cartesian3Towgs84(cartesian, this.viewer))
+        this.points_ids.push(this.create_point(cartesian))
+        if (cnt == 3) {
+          this.end()
+          cb(null, this.rectObject)
+        }
+      })
+      this.event.mouse_right((movement, cartesian) => {
+        if (into === '2D') {
+          return
+        }
+        // let positions = []
+        // console.log(cache_positions)
+        // cache_positions.forEach((item) => {
+        //   let p = this.cartesian3Towgs84(item)
+        //   console.log(item)
+        //   positions.push(p)
+        // })
+        this.end()
+        cb('取消', '')
+      })
+      this.event.mouse_move((movement, cartesian) => {
+        if (into === '2D') {
+          return
+        }
+
+        // this.positions = cache_positions.concat({ ...cartesian })
+        this.tip.setPosition(
+          cartesian,
+          movement.endPosition.x,
+          movement.endPosition.y
+        )
+
+        if (cnt == 2) {
+          let arr = JSON.parse(JSON.stringify(cache_positions))
+          let arr1 = arr.concat({ ...cartesian })
+          let pointArr = this.computedLastPoint(arr1)
+          arr = arr.concat(pointArr)
+          this.positions = arr
+          let arr_84 = arr.map(item => {
+            return this.cartesian3Towgs84(item, this.viewer)
+          })
+          this.rectObject = arr_84
+        }
+      })
+      this.event.mouse_right_keyboard_ctrl((movement, cartesian) => {
+        if (into === '2D') {
+          return
+        }
+        if (this.points_ids.length > 1) {
+          this.remove_entity(this.points_ids.pop()) //移除point
+          cache_positions.pop()
+          cache_84_position.pop()
+        }
+      })
+
+      this.event.gesture_pinck_start_keyboard_ctrl(() => {
+        if (into === '2D') {
+          return
+        }
+        if (this.points_ids.length > 1) {
+          this.remove_entity(this.points_ids.pop()) //移除point
+          cache_positions.pop()
+          cache_84_position.pop()
+          this.positions = cache_positions.concat(cartesian)
+        }
+      })
+
+      this.event.gesture_pinck_start((movement, cartesian) => {
+        if (into === '2D') {
+          return
+        }
+        let startTime = new Date()
+        this.event.gesture_pinck_end(() => {
+          let endTime = new Date()
+          if (endTime - startTime >= 500) {
+            cb(null, cache_84_position)
+            this.end()
+          }
+          else {
+            this.tip.setPosition(
+              cartesian,
+              (movement.position1.x + movement.position2.x) / 2,
+              (movement.position1.y + movement.position2.y) / 2
+            )
+            if (!this.polygonHasCreated) {
+              let polyline_id = DrawThreeRect.create_polygon(this)
+              this.points_ids.push(polyline_id)
+            }
+            cache_positions.push(cartesian)
+            cache_84_position.push(this.cartesian3Towgs84(cartesian, this.viewer))
+            this.points_ids.push(this.create_point(cartesian))
+            this.positions = cache_positions.concat(cartesian)
+          }
+        })
+      })
+
+      if (!this._is2D && this._sdk2D) {
+        this.event2D = new MouseEvent(this._sdk2D)
+        this.event2D.mouse_left((movement, cartesian) => {
+          if (into === '3D') {
+            return
+          }
+          into = '2D'
+          cnt++
+          this.positions = cache_positions.concat({ ...cartesian })
+          this.tip.setPosition(
+            cartesian,
+            movement.position.x + this.viewer.canvas.width,
+            movement.position.y
+          )
+          if (!this.polygonHasCreated) {
+            let polyline_id = DrawThreeRect.create_polygon(this, this._sdk2D.viewer)
+            this.points_ids.push(polyline_id)
+          }
+          cache_positions.push(cartesian)
+          cache_84_position.push(this.cartesian3Towgs84(cartesian, this.viewer))
+          this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
+          if (cnt == 3) {
+            this.end()
+            cb(null, this.rectObject)
+          }
+        })
+        this.event2D.mouse_right((movement, cartesian) => {
+          if (into === '3D') {
+            return
+          }
+          this.end()
+          cb('取消', '')
+        })
+        this.event2D.mouse_move((movement, cartesian) => {
+          if (into === '3D') {
+            return
+          }
+          // this.positions = cache_positions.concat({ ...cartesian })
+          this.tip.setPosition(
+            cartesian,
+            movement.endPosition.x + this.viewer.canvas.width,
+            movement.endPosition.y
+          )
+
+          if (cnt == 2) {
+            let arr = JSON.parse(JSON.stringify(cache_positions))
+            let arr1 = arr.concat({ ...cartesian })
+            let pointArr = this.computedLastPoint(arr1)
+            arr = arr.concat(pointArr)
+            this.positions = arr
+            let arr_84 = arr.map(item => {
+              return this.cartesian3Towgs84(item, this.viewer)
+            })
+            this.rectObject = arr_84
+          }
+        })
+        this.event2D.mouse_right_keyboard_ctrl((movement, cartesian) => {
+          if (into === '3D') {
+            return
+          }
+          if (this.points_ids.length > 1) {
+            this.remove_entity(this.points_ids.pop()) //移除point
+            cache_positions.pop()
+            cache_84_position.pop()
+          }
+        })
+
+        this.event2D.gesture_pinck_start_keyboard_ctrl(() => {
+          if (into === '3D') {
+            return
+          }
+          if (this.points_ids.length > 1) {
+            this.remove_entity(this.points_ids.pop()) //移除point
+            cache_positions.pop()
+            cache_84_position.pop()
+            this.positions = cache_positions.concat(cartesian)
+          }
+        })
+
+        this.event2D.gesture_pinck_start((movement, cartesian) => {
+          if (into === '3D') {
+            return
+          }
+          let startTime = new Date()
+          this.event2D.gesture_pinck_end(() => {
+            let endTime = new Date()
+            if (endTime - startTime >= 500) {
+              cb(null, cache_84_position)
+              this.end()
+            }
+            else {
+              this.tip.setPosition(
+                cartesian,
+                ((movement.position1.x + movement.position2.x) / 2) + this.viewer.canvas.width,
+                (movement.position1.y + movement.position2.y) / 2
+              )
+              if (!this.polygonHasCreated) {
+                let polyline_id = DrawThreeRect.create_polygon(this, this._sdk2D.viewer)
+                this.points_ids.push(polyline_id)
+              }
+              cache_positions.push(cartesian)
+              cache_84_position.push(this.cartesian3Towgs84(cartesian, this.viewer))
+              this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
+              this.positions = cache_positions.concat(cartesian)
+            }
+          })
+        })
+      }
+    }
+  }
+}
+
+export default DrawThreeRect

src/In/index.js

@@ -100,6 +100,7 @@ import MeasureAngle from '../Measure/MeasureAngle'
 import MeasureAzimuth from '../Measure/MeasureAzimuth'
 import DrawPolyline from '../Draw/drawPolyline'
 import DrawPolygon from '../Draw/drawPolygon'
+import DrawThreeRect from '../Draw/drawThreeRect'
 import DrawPoint from '../Draw/drawPoint'
 import DrawCircle from '../Draw/drawCircle'
 import DrawElliptic from '../Draw/drawElliptic'
@@ -187,6 +188,7 @@ import FlowLine from '../Obj/Base/FlowLine'
 import Sunshine from '../Global/efflect/Sunshine'
 // import Road2 from '../Obj/Base/RoadObject'
 import TextBox from '../Obj/Base/TextBox'
+import BatchModel from '../Obj/Base/BatchModel'
 
 const YJEarthismeasuring = Symbol('测量状态')
 const screenRecord = Symbol('录屏对象')
@@ -260,7 +262,8 @@ if (!window.YJ) {
       Dialog,
       FlowLine,
       // Road2,
-      TextBox
+      TextBox,
+      BatchModel
     },
     YJEarth,
     Tools,
@@ -378,6 +381,7 @@ if (!window.YJ) {
       DrawAssemble,
       DrawSector,
       DrawTakeOff,
+      DrawThreeRect
     },
     // 分析
     Analysis: {