314

src/views/echart/optimize_monitor.vue

@@ -21,18 +21,9 @@ import * as echarts from "echarts"
 let vars = ref(['变量1','变量2'])
 let vals = ref([])
 let series = ref([
-  {
-    name: "变量1",
-    type: "line",
-    data: [10, 20, 30, 40] // y轴对应数据
-  },
-  {
-    name: "变量2",
-    type: "line",
-    data: [20, 10, 40, 30] // y轴对应数据
-  }
+  
 ])
-let xdata = ref(['0','1.00','2.00','3.00','4.00','5.00','6.00','7.00','8.00'])
+let xdata = ref([])
 let chartContainer = ref()
 let myChart
 let chartDom = ref()
@@ -66,15 +57,18 @@ const echatinit = () => {
 const getsockechart = (data) => {
   console.log("曲线数据", data);
   curvedata.value = data;
-  series.value = [];
-  xdata.value = [];
+
+  // 如果是第一次传入数据，则初始化为空数组；否则保留之前的数据
+  if (!xdata.value) {
+    xdata.value = [];
+  }
+
   let rows = curvedata.value;
 
-  // 清空之前的数据
-  
+  // 继续累加之前的数据
   let convergeDate = {
-    "design_var/upperB": [], // 存储 design_var/upperB 的数据
-    "design_var/lowerB": []  // 存储 design_var/lowerB 的数据
+    "design_var/upperB": [],
+    "design_var/lowerB": []
   };
 
   // 遍历每一行数据
@@ -82,61 +76,81 @@ const getsockechart = (data) => {
     let vals = rows[i].vals.split(" "); 
 
     let upperB = JSON.parse(vals[3]);
-    let lowerB = JSON.parse(vals[4]); 
+    let lowerB = JSON.parse(vals[4]);
 
+    // 将新的数据追加到对应的数组中
     convergeDate["design_var/upperB"].push(...upperB);
     convergeDate["design_var/lowerB"].push(...lowerB);
 
-    xdata.value.push(rows[i].step); // 用 `step` 字段的值填充 xdata
+    // 将新的 step 值追加到 xdata 数组
+    xdata.value.push(rows[i].step); 
   }
-  // 为每条曲线分配数据
+
+  // 获取所有的 upperB 和 lowerB 数据
   let upperBData = convergeDate["design_var/upperB"];
   let lowerBData = convergeDate["design_var/lowerB"];
 
-  // 需要知道每条曲线的个数，这里是取每列的长度
+  // 计算每条曲线的数量
   let curveCount = upperBData.length / rows.length;
 
-  // 为每个曲线创建数据
+  // 遍历每一条曲线，检查是否已经存在，如果存在，则更新数据；否则，创建新曲线
   for (let i = 0; i < curveCount; i++) {
     let upperBCurveData = [];
     let lowerBCurveData = [];
 
+    // 填充每条曲线的数据
     for (let j = 0; j < rows.length; j++) {
       upperBCurveData.push(upperBData[j * curveCount + i]);
       lowerBCurveData.push(lowerBData[j * curveCount + i]);
     }
 
-    // 创建曲线数据项
-    series.value.push({
-      name: `design_var/upperB${i + 1}`, 
-      type: "line",
-      stack: "Total",
-      data: upperBCurveData 
-    });
+    // 查找是否已经存在此曲线
+    let upperBSeries = series.value.find(s => s.name === `design_var/upperB${i + 1}`);
+    let lowerBSeries = series.value.find(s => s.name === `design_var/lowerB${i + 1}`);
 
-    series.value.push({
-      name: `design_var/lowerB${i + 1}`, 
-      type: "line",
-      stack: "Total",
-      data: lowerBCurveData 
-    });
+    // 如果存在则更新数据，否则创建新曲线
+    if (upperBSeries) {
+      upperBSeries.data.push(...upperBCurveData);
+    } else {
+      series.value.push({
+        name: `design_var/upperB${i + 1}`, 
+        type: "line",
+        stack: "Total",
+        data: upperBCurveData 
+      });
+    }
+
+    if (lowerBSeries) {
+      lowerBSeries.data.push(...lowerBCurveData);
+    } else {
+      series.value.push({
+        name: `design_var/lowerB${i + 1}`, 
+        type: "line",
+        stack: "Total",
+        data: lowerBCurveData 
+      });
+    }
   }
 
   // 使用 myChart 设置图表的配置
   myChart.setOption({
     legend: {
-      data: [...Array(curveCount).keys()].map(i => `design_var/upperB${i + 1}`).concat(
-        [...Array(curveCount).keys()].map(i => `design_var/lowerB${i + 1}`)
-      ) // 设置图例数据为曲线名
+      data: [
+        ...Array(curveCount).keys().map(i => `design_var/upperB${i + 1}`),
+        ...Array(curveCount).keys().map(i => `design_var/lowerB${i + 1}`)
+      ] // 设置图例数据为曲线名
     },
     xAxis: {
-      data: xdata 
+      data: xdata.value  // 使用更新后的 xdata
     },
-    series: series.value 
+    series: series.value  // 使用更新后的 series
   });
-  console.log('XDATAhi大哈办法就是发',xdata.value)
+
+  console.log('更新后的 xdata:', xdata.value);
+  console.log('更新后的 series:', series.value);
 };
 
+
 // 数据转化废弃
 const getshuju = (data) => {
   curvedata.value = data