272 lines
9.1 KiB
JavaScript
272 lines
9.1 KiB
JavaScript
|
/**
|
|||
|
|
* @name: drawCircle
|
|||
|
|
* @author: Administrator
|
|||
|
|
* @date: 2022-06-15 14:55
|
|||
|
|
* @description：drawCircle
|
|||
|
|
* @update: 2022-06-15 14:55
|
|||
|
|
*/
|
|||
|
|
import Draw from './draw'
|
|||
|
|
import MouseTip from '../MouseTip'
|
|||
|
|
import MouseEvent from '../Event'
|
|||
|
|
|
|||
|
|
export default class DrawCircle extends Draw {
|
|||
|
|
constructor(sdk, options = {}) {
|
|||
|
|
super(sdk, options)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
start(cb) {
|
|||
|
|
if (YJ.Measure.GetMeasureStatus()) {
|
|||
|
|
cb('上一次测量未结束')
|
|||
|
|
} else {
|
|||
|
|
super.start()
|
|||
|
|
let into
|
|||
|
|
YJ.Measure.SetMeasureStatus(true)
|
|||
|
|
this.tip = new MouseTip('左键开始，右键取消', this.sdk)
|
|||
|
|
this.event = new MouseEvent(this.sdk)
|
|||
|
|
let clickNum = 0
|
|||
|
|
this.circle_id = this.randomString() //圆id
|
|||
|
|
let radius_points = []
|
|||
|
|
let cache_points = []
|
|||
|
|
let radius = 1 //默认半径
|
|||
|
|
let positions = []
|
|||
|
|
let center = {}
|
|||
|
|
let endpoint = null
|
|||
|
|
|
|||
|
|
this.event.mouse_left((movement, cartesian) => {
|
|||
|
|
if(into === '2D') {
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
into = '3D'
|
|||
|
|
this.tip.set_text('再次左键，完成绘制；右键取消')
|
|||
|
|
clickNum++
|
|||
|
|
if (clickNum === 1) {
|
|||
|
|
this.point_id = this.create_point(cartesian)
|
|||
|
|
center = this.cartesian3Towgs84(cartesian, this.viewer)
|
|||
|
|
positions = this.createCircle(center, 0.01)
|
|||
|
|
cache_points.push(cartesian)
|
|||
|
|
createCirclePolygon()
|
|||
|
|
}
|
|||
|
|
if (clickNum === 2) {
|
|||
|
|
radius_points = cache_points.concat(cartesian)
|
|||
|
|
endpoint = this.cartesian3Towgs84(cartesian, this.viewer)
|
|||
|
|
radius = this.computeDistance([center, endpoint])
|
|||
|
|
positions = this.createCircle(center, radius)
|
|||
|
|
this.end()
|
|||
|
|
cb(null, { center, radius: Number(radius) })
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
this.event.mouse_right((movement, cartesian) => {
|
|||
|
|
if(into === '2D') {
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.end()
|
|||
|
|
cb(false)
|
|||
|
|
})
|
|||
|
|
this.event.mouse_move((movement, cartesian) => {
|
|||
|
|
if(into === '2D') {
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.tip.setPosition(
|
|||
|
|
cartesian,
|
|||
|
|
movement.endPosition.x,
|
|||
|
|
movement.endPosition.y
|
|||
|
|
)
|
|||
|
|
if (clickNum) {
|
|||
|
|
radius_points = cache_points.concat(cartesian)
|
|||
|
|
endpoint = this.cartesian3Towgs84(cartesian, this.viewer)
|
|||
|
|
radius = this.computeDistance([center, endpoint])
|
|||
|
|
positions = this.createCircle(center, radius)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
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) {
|
|||
|
|
this.end()
|
|||
|
|
cb(false)
|
|||
|
|
}
|
|||
|
|
else {
|
|||
|
|
this.tip.set_text('再次左键，完成绘制；右键取消')
|
|||
|
|
clickNum++
|
|||
|
|
if (clickNum === 1) {
|
|||
|
|
this.point_id = this.create_point(cartesian)
|
|||
|
|
center = this.cartesian3Towgs84(cartesian, this.viewer)
|
|||
|
|
cache_points.push(cartesian)
|
|||
|
|
createCirclePolygon()
|
|||
|
|
this.tip.setPosition(
|
|||
|
|
cartesian,
|
|||
|
|
(movement.position1.x + movement.position2.x) / 2,
|
|||
|
|
(movement.position1.y + movement.position2.y) / 2
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
if (clickNum === 2) {
|
|||
|
|
radius_points = cache_points.concat(cartesian)
|
|||
|
|
endpoint = this.cartesian3Towgs84(cartesian, this.viewer)
|
|||
|
|
radius = this.computeDistance([center, endpoint])
|
|||
|
|
positions = this.createCircle(center, radius)
|
|||
|
|
this.end()
|
|||
|
|
cb(null, { center, radius: Number(radius) })
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
if (!this._is2D && this._sdk2D) {
|
|||
|
|
this.event2D = new MouseEvent(this._sdk2D)
|
|||
|
|
this.event2D.mouse_left((movement, cartesian) => {
|
|||
|
|
if(into === '3D') {
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
into = '2D'
|
|||
|
|
this.tip.set_text('再次左键，完成绘制；右键取消')
|
|||
|
|
clickNum++
|
|||
|
|
if (clickNum === 1) {
|
|||
|
|
this.point_id = this.create_point(cartesian, this._sdk2D.viewer)
|
|||
|
|
center = this.cartesian3Towgs84(cartesian, this.viewer)
|
|||
|
|
positions = this.createCircle(center, 0.01)
|
|||
|
|
cache_points.push(cartesian)
|
|||
|
|
createCirclePolygon(this._sdk2D.viewer)
|
|||
|
|
}
|
|||
|
|
if (clickNum === 2) {
|
|||
|
|
radius_points = cache_points.concat(cartesian)
|
|||
|
|
endpoint = this.cartesian3Towgs84(cartesian, this.viewer)
|
|||
|
|
radius = this.computeDistance([center, endpoint])
|
|||
|
|
positions = this.createCircle(center, radius)
|
|||
|
|
this.end()
|
|||
|
|
cb(null, { center, radius: Number(radius) })
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
this.event2D.mouse_right((movement, cartesian) => {
|
|||
|
|
if(into === '3D') {
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.end()
|
|||
|
|
cb(false)
|
|||
|
|
})
|
|||
|
|
this.event2D.mouse_move((movement, cartesian) => {
|
|||
|
|
if(into === '3D') {
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.tip.setPosition(
|
|||
|
|
cartesian,
|
|||
|
|
movement.endPosition.x + this.viewer.canvas.width,
|
|||
|
|
movement.endPosition.y
|
|||
|
|
)
|
|||
|
|
if (clickNum) {
|
|||
|
|
radius_points = cache_points.concat(cartesian)
|
|||
|
|
endpoint = this.cartesian3Towgs84(cartesian, this.viewer)
|
|||
|
|
radius = this.computeDistance([center, endpoint])
|
|||
|
|
positions = this.createCircle(center, radius)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
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) {
|
|||
|
|
this.end()
|
|||
|
|
cb(false)
|
|||
|
|
}
|
|||
|
|
else {
|
|||
|
|
this.tip.set_text('再次左键，完成绘制；右键取消')
|
|||
|
|
clickNum++
|
|||
|
|
if (clickNum === 1) {
|
|||
|
|
this.point_id = this.create_point(cartesian, this._sdk2D.viewer)
|
|||
|
|
center = this.cartesian3Towgs84(cartesian, this.viewer)
|
|||
|
|
cache_points.push(cartesian)
|
|||
|
|
createCirclePolygon(this._sdk2D.viewer)
|
|||
|
|
this.tip.setPosition(
|
|||
|
|
cartesian,
|
|||
|
|
((movement.position1.x + movement.position2.x) / 2) + this.viewer.canvas.width,
|
|||
|
|
(movement.position1.y + movement.position2.y) / 2
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
if (clickNum === 2) {
|
|||
|
|
radius_points = cache_points.concat(cartesian)
|
|||
|
|
endpoint = this.cartesian3Towgs84(cartesian, this.viewer)
|
|||
|
|
radius = this.computeDistance([center, endpoint])
|
|||
|
|
positions = this.createCircle(center, radius)
|
|||
|
|
this.end()
|
|||
|
|
cb(null, { center, radius: Number(radius) })
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
let that = this
|
|||
|
|
|
|||
|
|
function createCirclePolygon(viewer = that.viewer) {
|
|||
|
|
let a = viewer.entities.add(
|
|||
|
|
new Cesium.Entity({
|
|||
|
|
id: that.circle_id,
|
|||
|
|
position: new Cesium.CallbackProperty((e) => {
|
|||
|
|
if (endpoint) {
|
|||
|
|
let c = that.computeMidpoint(center, endpoint)
|
|||
|
|
return Cesium.Cartesian3.fromDegrees(c.lng, c.lat, endpoint.alt)
|
|||
|
|
} else {
|
|||
|
|
return Cesium.Cartesian3()
|
|||
|
|
}
|
|||
|
|
}, false),
|
|||
|
|
label: {
|
|||
|
|
text: new Cesium.CallbackProperty((e) => {
|
|||
|
|
if (radius > 1000) {
|
|||
|
|
return '半径：' + (radius / 1000).toFixed(2) + ' 公里'
|
|||
|
|
}
|
|||
|
|
return '半径：' + radius + ' 米'
|
|||
|
|
}, false),
|
|||
|
|
font: '20px Microsoft YaHei',
|
|||
|
|
distanceDisplayCondition: 10000000,
|
|||
|
|
scale: 1,
|
|||
|
|
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
|
|||
|
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
|||
|
|
fillColor: Cesium.Color.fromCssColorString('#f5ce0a'),
|
|||
|
|
style: Cesium.LabelStyle.FILL_AND_OUTLINE
|
|||
|
|
},
|
|||
|
|
polygon: {
|
|||
|
|
classificationType: Cesium.ClassificationType.BOTH,
|
|||
|
|
hierarchy: new Cesium.CallbackProperty((e) => {
|
|||
|
|
return new Cesium.PolygonHierarchy(
|
|||
|
|
Cesium.Cartesian3.fromDegreesArray(positions)
|
|||
|
|
)
|
|||
|
|
}, false),
|
|||
|
|
material: Cesium.Color.fromCssColorString(that.color),
|
|||
|
|
zIndex: 99999999
|
|||
|
|
},
|
|||
|
|
polyline: {
|
|||
|
|
positions: new Cesium.CallbackProperty((e) => {
|
|||
|
|
return radius_points
|
|||
|
|
}, false),
|
|||
|
|
width: 2,
|
|||
|
|
material:
|
|||
|
|
Cesium.Color.fromCssColorString('#c1c505').withAlpha(0.5),
|
|||
|
|
clampToGround: true,
|
|||
|
|
zIndex: 99999999
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
end() {
|
|||
|
|
this.remove_entity(this.circle_id)
|
|||
|
|
this.remove_entity(this.point_id)
|
|||
|
|
YJ.Measure.SetMeasureStatus(false)
|
|||
|
|
this.tip && this.tip.destroy()
|
|||
|
|
this.event && this.event.destroy()
|
|||
|
|
this.event2D && this.event2D.destroy()
|
|||
|
|
}
|
|||
|
|
}
|