调试3D图展示视角

src/components/map/index.vue

@@ -235,8 +235,8 @@ export default {
         new TileLayer({
           source: new XYZ({
             // url: "http://127.0.0.1:8010/tiles/{z}/{x}/{y}.png", //本地
-            url: "http://192.168.50.235/tiles/{z}/{x}/{y}.png", //内网
-            // url: "http://106.120.102.238:18000/tiles/{z}/{x}/{y}.png", //外网
+            // url: "http://192.168.50.235/tiles/{z}/{x}/{y}.png", //内网
+            url: "http://106.120.102.238:18000/tiles/{z}/{x}/{y}.png", //外网
             // url: "http://10.96.137.5:9080/tiles/{z}/{x}/{y}.png", //大～#@唐
           }),
         }),

src/views/admin/cockpitManage/component/leftdata.vue

@@ -5,7 +5,8 @@
       <div class="BOXsan">
         <div class="YC02" @click="getwgl">
           <strong class="texyellow">
-            {{ onrelevance ? onrelevance : 0 }}</strong>
+            {{ onrelevance ? onrelevance : 0 }}</strong
+          >
           <span>待分析任务</span>
         </div>
         <div class="YC02" @click="getwfx">
@@ -23,13 +24,29 @@
         <!-- 外部容器设置最大高度和滚动条 -->
         <div style="max-height: 400px; overflow-y: auto">
           <el-table :data="glData" style="width: 100%">
-            <el-table-column prop="fieldName" label="风场名称" width="180"></el-table-column>
-            <el-table-column prop="analysisName" label="分析名称"></el-table-column>
-            <el-table-column prop="createTime" label="创建时间" width="180"></el-table-column>
+            <el-table-column
+              prop="fieldName"
+              label="风场名称"
+              width="180"
+            ></el-table-column>
+            <el-table-column
+              prop="analysisName"
+              label="分析名称"
+            ></el-table-column>
+            <el-table-column
+              prop="createTime"
+              label="创建时间"
+              width="180"
+            ></el-table-column>
 
             <el-table-column fixed="right" label="操作" width="100">
               <template slot-scope="scope">
-                <el-button @click="handleClick(scope.row)" type="text" size="small">编辑</el-button>
+                <el-button
+                  @click="handleClick(scope.row)"
+                  type="text"
+                  size="small"
+                  >编辑</el-button
+                >
               </template>
             </el-table-column>
           </el-table>
@@ -47,7 +64,12 @@
             </el-table-column>
             <el-table-column fixed="right" label="操作" width="100">
               <template slot-scope="scope">
-                <el-button @click="YChandleClick(scope.row)" type="text" size="small">编辑</el-button>
+                <el-button
+                  @click="YChandleClick(scope.row)"
+                  type="text"
+                  size="small"
+                  >编辑</el-button
+                >
               </template>
             </el-table-column>
           </el-table>
@@ -65,7 +87,9 @@
             </el-table-column>
             <el-table-column fixed="right" label="操作" width="100">
               <template slot-scope="scope">
-                <el-button @click="PDClick(scope.row)" type="text" size="small">编辑</el-button>
+                <el-button @click="PDClick(scope.row)" type="text" size="small"
+                  >编辑</el-button
+                >
               </template>
             </el-table-column>
           </el-table>
@@ -86,8 +110,13 @@
       </h3>
       <div>
         <p class="titleYC"><span>风场名称</span><span>入库时间</span></p>
-        <tabroll :table-data="tableData" :shujuloading="shujuloading" :columns="YCtableColumns"
-          :column-widths="YCcolumnWidths" :max-height="140"></tabroll>
+        <tabroll
+          :table-data="tableData"
+          :shujuloading="shujuloading"
+          :columns="YCtableColumns"
+          :column-widths="YCcolumnWidths"
+          :max-height="140"
+        ></tabroll>
 
         <!-- <el-table
           :data="tableData"
@@ -116,13 +145,27 @@
       </div>
     </div>
 
-    <el-dialog title="实时数据采集统计" :visible.sync="lineShow" width="1340px" :before-close="handleClose">
+    <el-dialog
+      title="实时数据采集统计"
+      :visible.sync="lineShow"
+      width="1340px"
+      :before-close="handleClose"
+    >
       <el-container>
         <el-aside width="300px">
           <h1>当日实时数据</h1>
-          <el-input placeholder="请输入内容" size="small" v-model="searchvalue" prefix-icon="el-icon-search"></el-input>
+          <el-input
+            placeholder="请输入内容"
+            size="small"
+            v-model="searchvalue"
+            prefix-icon="el-icon-search"
+          ></el-input>
           <div class="windbox">
-            <div class="windlist" v-for="(item, index) in windList" :key="index">
+            <div
+              class="windlist"
+              v-for="(item, index) in windList"
+              :key="index"
+            >
               <h3>{{ item.fieldName }}</h3>
               <p>数据类型:{{ item.dataType }}</p>
               <p>采集次数:{{ item.collectCount }} 次</p>
@@ -135,21 +178,37 @@
             <p>
               风场名称：
               <el-select v-model="windvalue" placeholder="请选择" size="small">
-                <el-option v-for="item in windoptions" :key="item.value" :label="item.label" :value="item.value">
+                <el-option
+                  v-for="item in windoptions"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
                 </el-option>
               </el-select>
             </p>
             <p>
               转换类型：
               <el-select v-model="typevalue" placeholder="请选择" size="small">
-                <el-option v-for="item in typeoptions" :key="item.value" :label="item.label" :value="item.value">
+                <el-option
+                  v-for="item in typeoptions"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
                 </el-option>
               </el-select>
             </p>
             <p>
               时间范围：
-              <el-date-picker size="small" v-model="value1" type="daterange" range-separator="至"
-                start-placeholder="开始日期" end-placeholder="结束日期">
+              <el-date-picker
+                size="small"
+                v-model="value1"
+                type="daterange"
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+              >
               </el-date-picker>
             </p>
             <div>
@@ -158,13 +217,27 @@
             </div>
           </div>
 
-          <el-table :data="ListtableData" style="width: 100%" class="custom-table">
+          <el-table
+            :data="ListtableData"
+            style="width: 100%"
+            class="custom-table"
+          >
             <el-table-column prop="name" label="风场名称"> </el-table-column>
             <el-table-column prop="type" label="类型" align="center">
             </el-table-column>
-            <el-table-column prop="address" label="采集总天数" align="center" width="150">
+            <el-table-column
+              prop="address"
+              label="采集总天数"
+              align="center"
+              width="150"
+            >
             </el-table-column>
-            <el-table-column prop="count" label="采集总条数" align="center" width="180">
+            <el-table-column
+              prop="count"
+              label="采集总条数"
+              align="center"
+              width="180"
+            >
             </el-table-column>
             <el-table-column prop="daytime" label="最近采集时间" align="center">
             </el-table-column>
@@ -178,12 +251,37 @@
     <el-dialog title="入库信息" width="70%" :visible.sync="dialogTableVisible">
       <el-button size="small" @click="importdata">导入数据</el-button>
       <el-table :data="gridData" style="max-height: 400px; overflow: auto">
-        <el-table-column property="windFarmName" label="风场名称" show-overflow-tooltip width="150px"></el-table-column>
-        <el-table-column property="minuteTimeAreaList" label="SCADA分钟级" show-overflow-tooltip></el-table-column>
-        <el-table-column property="secondTimeAreaList" label="SCADA秒级" show-overflow-tooltip></el-table-column>
-        <el-table-column property="faultTimeAreaList" label="故障数据" show-overflow-tooltip></el-table-column>
-        <el-table-column property="warnTimeAreaList" label="报警数据" show-overflow-tooltip></el-table-column>
-        <el-table-column property="vibrationTimeAreaList" label="振动数据" show-overflow-tooltip></el-table-column>
+        <el-table-column
+          property="windFarmName"
+          label="风场名称"
+          show-overflow-tooltip
+          width="150px"
+        ></el-table-column>
+        <el-table-column
+          property="minuteTimeAreaList"
+          label="SCADA分钟级"
+          show-overflow-tooltip
+        ></el-table-column>
+        <el-table-column
+          property="secondTimeAreaList"
+          label="SCADA秒级"
+          show-overflow-tooltip
+        ></el-table-column>
+        <el-table-column
+          property="faultTimeAreaList"
+          label="故障数据"
+          show-overflow-tooltip
+        ></el-table-column>
+        <el-table-column
+          property="warnTimeAreaList"
+          label="报警数据"
+          show-overflow-tooltip
+        ></el-table-column>
+        <el-table-column
+          property="vibrationTimeAreaList"
+          label="振动数据"
+          show-overflow-tooltip
+        ></el-table-column>
       </el-table>
     </el-dialog>
   </div>
@@ -363,7 +461,7 @@ export default {
     this.getbacklog();
     this.ruku();
   },
-  mounted() { },
+  mounted() {},
   methods: {
     getbacklog() {
       queryWaitTask().then((res) => {
@@ -375,7 +473,7 @@ export default {
     getwgl() {
       const arr = {
         pageSize: 999,
-        analysisState: -1,
+        analysisState: "-1",
       };
       analysisResultList(arr).then((res) => {
         this.glData = res.data.list;
@@ -419,7 +517,7 @@ export default {
 
     handleClick(row) {
       const fieldName = row.fieldName; // 获取当前行的 fieldName 数据
-      const analysisState = -1;
+      const analysisState = "-1";
       // 打开新窗口
       const newWindow = window.open(
         "/home/performance/assetssMag?id=195",
@@ -434,7 +532,7 @@ export default {
     YChandleClick(row) {
       const fieldName = row.fieldName; // 获取当前行的 fieldName 数据
       const errState = 1;
-      const analysisState = 30;
+      const analysisState = "30";
       // 打开新窗口
       const newWindow = window.open(
         "/home/performance/assetssMag?id=195",

src/views/overview/components/cp/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2025-01-09 18:05:58
- * @LastEditTime: 2025-02-26 10:39:16
+ * @LastEditTime: 2025-02-27 15:37:36
  * @LastEditors: bogon
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/views/overview/components/cp/index.vue
@@ -316,7 +316,7 @@ export default {
     //获取选中风机list
     getEnfineList(data, setUpImg) {
       this.fieldEngineCodes = data;
-      this.setUpImgData = setUpImg;
+      this.setUpImgData = [...setUpImg];
       this.getAnalysisDetail();
     },
     //下一条

src/views/overview/components/filterChart/index.vue

@@ -1,11 +1,3 @@
-<!--
- * @Author: your name
- * @Date: 2025-01-13 14:53:21
- * @LastEditTime: 2025-02-26 14:10:27
- * @LastEditors: bogon
- * @Description: In User Settings Edit
- * @FilePath: /performance-test/src/views/overview/components/filterChart/index.vue
--->
 <template>
   <div class="filterChart">
     <h3>图像设置:</h3>
@@ -143,7 +135,11 @@ export default {
           },
           {
             label: "发电机转速",
-            text: ["发电机转速（r/min）", "发电机转速（r/min）"],
+            text: [
+              "发电机转速（r/min）",
+              "发电机转速（r/min）",
+              "发电机转速（r/min）",
+            ],
             dtick: null, //步长
             min: null, //最小值
             max: null, //最大值
@@ -162,19 +158,20 @@ export default {
   },
   created() {
     // 确保 this.form.dgeneratorSpeed 和 this.setUpimg 都已经初始化
-    if (
-      Array.isArray(this.form.dgeneratorSpeed) &&
-      Array.isArray(this.setUpimg)
-    ) {
+    // 保证只有在通过事件传递数据时才更新
+    if (this.setUpimg.length > 0) {
       this.form.dgeneratorSpeed = this.form.dgeneratorSpeed.filter(
-        (item) => this.setUpimg.includes(item.label) // 过滤出 label 在 setUpimg 中的项
+        (item) => this.setUpimg.includes(item.label) // 过滤出label在setUpimg中的项
       );
+    } else {
+      this.form.dgeneratorSpeed = [];
     }
   },
 
   methods: {
     onSearch() {
-      this.$emit("getEnfineList", this.form.value2, this.form.dgeneratorSpeed);
+      const data = JSON.parse(JSON.stringify(this.form.dgeneratorSpeed));
+      this.$emit("getEnfineList", this.form.value2, data);
     },
     onSubmit(type) {
       if (type === "handlePrevious") {

src/views/performance/components/chartsCom/3DDrawingChart.vue

@@ -227,8 +227,11 @@ export default {
           },
           yaxis: {
             title: this.chartData.yaixs,
+            tickvals: [...new Set(this.chartData.data[0].yData)],
+            ticktext: [...new Set(this.chartData.data[0].yData)],
             gridcolor: "rgb(255,255,255)",
             tickcolor: "rgb(255,255,255)",
+
             backgroundcolor: "#e5ecf6",
             showbackground: true,
           },
@@ -239,18 +242,21 @@ export default {
             backgroundcolor: "#e5ecf6",
             showbackground: true,
           },
-          // aspectratio: {
-          //   x: 1,
-          //   y: 3,
-          //   z: 1,
-          // },
-          plot_bgcolor: "#e5ecf6",
-          gridcolor: "#fff",
-          // camera: {
-          //   center: { x: 0, y: 0, z: 0 },
-          //   eye: { x: 0, y: 0, z: 2.5 },
-          //   up: { x: 0, y: 0, z: 1 },
-          // },
+          aspectratio: {
+            x: 3,
+            y: 1,
+            z: 1,
+          },
+          // plot_bgcolor: "#e5ecf6",
+          // gridcolor: "#fff",
+          camera: {
+            center: { x: -0.233946, y: -0.319396, z: 0.483055 },
+            eye: { x: -1.729102, y: -3.506569, z: -1.296184 },
+            up: { x: 0.12359, y: 0.43886022, z: -0.89001518 },
+            projection: {
+              type: "perspective",
+            },
+          },
         },
         margin: { t: 50, b: 50, l: 50, r: 50 },
         staticPlot: false,
@@ -265,6 +271,7 @@ export default {
       const getChartSetUp = (axisTitle) => {
         return this.setUpImgData.find((item) => item.text.includes(axisTitle));
       };
+
       // 更新x轴和y轴的范围与步长
       const xChartSetUp = getChartSetUp(layout.scene.xaxis.title);
       if (xChartSetUp) {
@@ -281,7 +288,46 @@ export default {
         layout.scene.zaxis.dtick = zChartSetUp.dtick;
         layout.scene.zaxis.range = [zChartSetUp.min, zChartSetUp.max];
       }
-      Plotly.newPlot(`plotly-3d-chart-` + this.index, traces, layout);
+      console.log(
+        xChartSetUp,
+        yChartSetUp,
+        zChartSetUp,
+        layout.scene.xaxis.title,
+        layout.scene.yaxis.title,
+        layout.scene.zaxis.title,
+        "layout.scene.zaxis.title"
+      );
+      try {
+        // 假设这里是 WebGL 的相关初始化代码
+        Plotly.react(`plotly-3d-chart-` + this.index, traces, layout).catch(
+          (err) => {
+            console.error("WebGL 错误: ", err);
+            // 你可以根据错误类型做更多处理
+            if (err.message.includes("shaderSource")) {
+              // alert("着色器编译失败！");
+            }
+          }
+        );
+        // 监听图表的 relayout 事件，获取并输出相机视角
+        const plotElement = document.getElementById(
+          `plotly-3d-chart-` + this.index
+        );
+
+        plotElement.on("plotly_relayout", function (eventData) {
+          // 在每次布局变更时，打印当前相机视角
+          if (eventData["scene.camera"]) {
+            console.log(
+              "当前相机视角:",
+              eventData["scene.camera"],
+              eventData["scene.aspectratio"]
+            );
+          }
+        });
+      } catch (e) {
+        console.error("捕获到 WebGL 错误:", e);
+        // alert("图表渲染失败！");
+      }
+      // Plotly.newPlot(`plotly-3d-chart-` + this.index, traces, layout);
     },
   },
 };

src/views/performance/components/chartsCom/BarChart.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2024-09-11 14:30:17
- * @LastEditTime: 2025-02-21 15:18:51
+ * @LastEditTime: 2025-02-27 10:22:31
  * @LastEditors: bogon
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/views/performance/components/chartsCom/BarChart.vue
@@ -144,6 +144,10 @@ export default {
         },
         autosize: true, // 开启自适应
       };
+      if (this.chartData.xaixs === "机组") {
+        layout.xaxis.tickvals = this.chartData.data[0].xData;
+        layout.xaxis.ticktext = this.chartData.data[0].xData;
+      }
 
       // 渲染图表
       Plotly.newPlot(

src/views/performance/components/chartsCom/BoxLineCharts.vue

@@ -168,6 +168,7 @@ export default {
         boxpoints: false,
         boxmean: false,
         name: filteredData.title,
+        fillcolor: "#406DAB", // 设置箱线图填充颜色，带透明度
         hovertemplate:
           `${this.chartData.xaixs}:` +
           ` %{x} <br> ` +

src/views/performance/components/chartsCom/BoxMarkersCharts.vue

@@ -146,6 +146,7 @@ export default {
           marker: {
             color: group.color,
           },
+          fillcolor: "#406DAB", // 设置箱线图填充颜色，带透明度
           boxpoints: false, // 是否显示异常值
           boxmean: true, // 是否显示均值
           hovertemplate: (data) => {

src/views/performance/components/chartsCom/Time3DChart.vue

@@ -229,6 +229,11 @@ export default {
           //   y: 3,
           //   z: 1,
           // },
+          aspectratio: {
+            x: 3,
+            y: 1,
+            z: 1,
+          },
           plot_bgcolor: "#e5ecf6",
           gridcolor: "#fff",
           // camera: {
@@ -236,6 +241,14 @@ export default {
           //   eye: { x: 0, y: 0, z: 2.5 },
           //   up: { x: 0, y: 0, z: 1 },
           // },
+          camera: {
+            center: { x: -0.233946, y: -0.319396, z: 0.483055 },
+            eye: { x: -1.729102, y: -3.506569, z: -1.296184 },
+            up: { x: 0.12359, y: 0.43886022, z: -0.89001518 },
+            projection: {
+              type: "perspective",
+            },
+          },
         },
         margin: { t: 50, b: 50, l: 50, r: 50 },
         staticPlot: false,