From f03ea598d39abceac4eeb5f3a10b1fe7dd706b2c Mon Sep 17 00:00:00 2001
From: jihongshun <1151753686@qq.com>
Date: 星期五, 25 七月 2025 16:48:31 +0800
Subject: [PATCH] 光轴

---
 src/utils/components/init-map.vue |  313 +++++++++++++++++++++++++++++++++++++--------------
 1 files changed, 227 insertions(+), 86 deletions(-)

diff --git a/src/utils/components/init-map.vue b/src/utils/components/init-map.vue
index 3442bf7..36e654f 100644
--- a/src/utils/components/init-map.vue
+++ b/src/utils/components/init-map.vue
@@ -12,10 +12,11 @@
         <el-input v-model="mergeNumber" placeholder="璇疯緭鍏ュ悎骞惰寖鍥�" type="number" style="width: 150px;"></el-input>
         <el-button  @click="mergePoint()" type="success">鍚堝苟</el-button>
         <el-button  @click="renderData()" type="success">鏁版嵁娓叉煋</el-button>
-        <!-- <el-button  @click="VisualCone()" type="success">鐢熸垚瑙嗛敟浣�</el-button> -->
+        <el-button  @click="VisualCone()" type="success">鐢熸垚瑙嗛敟浣�</el-button>
+        <el-button  @click="fly()" type="success">椋炲埌鎸囧畾鍦扮偣</el-button>
 
       </div>
-      <div class="key-container">
+      <!-- <div class="key-container">
         <div class="arrow-row">
           <div
               class="arrow"
@@ -65,7 +66,7 @@
               @mousedown="handleClick('ArrowRight')"
             >鈫�</div>
           </div>
-      </div>
+      </div> -->
     </div>
 
     <!-- 鍔ㄦ�佸潗鏍囥�佸姩鎬佺浉鏈哄弬鏁版樉绀� -->
@@ -91,6 +92,10 @@
 let  globalon  = 0
 let  globalat = 0
 let  pois = [globalon, globalat,0] 
+let cameraVideo 
+let ScopeElement; //鍏夎酱銆佽棰�
+let preVideoScopePrimitiveArrTie = [];
+let scratchSetViewMatrix3 = new Cesium.Matrix3();
 
 // let  pois = [0, 0,0] 
 let holdingPosition;
@@ -129,9 +134,6 @@
         mergeNumber:null,
         activeKey: null,
         timer: null,
-        handler: null,
-      frustumPrimitive: null,
-      selected: false,
     }
   },
   mounted(){
@@ -156,13 +158,13 @@
         this.loadModel()
         this.addSyncListener()
         this.registerKeyboardEvents();
-        
         let control = viewerC.scene.screenSpaceCameraController;
         control.enableRotate = false;
         control.enableTranslate = false;
         control.enableZoom = false;
         control.enableTilt = false;
         control.enableLook = false;
+        viewerC.scene.camera.percentageChanged = 0.05聽
         this.cammove_measure_point();
       },1000)
     },
@@ -336,7 +338,38 @@
                 const tagert = Cesium.Cartesian3.add(holdingPosition,scalerNormalize,new聽Cesium.Cartesian3());
                 console.log(Cesium.Cartographic.fromCartesian(tagert))
                 _this.creatPin("aerialPoiId"+counter,tagert,`绌�${counter}`,Cesium.Color.RED,viewerM);
+                preVideoScopePrimitiveArrTie = []
+                console.log(Cesium.Math.toDegrees(Cesium.Cartographic.fromCartesian(tagert).height))
                 _this.updateCameraMovement();
+                if(cameraVideo){
+                  viewerM.scene.primitives.remove(cameraVideo)
+                }
+              //鍒涘缓瑙嗛敟浣�
+                let data = {
+                    "FHorFieldAngle": 32.13,
+                    "FVerFieldAngle": 18.39,
+                    "altitude":  Cesium.Cartographic.fromCartesian(tagert).height,
+                    "id": "111111",
+                    "chanNo": 1,
+                    "latitude": Cesium.Math.toDegrees(Cesium.Cartographic.fromCartesian(tagert).latitude),
+                    "longitude":  Cesium.Math.toDegrees(Cesium.Cartographic.fromCartesian(tagert).longitude),
+                    "p": 26.8,
+                    "t": 351.3,
+                    "z": 1,
+                }
+                const point1 = Cesium.Cartesian3.fromDegrees(0, 0, 50);
+                const point2 = Cesium.Cartesian3.fromDegrees(Cesium.Math.toDegrees(Cesium.Cartographic.fromCartesian(tagert).longitude), Cesium.Math.toDegrees(Cesium.Cartographic.fromCartesian(tagert).latitude), Cesium.Cartographic.fromCartesian(tagert).height);
+
+                // 璁$畻璺濈锛堝崟浣嶏細绫筹級
+                const distance1 = Cesium.Cartesian3.distance(point1, point2)
+                console.log(distance1)
+                data.distance = distance1
+                _this.createVideoScope(data)
+                setTimeout(() => {
+                  viewerC.camera.changed.addEventListener(_this.onCameraChange)
+                }, 100);
+                
+
                 //缁撴潫鍙抽敭鐩戝惉
                 createPinHandler.destroy();
                 //缁撴潫涓诲浘鑱斿姩楣扮溂鐩戝惉
