|
|
|
|
@ -2,7 +2,7 @@
|
|
|
|
|
* @Author: cbwu 504-wuchengbo@htsdfp.com
|
|
|
|
|
* @Date: 2024-03-27 08:43:44
|
|
|
|
|
* @LastEditors: cbwu
|
|
|
|
|
* @LastEditTime: 2024-04-13 10:46:58
|
|
|
|
|
* @LastEditTime: 2024-04-16 14:25:43
|
|
|
|
|
* @Description: 绘制Polyline类
|
|
|
|
|
*/
|
|
|
|
|
import {
|
|
|
|
|
@ -14,8 +14,12 @@ import {
|
|
|
|
|
Entity,
|
|
|
|
|
CallbackProperty,
|
|
|
|
|
PolylineDashMaterialProperty,
|
|
|
|
|
HeightReference,
|
|
|
|
|
} from 'cesium'
|
|
|
|
|
import { cartesian2ToCartesian3 } from '@/utils/map/coordinate'
|
|
|
|
|
import {
|
|
|
|
|
cartesian2ToCartesian3,
|
|
|
|
|
cartesian3ToWGS84,
|
|
|
|
|
} from '@/utils/map/coordinate'
|
|
|
|
|
// import { PointEntity, PolylineEntity } from '@/utils/map/geometry'
|
|
|
|
|
import { PolylineEntity } from '../geometry/polylineEntity'
|
|
|
|
|
import { PointEntity } from '@/utils/map/geometry/pointEntity'
|
|
|
|
|
@ -46,6 +50,8 @@ export default class CreatePolyline {
|
|
|
|
|
bMove: boolean = false
|
|
|
|
|
bLongClick: boolean = false
|
|
|
|
|
clickTimeout: any
|
|
|
|
|
altitudeOffset: number = 20 //相对高度
|
|
|
|
|
vDashLinePosition: Cartesian3[][] = [] //垂直辅助线坐标数组
|
|
|
|
|
// layer: CustomDataSource
|
|
|
|
|
defaultStyle: EntityOptions = {
|
|
|
|
|
// id: 'Polyline' + String(PolylineEntity.id),
|
|
|
|
|
@ -102,11 +108,11 @@ export default class CreatePolyline {
|
|
|
|
|
pickedObject.id.id ===
|
|
|
|
|
this.polyline?.controlPointsID[this.positions.length - 1]
|
|
|
|
|
) {
|
|
|
|
|
console.log('********click the same point')
|
|
|
|
|
return
|
|
|
|
|
// console.log('********click the same point')
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
const cartesian3 = cartesian2ToCartesian3(this.viewer, event.position)
|
|
|
|
|
let cartesian3 = cartesian2ToCartesian3(this.viewer, event.position)
|
|
|
|
|
if (cartesian3 != undefined) {
|
|
|
|
|
if (!this.polyline) {
|
|
|
|
|
this.polyline = new PolylineEntity(this.positions)
|
|
|
|
|
@ -114,8 +120,24 @@ export default class CreatePolyline {
|
|
|
|
|
this.viewer.entities.add(this.dashLine)
|
|
|
|
|
this.viewer.dataSources.add(this.polyline)
|
|
|
|
|
}
|
|
|
|
|
const oldPosition = cartesian3
|
|
|
|
|
//计算高度偏移后的新坐标
|
|
|
|
|
cartesian3 = this.calculateAltitudeOffsetPosition(
|
|
|
|
|
cartesian3,
|
|
|
|
|
this.altitudeOffset,
|
|
|
|
|
)
|
|
|
|
|
this.polyline.addPoint(cartesian3)
|
|
|
|
|
this.trackingLinePositions[0] = cartesian3
|
|
|
|
|
//垂直辅助线
|
|
|
|
|
const n = this.positions.length - 1
|
|
|
|
|
const ptArr = [oldPosition, cartesian3]
|
|
|
|
|
this.vDashLinePosition[n] = ptArr
|
|
|
|
|
this.viewer.entities.add(
|
|
|
|
|
this.createTrackingLine(this.vDashLinePosition[n], Color.WHITE),
|
|
|
|
|
)
|
|
|
|
|
//添加地表控制点
|
|
|
|
|
const groundControlPoint = new PointEntity(this.vDashLinePosition[n][0])
|
|
|
|
|
this.viewer.entities.add(groundControlPoint)
|
|
|
|
|
this.bMove = true
|
|
|
|
|
|
|
|
|
|
this.viewer.scene.requestRender() //刷新
|
|
|
|
|
@ -124,8 +146,13 @@ export default class CreatePolyline {
|
|
|
|
|
// 移动回调事件
|
|
|
|
|
private moveCallBack = (event: ScreenSpaceEventHandler.MotionEvent) => {
|
|
|
|
|
if (this.bMove) {
|
|
|
|
|
const cartesian3 = cartesian2ToCartesian3(this.viewer, event.endPosition)
|
|
|
|
|
let cartesian3 = cartesian2ToCartesian3(this.viewer, event.endPosition)
|
|
|
|
|
if (cartesian3 != undefined) {
|
|
|
|
|
//计算高度偏移后的新坐标
|
|
|
|
|
cartesian3 = this.calculateAltitudeOffsetPosition(
|
|
|
|
|
cartesian3,
|
|
|
|
|
this.altitudeOffset,
|
|
|
|
|
)
|
|
|
|
|
//更新追踪线坐标
|
|
|
|
|
this.trackingLinePositions[1] = cartesian3
|
|
|
|
|
if (!this.trackingLine) {
|
|
|
|
|
@ -159,6 +186,7 @@ export default class CreatePolyline {
|
|
|
|
|
this.clearEvent()
|
|
|
|
|
console.log('end:' + this.positions.length.toString())
|
|
|
|
|
console.log(this.positions)
|
|
|
|
|
console.log(this.polyline.controlPointsID.length)
|
|
|
|
|
//结束绘制进入编辑模式
|
|
|
|
|
this.polyline.removeControlPoints()
|
|
|
|
|
const editTool = new EditGeometry(this.viewer, this.polyline.geometry!)
|
|
|
|
|
@ -178,8 +206,21 @@ export default class CreatePolyline {
|
|
|
|
|
this.handler.removeInputAction(ScreenSpaceEventType.MOUSE_MOVE)
|
|
|
|
|
this.handler.removeInputAction(ScreenSpaceEventType.LEFT_DOUBLE_CLICK)
|
|
|
|
|
}
|
|
|
|
|
//计算高度偏移后的坐标
|
|
|
|
|
calculateAltitudeOffsetPosition(
|
|
|
|
|
oldPosition: Cartesian3,
|
|
|
|
|
altitudeOffset: number,
|
|
|
|
|
): Cartesian3 {
|
|
|
|
|
const newGeoPosition = cartesian3ToWGS84(oldPosition)
|
|
|
|
|
newGeoPosition[2] = newGeoPosition[2] + altitudeOffset
|
|
|
|
|
return Cartesian3.fromDegrees(
|
|
|
|
|
newGeoPosition[0],
|
|
|
|
|
newGeoPosition[1],
|
|
|
|
|
newGeoPosition[2],
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
//创建追踪线
|
|
|
|
|
createTrackingLine(positions: Cartesian3[]) {
|
|
|
|
|
createTrackingLine(positions: Cartesian3[], color: Color = Color.GREEN) {
|
|
|
|
|
return new Entity({
|
|
|
|
|
polyline: {
|
|
|
|
|
positions: new CallbackProperty(() => {
|
|
|
|
|
@ -187,10 +228,10 @@ export default class CreatePolyline {
|
|
|
|
|
}, false),
|
|
|
|
|
width: 2,
|
|
|
|
|
material: new PolylineDashMaterialProperty({
|
|
|
|
|
color: Color.GREEN,
|
|
|
|
|
dashLength: 15, //短划线长度
|
|
|
|
|
color: color,
|
|
|
|
|
dashLength: 12, //短划线长度
|
|
|
|
|
}),
|
|
|
|
|
clampToGround: true,
|
|
|
|
|
// clampToGround: true,
|
|
|
|
|
},
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
|
