forked from drone/command-center-dashboard

罗广辉
2025-04-02 e1699c4851f6ca397cd0ad1ff63f32c737654836
src/utils/cesium/frustum/CreateFrustum.js
@@ -1,59 +1,59 @@
// * 创建视锥
import * as Cesium from 'cesium';
import * as Cesium from 'cesium'
/* eslint-disable new-cap */
/* eslint-disable no-undef */
export default class CreateFrustum {
  constructor(viewer, options) {
    this.position = options.position;
    this.viewer = viewer;
    this.fov = options.fov || 0;
    this.near = options.near || 0;
    this.far = options.far || 0;
    this.heading = options.heading || 0;
    this.pitch = options.pitch || 0;
    this.roll = options.roll || 0;
    this.width = options.width;
    this.height = options.height;
    this.add();
      this.position = options.position
      this.viewer = viewer
      this.fov = options.fov || 0
      this.near = options.near || 0
      this.far = options.far || 0
      this.heading = options.heading || 0
      this.pitch = options.pitch || 0
      this.roll = options.roll || 0
      this.width = options.width
      this.height = options.height
      this.add()
  }
  UpdateWidth(value) {
    this.width = value;
    this.add();
      this.width = value
      this.add()
  }
  UpdateHeight(value) {
    this.height = value;
    this.add();
      this.height = value
      this.add()
  }
  UpdateFov(value) {
    this.fov = value;
    this.add();
      this.fov = value
      this.add()
  }
  UpdateNear(value) {
    this.near = value;
    this.add();
      this.near = value
      this.add()
  }
  UpdateFar(value) {
    this.far = value;
    this.add();
      this.far = value
      this.add()
  }
  UpdateHeading(value) {
    this.heading = value;
    this.add();
      this.heading = value
      this.add()
  }
  UpdatePitch(value) {
    this.pitch = value;
    this.add();
      this.pitch = value
      this.add()
  }
  UpdateRoll(value) {
    this.roll = value;
    this.add();
      this.roll = value
      this.add()
  }
  UpdataPosition(position) {
    if (!position) return;
    this.position = position;
    this.add();
      if (!position) return
      this.position = position
      this.add()
  }
  // 更新视锥体的姿态
@@ -61,55 +61,55 @@
    this.position = Cesium.Cartesian3.fromDegrees(
      position.longitude,
      position.latitude,
      position.altitude,
    );
         position.altitude
      )
    this.orientation = Cesium.Transforms.headingPitchRollQuaternion(
      this.position,
      new Cesium.HeadingPitchRoll.fromDegrees(
        headingPitchRoll.heading,
        headingPitchRoll.pitch,
        headingPitchRoll.roll,
      ),
    );
    this.add();
            headingPitchRoll.roll
         )
      )
      this.add()
  }
  // 创建视锥体和轮廓线
  add() {
    this.clear();
    this.addFrustum();
    this.addOutline();
    this.addCenterline();
      this.clear()
      this.addFrustum()
      this.addOutline()
      this.addCenterline()
  }
  // 清除视锥体和轮廓线
  clear() {
    this.clearFrustum();
    this.clearOutline();
    this.clearCenterline();
      this.clearFrustum()
      this.clearOutline()
      this.clearCenterline()
  }
  // 清除视锥体
  clearFrustum() {
    if (this.frustumPrimitive) {
      this.viewer.scene.primitives.remove(this.frustumPrimitive);
      this.frustumPrimitive = null;
         this.viewer.scene.primitives.remove(this.frustumPrimitive)
         this.frustumPrimitive = null
    }
  }
  // 清除轮廓线
  clearOutline() {
    if (this.outlinePrimitive) {
      this.viewer.scene.primitives.remove(this.outlinePrimitive);
      this.outlinePrimitive = null;
         this.viewer.scene.primitives.remove(this.outlinePrimitive)
         this.outlinePrimitive = null
    }
  }
  clearCenterline() {
    if (this.centerDataSource) {
      this.centerDataSource.entities.removeAll();
      this.viewer.dataSources.remove(this.centerDataSource);
      this.centerDataSource = null;
         this.centerDataSource.entities.removeAll()
         this.viewer.dataSources.remove(this.centerDataSource)
         this.centerDataSource = null
    }
  }
