|
|
|
@ -20,6 +20,9 @@ import { cartesian2ToCartesian3 } from '@/utils/map/coordinate'
|
|
|
|
|
import { PolylineEntity } from '../geometry/polylineEntity'
|
|
|
|
|
import { PointEntity } from '@/utils/map/geometry/pointEntity'
|
|
|
|
|
import EditGeometry from '@/utils/map/draw/editGeometry'
|
|
|
|
|
import {getDistance} from "@/utils/map/geocomputation.ts";
|
|
|
|
|
import {Angle} from "@/utils/map/angle.ts";
|
|
|
|
|
import {TextLabel} from "@/utils/map/geometry/textLabel.ts";
|
|
|
|
|
type EntityOptions = {
|
|
|
|
|
id?: string
|
|
|
|
|
name?: string
|
|
|
|
@ -44,6 +47,8 @@ export default class CreatePolyline {
|
|
|
|
|
moveSelectedPoint: PointEntity | null = null
|
|
|
|
|
positions: Cartesian3[] = []
|
|
|
|
|
bMove: boolean = false
|
|
|
|
|
bMeasure: boolean | undefined = false //是否处于测距模式
|
|
|
|
|
totalDistance: number = 0
|
|
|
|
|
bLongClick: boolean = false
|
|
|
|
|
clickTimeout: any
|
|
|
|
|
// layer: CustomDataSource
|
|
|
|
@ -54,13 +59,14 @@ export default class CreatePolyline {
|
|
|
|
|
width: 2,
|
|
|
|
|
color: Color.GREEN,
|
|
|
|
|
}
|
|
|
|
|
constructor(viewer: Viewer, options?: EntityOptions) {
|
|
|
|
|
constructor(viewer: Viewer, bMeasure: boolean=false,options?: EntityOptions) {
|
|
|
|
|
this.viewer = viewer
|
|
|
|
|
this.bMeasure = bMeasure;
|
|
|
|
|
this.handler = new ScreenSpaceEventHandler(this.viewer.scene.canvas)
|
|
|
|
|
this.polyline = null
|
|
|
|
|
this.trackingLine = null
|
|
|
|
|
this.dashLine = null
|
|
|
|
|
|
|
|
|
|
this.totalDistance = 0
|
|
|
|
|
this.controlPoints = []
|
|
|
|
|
this.defaultStyle = { ...this.defaultStyle, ...options }
|
|
|
|
|
}
|
|
|
|
@ -90,21 +96,14 @@ export default class CreatePolyline {
|
|
|
|
|
public end() {
|
|
|
|
|
this.handler.removeInputAction(ScreenSpaceEventType.LEFT_CLICK)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//左单击回调事件
|
|
|
|
|
private leftClickCallBack = (
|
|
|
|
|
event: ScreenSpaceEventHandler.PositionedEvent,
|
|
|
|
|
) => {
|
|
|
|
|
private leftClickCallBack = (event: ScreenSpaceEventHandler.PositionedEvent) => {
|
|
|
|
|
const pickedObject = this.viewer.scene.pick(event.position)
|
|
|
|
|
// console.log(pickedObject)
|
|
|
|
|
if (pickedObject) {
|
|
|
|
|
//点击同一位置,返回
|
|
|
|
|
if (
|
|
|
|
|
pickedObject.id.id ===
|
|
|
|
|
this.polyline?.controlPointsID[this.positions.length - 1]
|
|
|
|
|
) {
|
|
|
|
|
if (pickedObject.id.id === this.polyline?.controlPointsID[this.positions.length - 1])
|
|
|
|
|
return
|
|
|
|
|
// console.log('********click the same point')
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
const cartesian3 = cartesian2ToCartesian3(this.viewer, event.position)
|
|
|
|
|
if (cartesian3 != undefined) {
|
|
|
|
@ -117,8 +116,19 @@ export default class CreatePolyline {
|
|
|
|
|
this.polyline.addPoint(cartesian3)
|
|
|
|
|
this.trackingLinePositions[0] = cartesian3
|
|
|
|
|
this.bMove = true
|
|
|
|
|
|
|
|
|
|
this.viewer.scene.requestRender() //刷新
|
|
|
|
|
// 计算2点距离
|
|
|
|
|
if(this.positions.length>=2 && this.bMeasure){
|
|
|
|
|
let distance = getDistance(this.positions[this.positions.length-1],this.positions[this.positions.length-2])
|
|
|
|
|
this.totalDistance += distance
|
|
|
|
|
// 计算2点方位角
|
|
|
|
|
let azimuth = Angle.getAzimuth(this.positions[this.positions.length-2],this.positions[this.positions.length-1])
|
|
|
|
|
// 计算2点的中间点
|
|
|
|
|
let midPoint = Cartesian3.midpoint(this.positions[this.positions.length-1],this.positions[this.positions.length-2],new Cartesian3())
|
|
|
|
|
// 添加label
|
|
|
|
|
let labelText = `距离: ${distance.toFixed(2)}km, 方位角: ${azimuth}°`
|
|
|
|
|
new TextLabel(this.viewer, midPoint,labelText)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// 移动回调事件
|
|
|
|
@ -140,13 +150,8 @@ export default class CreatePolyline {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// 左双击回调事件
|
|
|
|
|
private leftDoubleClickCallBack = (
|
|
|
|
|
event: ScreenSpaceEventHandler.PositionedEvent,
|
|
|
|
|
) => {
|
|
|
|
|
// 清除可能已经设置的单击定时器
|
|
|
|
|
// clearTimeout(this.clickTimeout)
|
|
|
|
|
private leftDoubleClickCallBack = (event: ScreenSpaceEventHandler.PositionedEvent,) => {
|
|
|
|
|
if (!this.polyline) return
|
|
|
|
|
console.log('**************************** double click')
|
|
|
|
|
this.bMove = false
|
|
|
|
|
const cartesian3 = cartesian2ToCartesian3(this.viewer, event.position)
|
|
|
|
|
if (cartesian3 != undefined) {
|
|
|
|
@ -156,9 +161,12 @@ export default class CreatePolyline {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if(this.bMeasure){
|
|
|
|
|
// 添加总距离label
|
|
|
|
|
new TextLabel(this.viewer,this.positions[this.positions.length-1],
|
|
|
|
|
`总距离: ${this.totalDistance.toFixed(2)}km`)
|
|
|
|
|
}
|
|
|
|
|
this.clearEvent()
|
|
|
|
|
console.log('end:' + this.positions.length.toString())
|
|
|
|
|
console.log(this.positions)
|
|
|
|
|
//结束绘制进入编辑模式
|
|
|
|
|
this.polyline.removeControlPoints()
|
|
|
|
|
const editTool = new EditGeometry(this.viewer, this.polyline.geometry!)
|
|
|
|
@ -173,7 +181,8 @@ export default class CreatePolyline {
|
|
|
|
|
this.viewer.entities.remove(this.controlPoints.pop() as Entity)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
clearEvent() {
|
|
|
|
|
|
|
|
|
|
private clearEvent() {
|
|
|
|
|
this.handler.removeInputAction(ScreenSpaceEventType.LEFT_CLICK)
|
|
|
|
|
this.handler.removeInputAction(ScreenSpaceEventType.MOUSE_MOVE)
|
|
|
|
|
this.handler.removeInputAction(ScreenSpaceEventType.LEFT_DOUBLE_CLICK)
|
|
|
|
|