diff --git a/src/utils/map/draw/drawPolyline.ts b/src/utils/map/draw/drawPolyline.ts index 9482c4a..f8903df 100644 --- a/src/utils/map/draw/drawPolyline.ts +++ b/src/utils/map/draw/drawPolyline.ts @@ -2,7 +2,7 @@ * @Author: cbwu 504-wuchengbo@htsdfp.com * @Date: 2024-03-27 08:43:44 * @LastEditors: cbwu - * @LastEditTime: 2024-04-22 11:23:47 + * @LastEditTime: 2024-04-22 16:19:27 * @Description: 绘制Polyline类 */ import { diff --git a/src/utils/map/draw/editGeometry.ts b/src/utils/map/draw/editGeometry.ts index 06cfb0b..2f8729c 100644 --- a/src/utils/map/draw/editGeometry.ts +++ b/src/utils/map/draw/editGeometry.ts @@ -2,7 +2,7 @@ * @Author: cbwu 504-wuchengbo@htsdfp.com * @Date: 2024-03-27 11:06:45 * @LastEditors: cbwu - * @LastEditTime: 2024-04-13 10:47:09 + * @LastEditTime: 2024-04-22 16:49:15 * @Description: 编辑几何体类。操作逻辑 */ import { @@ -16,6 +16,10 @@ import { Entity, ConstantPositionProperty, defined, + CallbackProperty, + PolylineDashMaterialProperty, + Color, + Cartographic, } from 'cesium' import { cartesian2ToCartesian3 } from '@/utils/map/coordinate' import { getClosestPoint, isOnLineSegment } from '@/utils/map/geocomputation' @@ -26,8 +30,12 @@ export default class EditGeometry { geometry: Entity //要编辑的几何对象 oldPositions: Cartesian3[] = [] //存储未修改前的坐标 positions: Cartesian3[] = [] //要编辑的几个对象坐标 - controlPointsID: string[] = [] - controlPoint: PointEntity | null = null + controlPointsID: string[] = [] //节点控制点ID数组 + groundPointsID: string[] = [] //地表控制点ID数组 + groundDashLineID: string[] = [] //垂直辅助线ID数组 + groundDashLinesPosition: Cartesian3[][] = [] //垂直辅助线坐标数组 + heightPoint: PointEntity | null = null //高度控制点 + groundPoint: PointEntity | null = null //地表控制点 clickedGeometry: Entity | null = null clickDownPosition: Cartesian3 | null = null moveSelectedPoint: PointEntity | null = null @@ -46,6 +54,13 @@ export default class EditGeometry { // 创建控制点 this.positions.forEach((value, index) => { this.createPoint(value, index) + //地表点 + const groundPosition = this.calculateGroundPosition(value) + this.createGroundPoint(value, index) + //垂直辅助线 + const ptArr = [value, groundPosition] + this.groundDashLinesPosition[index] = ptArr + this.createGroundDashLine(this.groundDashLinesPosition[index], index) }) } public start() { @@ -86,7 +101,7 @@ export default class EditGeometry { ) => { // 清除可能已经设置的单击定时器 clearTimeout(this.clickTimeout) - // 判断是不是长按 + // 判断是不是长按(100ms) this.clickTimeout = setTimeout(() => { this.bLongClick = true }, 100) @@ -111,8 +126,14 @@ export default class EditGeometry { // 点中控制点 if (pickedObject.id.point instanceof PointGraphics) { console.log('You clicked a point entity.') - this.controlPoint = pickedObject.id - console.log(this.controlPoint?.subId) + if (pickedObject.id.point.type === 0) { + console.log('You clicked a HeightPoint entity.') + this.heightPoint = pickedObject.id + } else if (pickedObject.id.point.type === 1) { + console.log('You clicked a GroundPoint entity.') + this.groundPoint = pickedObject.id + } + // console.log(this.heightPoint?.subId) this.bDrag = true this.forbidDrawWorld(true) } @@ -134,7 +155,7 @@ export default class EditGeometry { ) { this.moveSelectedPoint = pickedObject.id this.moveSelectedPoint!.point!.pixelSize = new ConstantProperty( - this.moveSelectedPoint!.options.pixelSize! + 2, + this.moveSelectedPoint!.options.pixelSize! + 1, ) // console.log(this.moveSelectedPoint) } @@ -144,19 +165,19 @@ export default class EditGeometry { // 离开控制点恢复原始大小 if (this.moveSelectedPoint) { this.moveSelectedPoint!.point!.pixelSize = new ConstantProperty( - this.moveSelectedPoint!.options.pixelSize! - 2, + this.moveSelectedPoint!.options.pixelSize! - 1, ) this.moveSelectedPoint = null this.viewer.scene.requestRender() //刷新 } } - if (!this.controlPoint || !this.bDrag) return + if (!this.heightPoint || !this.bDrag) return console.log('************************left down') const cartesian3 = cartesian2ToCartesian3(this.viewer, event.endPosition) if (cartesian3) { // 修改节点坐标 - this.modifyPoint(cartesian3, this.controlPoint.subId) + this.modifyPoint(cartesian3, this.heightPoint.subId) // this.geometry?.modifyPoint(cartesian3, this.controlPoint.subId) this.viewer.scene.requestRender() //刷新 } @@ -230,10 +251,10 @@ export default class EditGeometry { // 修改线坐标 this.positions.splice(index, 1, pos) // 修改控制点坐标 - this.controlPoint!.position = new ConstantPositionProperty(pos) + this.heightPoint!.position = new ConstantPositionProperty(pos) } /** - * 新加一个点 + * 新加一个节点 * @param pos 点的坐标 * @param index 插入的位置,0起步 */ @@ -246,4 +267,48 @@ export default class EditGeometry { this.controlPointsID.splice(index, 0, point.id) // } } + /** + * 新加一个地表控制点 + * @param pos 点的坐标 + * @param index 插入的位置,0起步 + */ + createGroundPoint(pos: Cartesian3, index: number) { + const point = new PointEntity(pos) + point.parent = this.geometry + point.subId = index + point.type = 1 + this.geometry.entityCollection.add(point) + this.groundPointsID.splice(index, 0, point.id) + } + /** + * 新加一个垂直地表的辅助线 + * @param pos 直线的坐标 + * @param index 插入的位置,0起步 + */ + createGroundDashLine(positions: Cartesian3[], index: number) { + const vDashLine = new Entity({ + polyline: { + positions: new CallbackProperty(() => { + return positions + }, false), + width: 2, + material: new PolylineDashMaterialProperty({ + color: Color.WHITE, + dashLength: 12, //短划线长度 + }), + }, + }) + this.groundDashLineID.splice(index, 0, vDashLine.id) + this.geometry.entityCollection.add(vDashLine) + } + //获取地表坐标 + calculateGroundPosition(pos: Cartesian3) { + // 输入的当前点的笛卡尔坐标 + const cartographic = Cartographic.fromCartesian(pos) + // 经度、纬度不变,将地面高度加上需要上升的距离, 假设垂直升高1000米 + cartographic.height -= cartographic.height + + // 最后使用Cesium.Cartographic.toCartesian将刚才得到的Cartographic对象转换为笛卡尔坐标 + return Cartographic.toCartesian(cartographic) + } } diff --git a/src/utils/map/geometry/pointEntity.ts b/src/utils/map/geometry/pointEntity.ts index c36a8be..a3988fe 100644 --- a/src/utils/map/geometry/pointEntity.ts +++ b/src/utils/map/geometry/pointEntity.ts @@ -18,6 +18,7 @@ import { EntityOptions } from '@/types/entityoptions' class PointEntity extends Entity { static ID: number = 0 public subId: number = 0 //用于作为其他几何体的控制点时标记节点号 + public type: number = 0 //用于判断是线上节点(0)还是地表控制点(1) options: EntityOptions = { id: 'Point' + String(PointEntity.ID), name: 'Point' + String(PointEntity.ID + 1),