/*
|
* @Author: shuishen 1109946754@qq.com
|
* @Date: 2022-10-18 17:17:50
|
* @LastEditors: shuishen 1109946754@qq.com
|
* @LastEditTime: 2022-10-19 14:37:23
|
* @FilePath: \srs-police-affairs\src\utils\drawPolygon.js
|
* @Description:
|
*
|
* Copyright (c) 2022 by shuishen 1109946754@qq.com, All Rights Reserved.
|
*/
|
|
function measureAreaSpace () {
|
// 清除双击事件
|
global.viewer.on(global.DC.MouseEventType.DB_CLICK, e => {
|
return
|
})
|
|
// 添加面图层
|
let drawPolygonLayer = new global.DC.VectorLayer('drawPolygonLayer')
|
global.viewer.addLayer(drawPolygonLayer)
|
|
// 添加点图层
|
let drawPointLayer = new global.DC.VectorLayer('drawPointLayer')
|
global.viewer.addLayer(drawPointLayer)
|
|
global.viewer.tooltip.enable = true
|
|
let activeShapePoints = []
|
|
// 绘制多边形
|
function drawShape (positionData) {
|
let shape
|
shape = global.viewer.entities.add({
|
polygon: {
|
hierarchy: positionData,
|
material: new global.DC.Namespace.Cesium.ColorMaterialProperty(
|
global.DC.Namespace.Cesium.Color.NAVAJOWHITE.withAlpha(0.7)
|
),
|
}
|
})
|
|
return shape
|
}
|
|
let activeShape
|
|
// 注册事件
|
global.viewer.on(global.DC.MouseEventType.CLICK, leftEvent)
|
global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, moveEvent)
|
global.viewer.on(global.DC.MouseEventType.RIGHT_CLICK, rightEvent)
|
|
// 左键事件
|
let leftEvent = event => {
|
|
let point = new global.DC.Point(new global.DC.Position(event.wgs84SurfacePosition.lng, event.wgs84SurfacePosition.lat))
|
|
point.setStyle({
|
pixelSize: 10,
|
color: global.DC.Color.RED, //颜色
|
outlineColor: global.DC.Color.WHITE, //边框颜色
|
outlineWidth: 2, //边框大小,
|
})
|
|
drawPointLayer.addOverlay(point)
|
|
if (activeShapePoints.length === 0) {
|
activeShapePoints.push(event.surfacePosition)
|
|
const dynamicPositions = new global.DC.Namespace.Cesium.CallbackProperty(function () {
|
return new global.DC.Namespace.Cesium.PolygonHierarchy(activeShapePoints)
|
}, false)
|
|
activeShape = drawShape(dynamicPositions)
|
}
|
|
activeShapePoints.push(event.surfacePosition)
|
}
|
|
// 移动事件
|
let moveEvent = event => {
|
|
global.viewer.tooltip.showAt(event.windowPosition, '左击选择点位,右击结束')
|
|
if (activeShapePoints.length >= 2) {
|
activeShapePoints.pop()
|
|
activeShapePoints.push(event.surfacePosition)
|
}
|
|
}
|
|
// 右键事件
|
let rightEvent = event => {
|
|
if (activeShapePoints.length < 4) {
|
global.viewer.tooltip.showAt(event.windowPosition, '不能绘制成面,请继续添加点')
|
return
|
}
|
|
terminateShape()
|
|
}
|
|
function terminateShape () {
|
activeShapePoints.pop()
|
drawShape(activeShapePoints)
|
global.viewer.entities.remove(activeShape)
|
|
drawPointLayer.clear()
|
drawPointLayer.remove()
|
drawPointLayer = null
|
|
activeShape = undefined
|
activeShapePoints = []
|
|
global.viewer.tooltip.enable = false
|
}
|
|
}
|
|
export default measureAreaSpace
|