/* * @Author: cbwu 504-wuchengbo@htsdfp.com * @Date: 2024-03-28 09:14:45 * @LastEditors: cbwu * @LastEditTime: 2024-03-28 17:40:14 * @Description: 封装的几何类型类 */ import { Entity, EntityCollection, Cartesian3, Color, PrimitiveCollection, PointPrimitiveCollection, PolylineGeometry, PointGraphics, Property, PositionProperty, LabelGraphics, PolylineGraphics, PolygonGraphics, Cartesian2, ConstantPositionProperty, CallbackProperty, } from 'cesium' type EntityOptions = { id?: string name?: string show?: boolean pixelSize?: number outlineColor?: Color color?: Color fillColor?: Color fill?: boolean width?: number outlineWidth?: number text?: string font?: string pixelOffset?: Cartesian2 } // 点 class PointEntity extends Entity { static ID: number = 0 public subId: number = 0 //用于作为其他几何体的控制点时标记节点号 options: EntityOptions = { id: 'Point' + String(PointEntity.ID), name: 'Point' + String(PointEntity.ID + 1), show: true, pixelSize: 10, color: Color.GREEN, outlineWidth: 0, } constructor( position: PositionProperty | Cartesian3, options?: EntityOptions, ) { super({ position: position, }) this.options = { ...this.options, ...options } //点对象 this.point = new PointGraphics({ pixelSize: this.options.pixelSize, color: this.options.color, outlineColor: this.options.outlineColor, outlineWidth: this.options.outlineWidth, }) // 标注对象 this.label = new LabelGraphics({ text: this.options.text, font: this.options.font, pixelOffset: this.options.pixelOffset, }) PointEntity.ID++ } } // 线 class PolylineEntity extends EntityCollection { static ID: number = 0 positions: Cartesian3[] = [] controlPointsID: string[] = [] options: EntityOptions = { id: 'Polyline' + String(PolylineEntity.ID), name: 'Polyline' + String(PolylineEntity.ID + 1), show: true, width: 2, color: Color.GREEN, } constructor(ptArr: Cartesian3[], options?: EntityOptions) { super() this.options = { ...this.options, ...options } this.positions = ptArr const polyline = new Entity({ name: this.options.name, polyline: { positions: new CallbackProperty(() => { return this.positions }, false), show: this.options.show, width: this.options.width, material: this.options.color, }, }) this.add(polyline) ptArr.forEach((pt, index) => { this.createPoint(pt, index) }) PolylineEntity.ID++ } /** * 新增一个节点,默认插入在尾部, * @param pos 点坐标 * @param index 插入的位置,0起步 */ public addPoint(pos: Cartesian3, index: number = -1) { if (index === -1) { //插入尾部 this.positions.push(pos) this.createPoint(pos, this.positions.length - 1) } else if (index >= 0 && index < this.positions.length) { this.positions.splice(index, 0, pos) this.createPoint(pos, index) } else { return } } /** * 移除点 * @param index 移除点的位置 * @returns */ public removePoint(index: number = -1) { if (index === -1 || index === this.positions.length - 1) { //移除尾部元素 this.positions.pop() } else if (index >= 0 && index < this.positions.length) { this.positions.splice(index, 1) this.removeById(this.controlPointsID[index]) this.controlPointsID.splice(index, 1) } else { return } } /** * 修改某点的坐标 * @param pos 修改点的坐标 * @param index 修改点的位置 */ public modifyPoint(pos: Cartesian3, index: number) { if (index >= 0 && index < this.positions.length) { this.positions.splice(index, 1, pos) //修改控制点坐标 const point = this.getById(this.controlPointsID[index]) if (point) { point.position = new ConstantPositionProperty(pos) } } } /** * 新加一个点 * @param pos 点的坐标 * @param index 插入的位置,0起步 */ createPoint(pos: Cartesian3, index: number) { const point = new PointEntity(pos) point.subId = index + 1 this.add(point) this.controlPointsID.splice(index, 0, point.id) } } // 多边形 class PolygonEntity extends Entity { static id: number = 0 options: EntityOptions = { id: 'Polygon' + String(PolygonEntity.id), name: 'Polygon' + String(PolygonEntity.id + 1), show: true, width: 2, color: Color.RED, fillColor: Color.RED.withAlpha(0.5), fill: true, } constructor(ptArr: Cartesian3[] | Property, options?: EntityOptions) { super({ // id: options?.id || String(PolygonEntity.id), }) this.options = { ...this.options, ...options } this.name = this.options.name this.polygon = new PolygonGraphics({ show: this.options.show, hierarchy: ptArr, material: this.options.fillColor, //填充颜色 fill: this.options.fill, //是否填充 outlineWidth: this.options.width, //线宽 outlineColor: this.options.color, //线颜色 }) PolygonEntity.id++ } } // 线 class Polyline extends PrimitiveCollection { constructor(ptArr: Cartesian3[]) { super() this.add(this.createPoints(ptArr)) this.add(this.createPolyline(ptArr)) // this.id } private createPoints(posArr: Cartesian3[]) { const points = new PointPrimitiveCollection() for (const pos in posArr) { points.add({ position: pos, color: Color.RED, pixelSize: 10, }) } return points } private createPolyline(posArr: Cartesian3[]) { return new PolylineGeometry({ positions: posArr, width: 2, colors: new Array(posArr.length).fill(Color.fromCssColorString('green')), }) } } export { PointEntity, Polyline, PolylineEntity, PolygonEntity }