Browse Source

绘制内容结算0115

zhiyuan-007 2 months ago
parent
commit
c99922f335

BIN
public/imgs/warningBackground_lowbattery.png


BIN
public/imgs/warningBackground_noFlyZone.png


BIN
public/imgs/warningBackground_outofrange.png


BIN
public/imgs/预警信息框.png


+ 73 - 36
src/components/mapJK.vue

@@ -1438,7 +1438,6 @@ export default {
             };
             socket.onmessage = (messageEvent) => {
               let messages = JSON.parse(messageEvent.data).data;
-              debugger
               //发送消息
               bus.emit('SendMessage',{
                 action:"RealTimeUAVList",
@@ -1491,6 +1490,78 @@ export default {
                       "id": message.uavid+'_conflict',
                       "status": "hide"
                     });
+                    debugger
+                    if(message.noFlyZone.status != "SAFE"){
+                      console.log("禁飞区预警",message);
+                      flyGLTF({
+                        id:message.id,
+                        uavid:message.uavid,
+                        status:message.routeInfoVO.status == 3?"hide":"show",
+                        duration:message.time + 1000,
+                        //duration:3000,
+                        point:message.position_cj,
+                        uavInfo: {
+                          type:"noFlyZone",
+                          data:message.noFlyZone
+                        }
+                      });
+                    }else if(message.routeDeviate.status != "SAFE"){
+                      console.log("偏航异常预警",message);
+                      flyGLTF({
+                        id:message.id,
+                        uavid:message.uavid,
+                        status:message.routeInfoVO.status == 3?"hide":"show",
+                        duration:message.time + 1000,
+                        //duration:3000,
+                        point:message.position_cj,
+                        uavInfo: {
+                          type:"routeDeviate",
+                          data:message.routeDeviate
+                        }
+                      });
+                    }else if(message.electricityWarning.status != "SAFE"){
+                      console.log("电量异常预警",message);
+                      flyGLTF({
+                        id:message.id,
+                        uavid:message.uavid,
+                        status:message.routeInfoVO.status == 3?"hide":"show",
+                        duration:message.time + 1000,
+                        //duration:3000,
+                        point:message.position_cj,
+                        uavInfo: {
+                          type:"electricityWarning",
+                          data:message.electricityWarning
+                        }
+                      });
+                    }else if(message.collision.status != "SAFE"){
+                      console.log("建筑物过近异常信息",message);
+                      flyGLTF({
+                        id:message.id,
+                        uavid:message.uavid,
+                        status:message.routeInfoVO.status == 3?"hide":"show",
+                        duration:message.time + 1000,
+                        //duration:3000,
+                        point:message.position_cj,
+                        uavInfo: {
+                          type:"collision",
+                          data:message.collision
+                        }
+                      });
+                    }else if(message.clearZone.status != "SAFE"){
+                      console.log("净空区异常预警",message);
+                      flyGLTF({
+                        id:message.id,
+                        uavid:message.uavid,
+                        status:message.routeInfoVO.status == 3?"hide":"show",
+                        duration:message.time + 1000,
+                        //duration:3000,
+                        point:message.position_cj,
+                        uavInfo: {
+                          type:"clearZone",
+                          data:message.clearZone
+                        }
+                      });
+                    }
                     flyGLTF({
                       id:message.id,
                       uavid:message.uavid,
@@ -1505,39 +1576,6 @@ export default {
                     });
                   }
                 }
-                  // if(message.nearestAircraft.status != "SAFE"){  //碰撞
-                  //   showThreeCubeDetail({
-                  //     "id":message.uavid,
-                  //     "status": "hide",
-                  //   })
-                  //   showThreeCubeDetail({
-                  //     "id":message.uavid,
-                  //     "status": "show",
-                  //     "size": {
-                  //       "x":message.nearestAircraft.gridPath[0].boxSize.latLength,
-                  //       "y":message.nearestAircraft.gridPath[0].boxSize.lonLength,
-                  //       "z":message.nearestAircraft.gridPath[0].boxSize.height,
-                  //     },
-                  //     "points": message.nearestAircraft.gridPath
-                  //   })
-                  //   bus.emit('SendMessage',{
-                  //     action:"CurrentUavInfo",
-                  //     data:{
-                  //       "isConflict":true,
-                  //       "status": "show",
-                  //       "uavid": "87066700-f12d-4b3e-ac77-a55a409dd30b",
-                  //       "skip_route_id": "fba073d1-def3-4f85-9326-dff8a1ac6ea6",
-                  //       "distance": 1280,
-                  //     }
-                  //   })
-                  //
-                  // }else if(message.noFlyZone != "SAFE"){
-                  //   console.log("无人机禁飞区信息",message);
-                  // }else if(message.routeDeviate != "SAFE"){
-                  //   console.log("无人机偏航异常信息",message);
-                  // }else if(message.electricityWarning != "SAFE"){
-                  //   console.log("无人机电量异常信息",message);
-                  // }
               })
 
             };