@@ -124,33 +124,29 @@
      near: this.near,
      // 远面距视点的距离
      far: this.far,
    });
      })
    const position = Cesium.Cartesian3.fromDegrees(
      this.position.longitude,
      this.position.latitude,
      this.position.altitude,
    );
         this.position.altitude
      )
    const geometry = new Cesium.FrustumGeometry({
      frustum: frustum,
      origin: position,
      orientation: Cesium.Transforms.headingPitchRollQuaternion(
        position,
        new Cesium.HeadingPitchRoll.fromDegrees(
          this.heading,
          this.pitch,
          this.roll,
        ),
            new Cesium.HeadingPitchRoll.fromDegrees(this.heading, this.pitch, this.roll)
      ),
      vertexFormat: Cesium.VertexFormat.POSITION_ONLY,
    });
      })
    const instance = new Cesium.GeometryInstance({
      geometry: geometry,
      attributes: {
        color: Cesium.ColorGeometryInstanceAttribute.fromColor(
          Cesium.Color.fromBytes(0, 213, 144, 20),
               Cesium.Color.fromBytes(0, 213, 144, 20)
        ),
      },
    });
      })
    const primitive = new Cesium.Primitive({
      geometryInstances: instance,
      appearance: new Cesium.PerInstanceColorAppearance({
@@ -158,8 +154,8 @@
        flat: true,
      }),
      asynchronous: false,
    });
    this.frustumPrimitive = this.viewer.scene.primitives.add(primitive);
      })
      this.frustumPrimitive = this.viewer.scene.primitives.add(primitive)
  }
  // 创建轮廓线
@@ -175,33 +171,29 @@
      near: this.near,
      // 远面距视点的距离
      far: this.far,
    });
      })
    const position = Cesium.Cartesian3.fromDegrees(
      this.position.longitude,
      this.position.latitude,
      this.position.altitude,
    );
         this.position.altitude
      )
    const geometry = new Cesium.FrustumOutlineGeometry({
      frustum: frustum,
      origin: position,
      orientation: Cesium.Transforms.headingPitchRollQuaternion(
        position,
        new Cesium.HeadingPitchRoll.fromDegrees(
          this.heading,
          this.pitch,
          this.roll,
        ),
            new Cesium.HeadingPitchRoll.fromDegrees(this.heading, this.pitch, this.roll)
      ),
      vertexFormat: Cesium.VertexFormat.POSITION_ONLY,
    });
      })
    const instance = new Cesium.GeometryInstance({
      geometry: geometry,
      attributes: {
        color: Cesium.ColorGeometryInstanceAttribute.fromColor(
          Cesium.Color.fromBytes(0, 213, 144, 255),
               Cesium.Color.fromBytes(0, 213, 144, 255)
        ),
      },
    });
      })
    const primitive = new Cesium.Primitive({
      geometryInstances: instance,
      appearance: new Cesium.PerInstanceColorAppearance({
@@ -209,52 +201,40 @@
        flat: true,
      }),
      asynchronous: false,
    });
    this.outlinePrimitive = this.viewer.scene.primitives.add(primitive);
      })
      this.outlinePrimitive = this.viewer.scene.primitives.add(primitive)
  }
  addCenterline() {
    this.centerDataSource = new Cesium.CustomDataSource();
    this.viewer.dataSources.add(this.centerDataSource);
      this.centerDataSource = new Cesium.CustomDataSource()
      this.viewer.dataSources.add(this.centerDataSource)
    const position = Cesium.Cartesian3.fromDegrees(
      this.position.longitude,
      this.position.latitude,
      this.position.altitude,
    );
         this.position.altitude
      )
    let matrix = Cesium.Matrix3.fromQuaternion(
      Cesium.Transforms.headingPitchRollQuaternion(
        position,
        new Cesium.HeadingPitchRoll.fromDegrees(
          this.heading,
          this.pitch,
          this.roll,
            new Cesium.HeadingPitchRoll.fromDegrees(this.heading, this.pitch, this.roll)
        ),
      ),
      new Cesium.Matrix3(),
    );
         new Cesium.Matrix3()
      )
    let right1 = Cesium.Matrix3.getColumn(matrix, 0, new Cesium.Cartesian3());
    let up1 = Cesium.Matrix3.getColumn(matrix, 1, new Cesium.Cartesian3());
    let direction = Cesium.Matrix3.getColumn(
      matrix,
      2,
      new Cesium.Cartesian3(),
    );
      let right1 = Cesium.Matrix3.getColumn(matrix, 0, new Cesium.Cartesian3())
      let up1 = Cesium.Matrix3.getColumn(matrix, 1, new Cesium.Cartesian3())
      let direction = Cesium.Matrix3.getColumn(matrix, 2, new Cesium.Cartesian3())
    // const direction = new Cartesian3(-0.10668226241650887, 0.8103322335050215, -0.5761775474872814)
    let frontDirect = Cesium.Cartesian3.multiplyByScalar(
      direction,
      this.far,
      new Cesium.Cartesian3(),
    );
    let bottomCenter = Cesium.Cartesian3.add(
      position,
      frontDirect,
      new Cesium.Cartesian3(),
    );
         new Cesium.Cartesian3()
      )
      let bottomCenter = Cesium.Cartesian3.add(position, frontDirect, new Cesium.Cartesian3())
    // 创建Entity来显示中心线
    this.centerDataSource.entities.add({
@@ -270,6 +250,6 @@
          gapWidth: 1.0,
        }),
      },
    });
      })
  }
}