1020改

src/views/echart/echartLine.vue

@@ -2,7 +2,6 @@
   <!-- 折线图 -->
   <div style="width: 100%; height: 100%">
     <div class="echartitem" style="width: 100%; height: 100%">
-      <!-- <h3 class="selcal">{{ props.selval }}</h3> -->
       <div
         id="line2"
         ref="chartContainer"
@@ -11,7 +10,7 @@
     </div>
   </div>
 </template>
-      <script setup>
+<script setup>
 import { ref, onMounted, reactive, markRaw, inject, watch, nextTick } from "vue"
 import { RouterView, RouterLink } from "vue-router"
 import { request, uploadFile } from "@/utils/request"
@@ -22,230 +21,54 @@ let vals = ref([])
 let series = ref([])
 let xdata = ref([])
 let chartContainer = ref(null)
-let myChart
-let chartDom = ref()
-let option = ref(null)
-let convergeDate = ref([])
 let curvedata = ref("")
-let state = reactive({
-  instance: null
-})
+
 const props = defineProps({
-  echartdata: {
-    type: String
-  },
-  curvedata: {
-    type: String
-  },
   echartLineshow: {
     type: Boolean,
     default: false
   }
 })
-onMounted(() => {
- 
-  myChart = echarts.init(chartContainer.value)
-  linechart()
-  myChart.resize();
-})
 
-// 监听 scattershow 变化
-watch(
-  () => props.echartLineshow,
-  (newValue) => {
-    if (newValue) {
-      nextTick(() => {
-        const chartDom = chartContainer.value
-        if (chartDom) {
-          myChart = echarts.init(chartDom)
-          myChart.resize() // 手动调整图表大小
-          linechart()// 设置图表配置
-        }
-      })
-    }
-  },
-  { immediate: true }
-)
 //初始化
 const echatinit = () => {
-  convergeDate.value = []
   series.value = []
   xdata.value = []
 }