@@ -1577,7 +1615,6 @@ export default {
             "intensity": 1.2,
             "pipeRadius": 5
           });
-          debugger
           getRealFlyPoint({
             flyList:{
               "path": res.data.data.pathAll,
@@ -1813,7 +1850,7 @@ export default {
         //先加载所有的无人机和航线
         getRealFlyPoint({
           status: params.status,
-          flyList:params.status=="show"?[]:routeList.uavList
+          flyList:params.status=="show"?routeList.uavList:routeList.uavList
         })
 
       }

+ 0 - 1
src/units/map/AddSingleLayer.js

@@ -31,7 +31,6 @@ class AddSingleLayer{
         let item = this.m_map.layers.findIndex(item => item.id === this.id);
         if(item == -1){
             if(this.visible){
-                debugger
                 switch (this.type) {
                     case "scene":
                         this.layer = new SceneLayer({

+ 0 - 1
src/units/map/AddThreeCubeDetailEvent.js

@@ -44,7 +44,6 @@ class AddThreeCubeDetailEvent{
     showInfoWithReturn(item){
         if(item){
             // this.callBackFunctionTwo(item.gridCode)
-            debugger
             bus_1.emit('SendMessage', {
                 action:"SelectedCubeInfo",
                 data:{

+ 133 - 26
src/units/threejs/flyGLTF.js

@@ -195,20 +195,31 @@ export const FlyGLTFClass = {
                     bottomImage.src = 'public/imgs/warningBackground_conflict.png'; // 替换为你的图片路径
                     typeInfo = "碰撞检测"
                     break;
-                case "warning_lowbattery":
-                    backgroundImage.src = 'public/imgs/warningBackground.png'; // 替换为你的图片路径
+                case "electricityWarning":
+                    backgroundImage.src = 'public/imgs/warningBackground_lowbattery.png'; // 替换为你的图片路径
                     typeInfo = "电池电量低"
                     break;
-                case "warning_outofrange":
-                    backgroundImage.src = 'public/imgs/warningBackground.png'; // 替换为你的图片路径
+                case "routeDeviate":
+                    backgroundImage.src = 'public/imgs/warningBackground_outofrange.png'; // 替换为你的图片路径
                     typeInfo = "偏移航线"
                     break;
+                case "noFlyZone":
+                    backgroundImage.src = 'public/imgs/warningBackground_noFlyZone.png'; // 替换为你的图片路径
+                    typeInfo = "禁飞区"
+                    break;
+                case "collision":
+                    backgroundImage.src = 'public/imgs/warningBackground_noFlyZone.png'; // 替换为你的图片路径
+                    typeInfo = "建筑物过近"
+                    break;
+                case "clearZone":
+                    backgroundImage.src = 'public/imgs/warningBackground_noFlyZone.png'; // 替换为你的图片路径
+                    typeInfo = "净空区"
+                    break;
                 default:
                     backgroundImage.src = 'public/imgs/serviceBackground.png'; // 替换为你的图片路径
                     typeInfo = "正常"
                     break;
             }
-
             // backgroundImage.src = 'public/imgs/serviceBackground.png'; // 替换为你的图片路径
             if(this.panelInfo.type == "conflict"){
                 topImage.onload = () => {
@@ -218,17 +229,16 @@ export const FlyGLTFClass = {
                         context.fillStyle = 'rgba(0, 0, 0, 0)'; // 设置透明背景
                         context.fillRect(0, 0, canvas.width, canvas.height); // 填充透明背景
 
-                        // // 绘制顶部图片
-                        // const topImageHeight = canvas.height * 0.2; // 设定顶部图片高度为 canvas 高度的 20%
-                        // context.drawImage(topImage, 0, 0, canvas.width, topImageHeight);
+                        // 绘制顶部图片
+                        const topImageHeight = canvas.height * 0.2; // 设定顶部图片高度为 canvas 高度的 20%
+                        context.drawImage(topImage, 0, 0, canvas.width, topImageHeight);
 
                         // 绘制底部图片
                         const bottomImageHeight = canvas.height * 0.7; // 设定底部图片高度为 canvas 高度的 20%
                         context.drawImage(bottomImage, 0, canvas.height - bottomImageHeight, canvas.width, bottomImageHeight);
 
-                        debugger
                         const textInfo = [
-                            // { text: '暂停飞行原地等待:' + this.panelInfo.data.waitTime +'秒', color: '#fff', font: 'bold 16px Arial', offsetX:50, offsetY: 20 },
+                            { text: '暂停飞行原地等待:' + this.panelInfo.data.waitTime +'秒', color: '#fff', font: 'bold 16px Arial', offsetX:50, offsetY: 20 },
                             { text: '距预测撞点前方: ', color: '#fff', font: '20px Verdana', offsetX:70, offsetY: 90 },
                             { text: Math.floor(this.panelInfo.data.waitLength * 1) + '米', color: '#ff0000', font: 'bold 22px Courier New', offsetX:120, offsetY: 120  }
                         ];
@@ -242,6 +252,119 @@ export const FlyGLTFClass = {
                         texture.needsUpdate = true;
                     }
                 }
+            }else if(this.panelInfo.type == "electricityWarning"){
+                backgroundImage.onload = () => {
+                    // 确保背景透明
+                    context.clearRect(0, 0, canvas.width, canvas.height); // 清除所有内容,包含黑色
+                    context.fillStyle = 'rgba(0, 0, 0, 0)'; // 设置透明背景
+                    context.fillRect(0, 0, canvas.width, canvas.height); // 填充透明背景
+                    // 绘制背景图片,填满整个 canvas
+                    context.drawImage(backgroundImage, 0, 0, canvas.width, canvas.height);
+                    const textInfo = [
+                        { text: '电量预警: ', color: '#fff', font: '15px Arial', offsetX:40, offsetY: 25 },
+                        { text: '低电量警告: ', color: '#fff', font: '15px Arial', offsetX:40, offsetY: 70 },
+                        { text: this.panelInfo.data.speed, color: '#fff', font: '15px Arial', offsetX:40, offsetY: 90 },
+                        { text: this.panelInfo.data.altitude, color: '#fff', font: '15px Arial', offsetX:40, offsetY: 110 },
+                        { text: this.panelInfo.data.altitude, color: '#fff', font: '15px Arial', offsetX:80, offsetY: 110 }
+                    ];
+                    // 绘制文字
+                    textInfo.forEach((line) => {
+                        context.fillStyle = line.color;
+                        context.font = line.font;
+                        context.fillText(line.text, line.offsetX, line.offsetY);
+                    });
+                    // 标记纹理需要更新
+                    texture.needsUpdate = true;
+                };
+            }else if(this.panelInfo.type == "routeDeviate"){
+                backgroundImage.onload = () => {
+                    // 确保背景透明
+                    context.clearRect(0, 0, canvas.width, canvas.height); // 清除所有内容,包含黑色
+                    context.fillStyle = 'rgba(0, 0, 0, 0)'; // 设置透明背景
+                    context.fillRect(0, 0, canvas.width, canvas.height); // 填充透明背景
+                    // 绘制背景图片,填满整个 canvas
+                    context.drawImage(backgroundImage, 0, 0, canvas.width, canvas.height);
+                    const textInfo = [
+                        { text: '计划偏离: ', color: '#fff', font: '15px Arial', offsetX:40, offsetY: 25 },
+                        { text: '偏离距离: '+this.panelInfo.data.speed * 3.6+'米', color: '#fff', font: '15px Arial', offsetX:40, offsetY: 90 },
+                        { text: '飞行航线偏离: '+ this.panelInfo.data.altitude, color: '#fff', font: '15px Arial', offsetX:40, offsetY: 110 },
+                        { text: '无人机正在偏离计划航线飞行,预警提示请关注', color: '#fff', font: '15px Arial', offsetX:40, offsetY: 130 }
+                    ];
+                    // 绘制文字
+                    textInfo.forEach((line) => {
+                        context.fillStyle = line.color;
+                        context.font = line.font;
+                        context.fillText(line.text, line.offsetX, line.offsetY);
+                    });
+                    // 标记纹理需要更新
+                    texture.needsUpdate = true;
+                };
+            }else if(this.panelInfo.type == "noFlyZone"){
+                backgroundImage.onload = () => {
+                    // 确保背景透明
+                    context.clearRect(0, 0, canvas.width, canvas.height); // 清除所有内容,包含黑色
+                    context.fillStyle = 'rgba(0, 0, 0, 0)'; // 设置透明背景
+                    context.fillRect(0, 0, canvas.width, canvas.height); // 填充透明背景
+
+                    // 绘制背景图片,填满整个 canvas
+                    context.drawImage(backgroundImage, 0, 0, canvas.width, canvas.height);
+                    const textInfo = [
+                        { text: '空域闯入-禁飞区', color: '#fff', font: '15px Arial', offsetX:40, offsetY: 25 },
+                        { text: '已闯入禁飞区,请及时校正航线', color: '#fff', font: '15px Arial', offsetX:40, offsetY: 90 }
+                    ];
+                    // 绘制文字
+                    textInfo.forEach((line) => {
+                        context.fillStyle = line.color;
+                        context.font = line.font;
+                        context.fillText(line.text, line.offsetX, line.offsetY);
+                    });
+                    // 标记纹理需要更新
+                    texture.needsUpdate = true;
+                };
+            }else if(this.panelInfo.type == "collision"){   //需要米数,已返回
+                backgroundImage.onload = () => {
+                    // 确保背景透明
+                    context.clearRect(0, 0, canvas.width, canvas.height); // 清除所有内容,包含黑色
+                    context.fillStyle = 'rgba(0, 0, 0, 0)'; // 设置透明背景
+                    context.fillRect(0, 0, canvas.width, canvas.height); // 填充透明背景
+                    // 绘制背景图片,填满整个 canvas
+                    context.drawImage(backgroundImage, 0, 0, canvas.width, canvas.height);
+                    const textInfo = [
+                        { text: '建筑避障: ', color: '#fff', font: '15px Arial', offsetX:40, offsetY: 25 },
+                        { text: '当前飞行轨迹距离前方建筑物实时距离: '+this.panelInfo.data.distance+'米', color: '#fff', font: '15px Arial', offsetX:40, offsetY: 90 },
+                        { text: '请注意飞行安全', color: '#fff', font: '15px Arial', offsetX:40, offsetY: 110 },
+                    ];
+                    // 绘制文字
+                    textInfo.forEach((line) => {
+                        context.fillStyle = line.color;
+                        context.font = line.font;
+                        context.fillText(line.text, line.offsetX, line.offsetY);
+                    });
+                    // 标记纹理需要更新
+                    texture.needsUpdate = true;
+                };
+            }else if(this.panelInfo.type == "clearZone"){
+                backgroundImage.onload = () => {
+                    // 确保背景透明
+                    context.clearRect(0, 0, canvas.width, canvas.height); // 清除所有内容,包含黑色
+                    context.fillStyle = 'rgba(0, 0, 0, 0)'; // 设置透明背景
+                    context.fillRect(0, 0, canvas.width, canvas.height); // 填充透明背景
+                    // 绘制背景图片,填满整个 canvas
+                    context.drawImage(backgroundImage, 0, 0, canvas.width, canvas.height);
+                    const textInfo = [
+                        { text: '空域闯入-净空区', color: '#fff', font: '15px Arial', offsetX:40, offsetY: 25 },
+                        { text: '当前飞行轨迹距离前方净空区实时距离: '+this.panelInfo.data.distance+'米', color: '#fff', font: '15px Arial', offsetX:40, offsetY: 90 },
+                        { text: '请注意飞行安全', color: '#fff', font: '15px Arial', offsetX:40, offsetY: 110 },
+                    ];
+                    // 绘制文字
+                    textInfo.forEach((line) => {
+                        context.fillStyle = line.color;
+                        context.font = line.font;
+                        context.fillText(line.text, line.offsetX, line.offsetY);
+                    });
+                    // 标记纹理需要更新
+                    texture.needsUpdate = true;
+                };
             }else{
                 backgroundImage.onload = () => {
                     // 确保背景透明
@@ -268,28 +391,12 @@ export const FlyGLTFClass = {
                         context.font = line.font;
                         context.fillText(line.text, line.offsetX, line.offsetY);
                     });
-                    //
-                    // // 绘制文字信息
-                    // context.fillStyle = '#fff';
-                    // context.font = 'normal 15px Arial';
-                    // context.fillText('无人机信息:',40, 25);
-                    // context.fillText('无人机名称:'+this.panelInfo.data.name, 40, 50);
-                    // context.fillText('所属企业: 美团', 40, 70);
-                    // context.fillText('速度: '+this.panelInfo.data.speed * 3.6+'km/h', 40, 90);
-                    // context.fillText('高度: '+ this.panelInfo.data.altitude+'m', 40, 110);
-                    // context.fillText(`状态: ${typeInfo}`,40, 130);
                     // 标记纹理需要更新
                     texture.needsUpdate = true;
                 };
             }
             mesh.up.set(1, 0, 0); // 保持面板的 "上" 方向为 Y 轴正方向
             mesh.lookAt(this._camera.position);
-
-            // // 让面板始终面向摄像机
-            // const panelObject = this.infoPanel.object3D; // 假设 infoPanel 中有绑定的 Object3D 对象
-            // if (panelObject && this.camera) {
-            //     panelObject.lookAt(this.camera.position);
-            // }
         }
     },