@@ -530,7 +563,6 @@
       }
     },
     updateCameraMovement() {
-      console.log('111111111111111111111111111111111111111111')
       const camera = viewerC.camera;
       // Adjust speed by modifiers
       let currentSpeed = this.moveSpeed;
@@ -639,10 +671,10 @@
       viewerC.camera.flyHome(1.0);
     },
     move_measure_point(){
-      CesiumSurvey.measureMovePoint(viewerM,'moveResultCon');
+      CesiumSurvey.measureMovePoint(viewerC,'moveResultCon');
     },
     cammove_measure_point(){
-      CesiumSurvey.cammeasureMovePoint(viewerM,'cammoveResultCon');
+      CesiumSurvey.cammeasureMovePoint(viewerC,'cammoveResultCon');
     },
     renderData(){
         this.$emit('renderData',viewerM)
@@ -683,6 +715,7 @@
           ]
         };
       });
+      console.log(result)
       this.$emit('mergePoint',result,this.mergeNumber,viewerM)
     },
     genId() {
@@ -721,88 +754,196 @@
       this.updateCameraMovement()
     },
     VisualCone(){
-      this.addFrustum();
-      this.initDragHandler();
+      let data = {
+          "FHorFieldAngle": 32.13,
+          "FVerFieldAngle": 18.39,
+          "altitude": 55,
+          "cameraId": "fdae8144e0fc47cf95152080eb3f7db3",
+          "chanNo": 1,
+          "latitude": 46.58528798,
+          "longitude": 124.9662813,
+          "p": 26.8,
+          "t": 351.3,
+          "z": 1
+      }
     },