-// 从websocket取数据
-// const getsockechart=(data)=>{
-//   curvedata.value=data;
-//   series.value=[];
-//   let rows=curvedata.value;
-//   for(let i=0;i<rows.length;i++){
-
-//        vars.value=(rows[i].vars).split(",");
-//        vals.value=(rows[i].vals).split(" ");
-//        let data= vals.value.map((str) => Number(str));
-//        convergeDate.value.push(data);
-//        xdata.value.push(rows[i].step);
-//     }
-//     for(let j=0;j<vars.value.length;j++){
-//   let firstColumn=(convergeDate.value.map((row) => row[j]));
-//          let item= {
-//       name:vars.value[j] ,
-//       type: 'line',
-//       stack: 'Total',
-//       data: firstColumn
-//     }
-//     series.value.push(item)
-//     }
-//     myChart.setOption({
-//       legend: {
-//             data:vars.value
-//         },
-//       xAxis:{
-//         data:  xdata.value,
-//       },
-//       series: series.value
-//     });
-
-// }
-
-const getsockechart = (data) => {
-  curvedata.value = data;
-  convergeDate.value = [];
-  series.value = [];
-  xdata.value = [];
-
-  let rows = JSON.parse(curvedata.value);
-  if (!rows.length) return; // 处理空数据
-
-  let varsList = rows[0].vars.split(","); // 提取变量名
-  vars.value = varsList;
-
-  // 解析数据
-  rows.forEach((row, index) => {
-    xdata.value.push(index + 1); // 直接填充 X 轴数据
-    convergeDate.value.push(row.vals.split(" ").map(Number)); // 解析数值数组
-  });
-
-  // 生成 series 数据
-  series.value = varsList.map((varName, j) => ({
-    name: varName,
-    type: "line",
-    stack: "Total",
-    symbol: "none",
-    data: convergeDate.value.map(row => row[j]) // 获取每列数据
-  }));
-
-  // 更新图表
-  myChart.setOption({
-    legend: {
-      data: vars.value,
-    },
-    xAxis: {
-      type: "category",
-      data: xdata.value,
-    },
-    yAxis: {
-      type: "value",
-    },
-    series: series.value,
-  });
-};
-
-// 绘制所有数据的曲线
-const getshuju = (dataheader, data) => {
-  console.log("散点图曲线数据1：", data);
-
-  curvedata.value = data; 
-  series.value = [];
-  xdata.value = [];
-
-  vars.value = dataheader;  // dataheader 是包含 label 和 prop 的数组
-  vals.value = data; 
 
-  // 生成 x 轴数据
-  for (let i = 0; i < vals.value.length; i++) {
-    xdata.value.push(i);  // x 轴数据为行索引
-  }
-
-  // 为每个字段生成一条曲线
-  for (let colIndex = 0; colIndex < vars.value.length; colIndex++) {
-    const prop = vars.value[colIndex].prop;  // 获取当前列的字段名
-    const label = vars.value[colIndex].label;  // 获取当前列的显示名称
-
-    let seriesData = [];
-
-    // 遍历每一行，提取该列的数据
-    for (let rowIndex = 0; rowIndex < vals.value.length; rowIndex++) {
-      let value = vals.value[rowIndex][prop];  // 获取当前列的值
-      seriesData.push([xdata.value[rowIndex], value]);  // 添加到 seriesData
-    }
-
-    // 为每列数据生成一条曲线，使用 label 作为曲线的名字
-    series.value.push({
-      name: label,  // 使用 label 作为曲线名
-      type: "line",  // 散点图类型
-      data: seriesData, 
-    });
-  }
-
-  // 处理 ECharts 图表配置
-  const myChart = echarts.init(chartContainer.value);
-
-  myChart.setOption({
-    legend: {
-      data: vars.value.map(item => item.label),  // 图例数据是列名
-    },
-    xAxis: {
-      type: "category",  // 设置为 "category" 表示 x 轴为分类数据
-      data: xdata.value, // x 轴数据为索引
-    },
-    yAxis: {
-      type: "value",  // y 轴是数值型
-    },
-    series: series.value,  // 使用生成的 series 数据
-  });
-
-  console.log("初始化后的 series:", series.value);
-};
-
-
-const selectshuju = (listcbval,listcbval2,dataheader, data) => {
+const selectshuju = (listcbval, listcbval2, dataheader, data) => {
   console.log("图曲线数据1：", data);
 
+  // 清空旧数据
   curvedata.value = data;
   series.value = [];
   xdata.value = [];
   const ydata = ref([]);
 
-  vars.value = dataheader;  // dataheader 是包含 label 和 prop 的数组
-  vals.value = data; // vals 是表格数据
+  vars.value = dataheader;
+  vals.value = data;
 
-  console.log('listcbval',listcbval)
-  console.log('listcbval2',listcbval2)
   // 生成 X 轴数据和 Y 轴数据
-  const xColumns = listcbval;  // 获取 listcbval 中选择的列，作为 X 轴
-  const yColumns = listcbval2;  // 获取 listcbval2 中选择的列，作为 Y 轴
-  console.log('xColumns',xColumns)
-  console.log('yColumns',yColumns)
+  const xColumns = listcbval;
+  const yColumns = listcbval2;
 
   if (xColumns.length === 0 || yColumns.length === 0) {
     console.error('请先选择 X 轴和 Y 轴的变量');
     return;
   }
 
-  // 遍历每一行数据，为每对 X 和 Y 轴选择的列生成数据
+  // 处理数据
   for (let i = 0; i < vals.value.length; i++) {
     let xValue = [];
     let yValue = [];
 
-    // 对于每个 X 轴选择的列，提取该列数据
     for (let xCol of xColumns) {
-      let xColumnData = vals.value[i][xCol];  // 获取当前行的 X 列数据
+      let xColumnData = vals.value[i][xCol];
       xValue.push(xColumnData);
     }
 
-    // 对于每个 Y 轴选择的列，提取该列数据
     for (let yCol of yColumns) {
-      let yColumnData = vals.value[i][yCol];  // 获取当前行的 Y 列数据
+      let yColumnData = vals.value[i][yCol];
       yValue.push(yColumnData);
     }
 
@@ -253,60 +76,39 @@ const selectshuju = (listcbval,listcbval2,dataheader, data) => {
     ydata.value.push(yValue);
   }
 
-  // 为每个 Y 轴数据列生成一条曲线
   for (let yColIndex = 0; yColIndex < yColumns.length; yColIndex++) {
-    const label = yColumns[yColIndex];  // 使用 Y 轴列名作为曲线的标签
+    const label = yColumns[yColIndex];
     let seriesData = [];
 
     for (let rowIndex = 0; rowIndex < vals.value.length; rowIndex++) {
-      let xValues = xdata.value[rowIndex]; // 获取当前行的 X 轴数据
-      let yValue = ydata.value[rowIndex][yColIndex]; // 获取当前行的 Y 轴数据
+      let xValues = xdata.value[rowIndex];
+      let yValue = ydata.value[rowIndex][yColIndex];
 
-      // 将 X 和 Y 的数据组成成对的数据，传给 seriesData
       for (let xVal of xValues) {
-        seriesData.push([xVal, yValue]);  // 每对 (X, Y) 数据
+        seriesData.push([xVal, yValue]);
       }
     }
 
-    // 生成曲线的数据
     series.value.push({
-      name: label,  // 使用列名作为曲线名
-      type: "line",  // 散点图类型
-      data: seriesData, 
+      name: label,
+      type: "line",
+      data: seriesData,
     });
   }
 
-  // 处理 ECharts 图表配置
-  const myChart = echarts.init(chartContainer.value);
+  // 获取或初始化图表
+  let myChart = echarts.getInstanceByDom(chartContainer.value);
+  if (!myChart) {
+    myChart = echarts.init(chartContainer.value);
+  }
 
   const xAxisLabel = dataheader.find(item => item.prop === xColumns[0])?.label || xColumns[0];
   const yAxisLabel = getFormattedYLabels(yColumns, dataheader);
   const yAxisLabel1 = getFormattedYLabels1(yColumns, dataheader);
   const chartTitle = `${xAxisLabel} - ${yAxisLabel1}`;
 
-  myChart.setOption({
-    title: {
-      text: chartTitle,
-    },
-    legend: {
-      data: yColumns,  // 图例数据使用 Y 轴的列名
-    },
-    xAxis: {
-      type: "value",  
-      data: xdata.value, // x 轴数据为 X 轴数据
-      name: xAxisLabel,
-      scale: true,
-    },
-    yAxis: {
-      type: "value",  // y 轴是数值型
-      name: yAxisLabel,
-      scale: true,
-    },
-    series: series.value,  // 使用生成的 series 数据
-    
-  });
-
-  console.log("初始化后的 series:", series.value);
+  // 调用linechart函数
+  linechart(chartTitle, xAxisLabel, yAxisLabel, yColumns);
 };
 
 const getFormattedYLabels = (columns, header, maxLength = 20) => {
@@ -337,21 +139,29 @@ const getFormattedYLabels1 = (columns, header, maxLength = 20) => {
   return fullLabel;
 };
 
-const linechart = () => {
-  option.value = {
+// linechart函数，接收额外参数
+const linechart = (chartTitle, xAxisLabel, yAxisLabel, legendData) => {
+  // 获取图表实例
+  let myChart = echarts.getInstanceByDom(chartContainer.value);
+  if (!myChart) {
+    myChart = echarts.init(chartContainer.value);
+  }
+
+  // 构建新的option，保留所有样式配置
+  const newOption = {
     title: {
-      text: " ",
+      text: chartTitle || " ", // 使用传入的标题或默认空格
       left: "center",
       top: "5%",
       textStyle: {
         color: "#333333",
         fontSize: 16,
         fontWeight: "normal",
-        fontFamily:'Microsoft YaHei'
+        fontFamily: 'Microsoft YaHei'
       }
     },
     tooltip: {
-      trigger: "axis", //item
+      trigger: "axis",
       backgroundColor: "rgba(0,0,0,.6)",
       borderColor: "rgba(147, 235, 248, .8)",
       textStyle: {
@@ -359,8 +169,8 @@ const linechart = () => {
       }
     },
     legend: {
-      data: vars.value,
-      orient: "vertical", // 图例方向 (horizontal水平, vertical垂直)
+      data: legendData || vars.value, // 使用传入的图例数据或默认
+      orient: "vertical",
       right: "0%",
       top: "2%",
       itemWidth: 30,
@@ -375,102 +185,83 @@ const linechart = () => {
       bottom: "10%",
       containLabel: true
     },
-    // toolbox: {
-    //   feature: {
-    //     saveAsImage: {}
-    //   }
-    // },
     xAxis: {
       type: "value",
       boundaryGap: false,
-      name: "",
-        nameGap:30,
-        nameTextStyle:{
-          fontSize: 16,
-          color:'#333333',
-          fontFamily:'Microsoft YaHei'
-        },
+      name: xAxisLabel || "", // 使用传入的x轴标签或默认
+      nameGap: 30,
+      nameTextStyle: {
+        fontSize: 16,
+        color: '#333333',
+        fontFamily: 'Microsoft YaHei'
+      },
       nameLocation: 'middle',
       data: xdata.value,
       axisLine: {
-        //X轴线
         show: true,
         lineStyle: {
-          color: "#333333", // 线的颜色
-          width: 1, // 线宽
-          type: "solid" // 线的类型，默认为实线，可选：'solid', 'dashed', 'dotted'
+          color: "#333333",
+          width: 1,
+          type: "solid"
         }
       },
       splitLine: {
-        show: true // 如果不需要网格线，可以设置为 false
+        show: true
       }
     },
     yAxis: {
       type: "value",
-      name:"",
-      nameGap:50,
-      nameTextStyle:{
-        fontsize:16,
-        color:'#333333',
-        fontFamily:'Microsoft YaHei'
+      name: yAxisLabel || "", // 使用传入的y轴标签或默认
+      nameGap: 50,
+      nameTextStyle: {
+        fontSize: 16,
+        color: '#333333',
+        fontFamily: 'Microsoft YaHei'
       },
-      nameLocation:"middle",
+      nameLocation: "middle",
       axisTick: {
         show: true
       },
       splitLine: {
-        show:true
+        show: true
       },
       axisLine: {
-        //Y轴线
         show: true,
         lineStyle: {
-          color: "#333333", // 线的颜色
-          width: 1, // 线宽
-          type: "solid" // 线的类型，默认为实线，可选：'solid', 'dashed', 'dotted'
+          color: "#333333",
+          width: 1,
+          type: "solid"
         }
       }
     },
     dataZoom: [
       {
-        type:"inside",
+        type: "inside",
         xAxisIndex: [0],
       },
       {
-        type:'slider',
+        type: 'slider',
         xAxisIndex: [0],
         show: false,
       },
     ],
     series: series.value
-  }
-  option.value && myChart.setOption(option.value)
-  window.onresize = function () {
-    // 让图表自适应大小
-    myChart.resize()
-  }
-}
-// 监听数据变化，重绘图表
-//   watch( myChart.value, () => {
-//     console.log(11111)
-//     window.onresize = function() {
-//           // 让图表自适应大小
-//           myChart.value.resize();
-//       };
-// });
-//window.addEventListener('resize', handleResize);
-// watch(series, () => {
-//   linechart();
-// }, { deep: true });
-// watch(() =>props.echartdata, (newValue, oldValue) => {
-//   // 这里处理 echartData 变化的逻辑
-//   console.log(11111)
-//   console.log('echartData changed:', newValue);
-// //  console.log(optmonitor1.value);
-// }, {deep: true ,immediate: true });
-defineExpose({ linechart, getsockechart, echatinit ,getshuju,selectshuju})
+  };
+
+  // 关键修改：使用replaceMerge确保完全替换series和xAxis.data
+  myChart.setOption(newOption, {
+    replaceMerge: ['series', 'xAxis', 'legend'], // 指定要完全替换的组件
+    notMerge: false // 仍然合并其他配置
+  });
+
+  window.onresize = function() {
+    myChart.resize();
+  };
+};
+
+defineExpose({ echatinit ,selectshuju})
 </script>
-      <style lang="scss" scoped>
+<style lang="scss" scoped>
 .selcal {
   position: absolute;
   top: 37%;

src/views/echart/scatter.vue

@@ -18,178 +18,28 @@ import { request, uploadFile } from "@/utils/request"
 import { ElMessage, ElButton, ElDialog, ElSelect } from "element-plus"
 import * as echarts from "echarts"
 import { graphic } from "echarts/core"
-const option = ref({})
-let myChart
 
 let vars = ref([])
 let vals = ref([])
-let series = ref([
-  
-])
+let series = ref([])
 let xdata = ref([])
 let chartContainer = ref(null)
-let chartDom = ref()
-let convergeDate = ref([])
 let curvedata = ref("")
 
-onMounted(() => {
-  // nextTick(() => {
-  //   console.log("onMounted called")
-  //   const chartDom = document.getElementById("linesan")
-  //   console.log("chartDom:", chartDom) // 检查是否获取到 DOM 元素
-
-  //   if (chartDom) {
-  //     myChart = echarts.init(chartDom)
-  //     myChart.resize()
-  //     setOptionfunc()
-  //   }
-  // })
-})
-
 const props = defineProps({
   scattershow: {
     type: Boolean,
     default: false
   }
 })
-// 监听 scattershow 变化
-watch(
-  () => props.scattershow,
-  (newValue) => {
-    if (newValue) {
-      nextTick(() => {
-        const chartDom = chartContainer.value
-        if (chartDom) {
-          myChart = echarts.init(chartDom)
-          myChart.resize() // 手动调整图表大小
-          setOptionfunc() // 设置图表配置
-        }
-      })
-    }
-  },
-  { immediate: true }
-)
+
 
 //初始化
 const echatinit = () => {
-  convergeDate.value = []
   series.value = []
   xdata.value = []
 }
 
-// 数据 从接口处取(未使用)
-const getsockechart = (data) => {
-  curvedata.value = data
-  convergeDate.value = []
-  series.value = []
-  xdata.value = []
-  let rows = JSON.parse(curvedata.value)
-  let num = 0
-
-  // 创建一个映射表用于存储变量和对应的数据
-  let variableMap = {}
-
-  for (let i = 0; i < rows.length; i++) {
-    num += 1
-    let varsArray = rows[i].vars.split(",")  // 变量名列表
-    let valsArray = rows[i].vals.split(" ").map((str) => Number(str)) // 数据值列表
-
-    xdata.value.push(num)
-
-    for (let j = 0; j < varsArray.length; j++) {
-      let varName = varsArray[j]
-      let varValue = valsArray[j]
-
-      // 如果变量名已经存在，则累加数据，否则创建数组
-      if (!variableMap[varName]) {
-        variableMap[varName] = []
-      }
-      variableMap[varName].push([num, varValue])  // 存储 (x, y) 数据点
-    }
-  }
-
-  console.log(variableMap)
-
-  // 遍历变量映射表，生成 `series` 数据
-  for (let key in variableMap) {
-    series.value.push({
-      name: key,
-      type: "scatter",
-      data: variableMap[key],  // 直接取出 (x, y) 数据点
-      itemStyle: {}
-    })
-  }
-
-  // 更新图表
-  myChart.setOption({
-    legend: {
-      data: Object.keys(variableMap)
-    },
-    xAxis: {
-      data: xdata.value
-    },
-    series: series.value
-  })
-}
-
-
-// 绘制所有数据曲线，X轴为行索引（未使用）
-const getshuju = (dataheader, data) => {
-  console.log("散点图曲线数据1：", data);
-
-  curvedata.value = data; 
-  series.value = [];
-  xdata.value = [];
-
-  vars.value = dataheader;  // dataheader 是包含 label 和 prop 的数组
-  vals.value = data; 
-
-  // 生成 x 轴数据（这里假设 x 轴是从 0 开始递增的索引）
-  for (let i = 0; i < vals.value.length; i++) {
-    xdata.value.push(i);  // x 轴数据为行索引
-  }
-
-  // 为每个字段生成一条曲线
-  for (let colIndex = 0; colIndex < vars.value.length; colIndex++) {
-    const prop = vars.value[colIndex].prop;  // 获取当前列的字段名
-    const label = vars.value[colIndex].label;  // 获取当前列的显示名称
-
-    let seriesData = [];
-
-    // 遍历每一行，提取该列的数据
-    for (let rowIndex = 0; rowIndex < vals.value.length; rowIndex++) {
-      let value = vals.value[rowIndex][prop];  // 获取当前列的值
-      seriesData.push([xdata.value[rowIndex], value]);  // 添加到 seriesData
-    }
-
-    // 为每列数据生成一条曲线，使用 label 作为曲线的名字
-    series.value.push({
-      name: label,  // 使用 label 作为曲线名
-      type: "scatter",  // 散点图类型
-      data: seriesData, 
-    });
-  }
-
-  // 处理 ECharts 图表配置
-  const myChart = echarts.init(chartContainer.value);
-
-  myChart.setOption({
-    legend: {
-      data: vars.value.map(item => item.label),  // 图例数据是列名
-    },
-    xAxis: {
-      type: "category",  // 设置为 "category" 表示 x 轴为分类数据
-      data: xdata.value, // x 轴数据为索引
-    },
-    yAxis: {
-      type: "value",  // y 轴是数值型
-    },
-    series: series.value,  // 使用生成的 series 数据
-  });
-
-  console.log("初始化后的 series:", series.value);
-};
-
 
 const selectshuju = (listcbval,listcbval2,dataheader, data) => {
   console.log("散点图曲线数据1：", data);
@@ -259,34 +109,19 @@ const selectshuju = (listcbval,listcbval2,dataheader, data) => {
     });
   }
 
-  // 处理 ECharts 图表配置
-  const myChart = echarts.init(chartContainer.value);
+  // 获取或初始化图表
+  let myChart = echarts.getInstanceByDom(chartContainer.value)
+  if(!myChart){
+    myChart = echarts.init(chartContainer.value);
+  }
+  
 
   const xAxisLabel = dataheader.find(item => item.prop === xColumns[0])?.label || xColumns[0];
   const yAxisLabel = getFormattedYLabels(yColumns, dataheader);
   const yAxisLabel1 = getFormattedYLabels1(yColumns, dataheader);
   const chartTitle = `${xAxisLabel} - ${yAxisLabel1}`;
 
-  myChart.setOption({
-    title: {
-      text: chartTitle,
-    },
-    legend: {
-      data: yColumns,  // 图例数据使用 Y 轴的列名
-    },
-    xAxis: {
-      type: "value",  // 设置为 "category" 表示 x 轴为分类数据
-      data: xdata.value, // x 轴数据为 X 轴数据
-      name: xAxisLabel,
-      scale: true,  // 自动缩放
-    },
-    yAxis: {
-      type: "value",  // y 轴是数值型
-      name: yAxisLabel,
-      // scale: true,
-    },
-    series: series.value,  // 使用生成的 series 数据
-  });
+  linechart( chartTitle, xAxisLabel, yAxisLabel, yColumns)
 
   console.log("初始化后的 series:", series.value);
 };
@@ -319,10 +154,14 @@ const getFormattedYLabels1 = (columns, header, maxLength = 20) => {
   return fullLabel;
 };
 
-const setOptionfunc = async () => {
-  option.value = {
+const linechart = (chartTitle, xAxisLabel, yAxisLabel, legendData) => {
+  let myChart = echarts.getInstanceByDom(chartContainer.value);
+  if (!myChart) {
+    myChart = echarts.init(chartContainer.value);
+  }
+  const newOption = {
     title: {
-      text: "",
+      text: chartTitle || "",
       left: "center",
       top: "5%",
       textStyle: {
@@ -334,7 +173,7 @@ const setOptionfunc = async () => {
     },
     legend: {
       show: true,
-      data: vars.value,
+      data: legendData || vars.value,
       orient: "vertical", // 图例方向 (horizontal水平, vertical垂直)
       right: "0%",
       top: "2%",
@@ -362,7 +201,7 @@ const setOptionfunc = async () => {
       {
         type: "value",
         boundaryGap: false,
-        name: "",
+        name: xAxisLabel || "",
         nameGap:30,
         nameTextStyle:{
           fontSize: 16,
@@ -388,7 +227,7 @@ const setOptionfunc = async () => {
 
     yAxis: {
       type: "value",
-      name:' ',
+      name: yAxisLabel || ' ',
       nameGap:50,
       nameTextStyle:{
         fontSize: 16,
@@ -426,13 +265,17 @@ const setOptionfunc = async () => {
     ],
     series: series.value
   }
-  option.value && myChart.setOption(option.value)
+  
+  myChart.setOption(newOption, {
+    replaceMerge:['series','xAxis','legend'],
+    notMerge: false
+  })
 
   window.onresize = function () {
     myChart.resize()
   }
 }
-defineExpose({ getsockechart,getshuju, echatinit,selectshuju })
+defineExpose({ echatinit, selectshuju })
 </script>
 <style lang="scss" scoped>
 </style>

src/views/home.vue

@@ -2921,6 +2921,7 @@ const dialogbolen = () => {
       break;
     case "列表":
       echatsfunc();
+      resetDialog();
       dialog.value.listdialog = true;
       nextTick(() => {
         initListSe();
@@ -2937,6 +2938,7 @@ const dialogbolen = () => {
       echatsfunc();
       break;
     case "折线图":
+      resetDialog();
       dialog.value.echartLinedialog = true;
       echatsfunc();
       // curveLine4();
@@ -2947,6 +2949,7 @@ const dialogbolen = () => {
       break;
     case "散点图":
       // logsget();
+      resetDialog();
       dialog.value.scatterdialog = true;
       echatsfunc();
       // curveLine4();
@@ -2962,23 +2965,37 @@ const dialogbolen = () => {
       echatsfunc();
       break;
     case "帕雷托图":
+      resetDialog();
       dialog.value.paretodialog = true;
       echatsfunc();
       break;
     case "云图/等值线":
+      resetDialog();
       dialog.value.clouddialog = true;
       break;  
     case "查看报告":
       echatsfunc();
+      resetDialog();
       dialog.value.lookover = true;
       break;
     case "导出报告":
+      resetDialog();
       dialog.value.exportreport = true;
       break;
     default:
   }
 }
 
+const resetDialog = () => {
+  dialog.value.listdialog = false;
+  dialog.value.echartLinedialog = false;
+  dialog.value.scatterdialog = false;
+  dialog.value.paretodialog = false;
+  dialog.value.clouddialog = false;
+  dialog.value.lookover = false;
+  dialog.value.exportreport = false;
+}
+
 //  可视化清空
 const echartclear = () => {
   arearef.value.echatinit();
@@ -3232,16 +3249,6 @@ const curveLine = () => {
       curvedata.value = JSON.stringify(res.rows);
       // console.log(curvedata.value);
       optmonitor1.value.getshuju(curvedata.value);
-      //  optmonitor1.value.getsockechart();
-      // arearef.value.getsockechart(curvedata.value);
-      // bargraphref.value.getsockechart(curvedata.value);
-      // echartLineref.value.getsockechart(curvedata.value);
-      // BarChartref.value.getsockechart(curvedata.value);
-      // radarref.value.getsockechart(curvedata.value);
-      // scatterref.value.getsockechart(curvedata.value);
-      // pieref.value.getsockechart(curvedata.value);
-      // paretoref.value.getsockechart(curvedata.value);
-      // optmonitor1.value.getecharts();
     })
     .catch((err) => {
       ElMessage.error(err.returnMsg)
@@ -4175,12 +4182,6 @@ const logsget = () => {
         optmonitor1.value.getsockechart(echarr);
         processMonitor1ref.value.getsockechart(echarr);
         processMonitor2ref.value.getsockechart(echarr);
-        // arearef.value.getsockechart(echarr);
-        // bargraphref.value.getsockechart(echarr);
-        // echartLineref.value.getsockechart(echarr);
-        // BarChartref.value.getsockechart(echarr);
-        // radarref.value.getsockechart(echarr);
-        // scatterref.value.getsockechart(echarr);
       }
     })
     .catch((err) => {