-    addFrustum() {
-      // 鍒涘缓涓�涓� PerspectiveFrustum
-      const frustum = new Cesium.PerspectiveFrustum({
-        fov: Cesium.Math.PI_OVER_THREE,
-        aspectRatio: 1.0,
-        near: 1.0,
-        far: 500.0,
-      });
-
-      // 璁剧疆鐭╅樀浣嶇疆
-      const position = Cesium.Cartesian3.fromDegrees(110.0, 30.0, 100.0);
-      const direction = Cesium.Cartesian3.normalize(
-        new Cesium.Cartesian3(1.0, 0.0, -1.0),
-        new Cesium.Cartesian3()
-      );
-      const up = Cesium.Cartesian3.UNIT_Z;
-      const right = Cesium.Cartesian3.cross(direction, up, new Cesium.Cartesian3());
-      const rotation = Cesium.Matrix3.setColumns(
-        new Cesium.Matrix3(),
-        right,
-        up,
-        Cesium.Cartesian3.negate(direction, new Cesium.Cartesian3())
-      );
-
-      const modelMatrix = Cesium.Matrix4.fromRotationTranslation(rotation, position);
-
-      this.frustumPrimitive = this.viewer.scene.primitives.add(
-        new Cesium.DebugCameraPrimitive({
-          frustum,
-          modelMatrix,
-          color: Cesium.Color.LIME.withAlpha(0.5),
-        })
-      );
+     // 鍒涘缓鍒濆鍖栫殑鍏夎酱
+    createVideoScope(data) {
+      console.log(data)
+      console.log(data.distance)
+      if (data == undefined) {
+        this.$message({
+          showClose: true,
+          message: '鏆傛棤鏁版嵁',
+          type: "warning",
+        });
+      } else {
+        ScopeElement = this.createVideoElementOld(
+            "http://192.168.5.122:9998/live?port=1234&app=live&stream=mystream",
+            data.id,
+            1.7778
+        );
+        // let poi = data.camPosition.split(",");
+        // let hight = data.pe_offset.split(",");
+        let positionCt3 = Cesium.Cartesian3.fromDegrees(
+            Number(data.longitude),
+            Number(data.latitude),
+            // Number(data.altitude) + Number(hight[1]) + 1.7
+            Number(data.altitude)
+        );
+        console.log(data)
+        let inverseViewMatrix = this.hpr2m({
+          position: positionCt3, // 鐩告満鍧愭爣
+          // heading: Cesium.Math.toRadians(Number(120)),
+          // pitch: Cesium.Math.toRadians(Number(-5)),
+          // roll: Cesium.Math.toRadians(Number(0)),
+          heading: Cesium.Math.toRadians(180),
+          pitch: Cesium.Math.toRadians(0),
+          roll: Cesium.Math.toRadians(0),
+        });
+        let frustum = new Cesium.PerspectiveFrustum({
+          fov: Cesium.Math.toRadians(6),
+          aspectRatio: Number(1.77778), // 瀹介珮姣�
+          near: Number(0.05), // 璁惧鐒﹁窛
+          far: Number(data.distance), // 鎷嶆憚璺濈
+        });
+         cameraVideo = new Cesium.XbsjCameraVideo({
+          inverseViewMatrix: inverseViewMatrix,
+          frustum: frustum,
+          videoElement: ScopeElement,
+          showHelperPrimitive: true,
+        });
+        cameraVideo._primitive.classificationType = 2; //聽鍚屾椂鎶曞奖鍦板舰鍜�3dtiles鏁版嵁
+        cameraVideo.id = "sz" + data.id;
+        let isHole = false;
+        cameraVideo._primitive.appearance.material = new Cesium.Material({
+          fabric: {
+            type: "Color",
+            uniforms: {
+              color: new Cesium.Color(0, 1, 0, 0.2),
+            },
+          },
+        });
+        cameraVideo._helperPrimitive.geometryInstances.attributes.color =
+            Cesium.ColorGeometryInstanceAttribute.fromColor(
+                new Cesium.Color(0, 1.0, 0, 1.0)
+            );
+        // viewer.scene.primitives.add(cameraVideo);
+        let pmObj = {};
+        console.log(data)
+        pmObj.id = "sz" + data.id;
+        console.log(pmObj)
+        pmObj.primitive = cameraVideo;
+        // pmCollection.push(pmObj);//骞曞竷锛岃棰戣浆鎹娇鐢�
+        viewerM.scene.primitives.add(cameraVideo);
+        preVideoScopePrimitiveArrTie.push(pmObj);
+      }
+      // }
     },
+    // 鍒涘缓鍏夎酱涓嬬殑骞曞竷
+    createVideoElementOld(videoSrc, id) {
+      var videoElement = document.createElement("div");
+      videoElement.id = "video" + id;
+      videoElement.style.position = "absolute";
+      videoElement.style.zIndex = "-100";
+      videoElement.style.background = "green";
+      document.getElementById("videoSource").appendChild(videoElement);
+      return videoElement;
+    },
+    //h,p,r杞琺atrix4
+    hpr2m(obj, result) {
+      // const inverseViewMatrix = Cesium.Transforms.headingPitchRollToFixedFrame(position, headingPitchRoll, undefined, undefined, result);
+      const inverseViewMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(
+          obj.position,
+          undefined,
+          result
+      );
+      let rotMat = Cesium.Matrix3.fromRotationX(
+          Cesium.Math.PI_OVER_TWO,
+          scratchSetViewMatrix3
+      );
+      Cesium.Matrix4.multiplyByMatrix3(
+          inverseViewMatrix,
+          rotMat,
+          inverseViewMatrix
+      );
+      rotMat = Cesium.Matrix3.fromRotationY(
+          -obj.heading,
+          scratchSetViewMatrix3
+      );
+      Cesium.Matrix4.multiplyByMatrix3(
+          inverseViewMatrix,
+          rotMat,
+          inverseViewMatrix
+      );
 
-    initDragHandler() {
-      const scene = viewerM.scene;
-      const canvas = scene.canvas;
-      this.handler = new Cesium.ScreenSpaceEventHandler(canvas);
+      rotMat = Cesium.Matrix3.fromRotationX(obj.pitch, scratchSetViewMatrix3);
+      Cesium.Matrix4.multiplyByMatrix3(
+          inverseViewMatrix,
+          rotMat,
+          inverseViewMatrix
+      );
 
-      let isDragging = false;
-      let lastPosition = null;
+      rotMat = Cesium.Matrix3.fromRotationZ(-obj.roll, scratchSetViewMatrix3);
+      Cesium.Matrix4.multiplyByMatrix3(
+          inverseViewMatrix,
+          rotMat,
+          inverseViewMatrix
+      );
 
-      this.handler.setInputAction((movement) => {
-        const pickedObject = scene.pick(movement.position);
-        if (pickedObject && pickedObject.primitive === this.frustumPrimitive) {
-          this.selected = true;
-          isDragging = true;
-          lastPosition = movement.position;
-        } else {
-          this.selected = false;
-        }
-      }, Cesium.ScreenSpaceEventType.LEFT_DOWN);
-
-      this.handler.setInputAction((movement) => {
-        if (isDragging && this.selected) {
-          const start = scene.pickPosition(lastPosition);
-          const end = scene.pickPosition(movement.endPosition);
-          if (start && end) {
-            const delta = Cesium.Cartesian3.subtract(
-              end,
-              start,
-              new Cesium.Cartesian3()
-            );
-            const newMatrix = Cesium.Matrix4.multiplyByTranslation(
-              this.frustumPrimitive.modelMatrix,
-              delta,
-              new Cesium.Matrix4()
-            );
-            this.frustumPrimitive.modelMatrix = newMatrix;
-            lastPosition = movement.endPosition;
+      return inverseViewMatrix;
+    },
+    fly(){
+       viewerM.scene.camera.setView({
+          destination: Cesium.Cartesian3.fromDegrees(124.9662813, 46.58528798, 349.0), // 浠ョ粡绾害璁剧疆浣嶇疆锛堜緥濡傦細澶у簡榫欏叴璺級
+          orientation: {
+              heading: Cesium.Math.toRadians(194.65),  // 鏂瑰悜
+              pitch: Cesium.Math.toRadians(-31.43), // 淇
+              roll: 0
           }
-        }
-      }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
-
-      this.handler.setInputAction(() => {
-        isDragging = false;
-        lastPosition = null;
-      }, Cesium.ScreenSpaceEventType.LEFT_UP);
+      });
+    },
+    onCameraChange() {
+      const camera = viewerC.camera;
+      const position = camera.positionCartographic;
+      const heading = Cesium.Math.toDegrees(camera.heading);
+      const pitch = Cesium.Math.toDegrees(camera.pitch);
+      const roll = Cesium.Math.toDegrees(camera.roll);
+      const point1 = Cesium.Cartesian3.fromDegrees(0, 0, 50);
+      const point2 = Cesium.Cartesian3.fromDegrees(Cesium.Math.toDegrees(position.longitude),Cesium.Math.toDegrees(position.latitude),position.height)
+      // 璁$畻璺濈锛堝崟浣嶏細绫筹級
+      const distanceBetween = Cesium.Cartesian3.distance(point1, point2)
+      console.log(distanceBetween)
+      if(preVideoScopePrimitiveArrTie?.length !=0 ){
+        let obj = this.updateSZScope(Cesium.Math.toDegrees(position.longitude),Cesium.Math.toDegrees(position.latitude),position.height,heading,pitch,roll,1,distanceBetween)
+        preVideoScopePrimitiveArrTie[0].primitive.inverseViewMatrix = obj.M
+        preVideoScopePrimitiveArrTie[0].primitive.frustum = obj.F
+      }
+    },
+    //鏇存柊瑙嗘浣撲綅缃�
+    updateSZScope(lon, lat, alt, camHeading, camPitch, camRoll, LightView,distanceBetween) {
+      let positionCt3 = Cesium.Cartesian3.fromDegrees(
+          Number(lon),
+          Number(lat),
+          Number(alt)
+      );
+      console.log(positionCt3)
+      console.log(distanceBetween)
+      let frustum = new Cesium.PerspectiveFrustum({
+        fov: Cesium.Math.toRadians(LightView),
+        aspectRatio: Number(1.77778),
+        near: Number(0.05),
+        far: Number(distanceBetween),
+      });
+      console.log(frustum)
+      let inverseViewMatrixNew = this.hpr2m({
+        position: positionCt3,
+        heading: Cesium.Math.toRadians(Number(camHeading)),
+        pitch: Cesium.Math.toRadians(Number(camPitch)),
+        roll: Cesium.Math.toRadians(Number(camRoll)),
+      });
+      console.log(inverseViewMatrixNew)
+      return {M: inverseViewMatrixNew, F: frustum};
     },
   }
 }

--
Gitblit v1.9.3