修改type未定义bug，多坐标轴错乱，注释掉一些无用代码

src/components/graph/Entity5Form.vue

@@ -1,183 +0,0 @@
-<template>
-  <div>
-      <div class="demo-select">
-        <div class="block">
-          <span class="demonstration">选择实体列</span>
-          <el-select v-model="selectedrow" placeholder="请选择实体列">
-            <el-option
-              v-for="row in rowOptions"
-              :key="row.value"
-              :label="row.label"
-              :value="row.value"
-            ></el-option>
-          </el-select>
-        </div>
-      </div>
-    <div class="demo-select">
-    <div class="block">
-      <span class="demonstration">选择统计指标</span>
-      <el-select v-model="selectedrow2" placeholder="统计指标">
-        <el-option
-          v-for="row in rowOptions2"
-          :key="row.value"
-          :label="row.label"
-          :value="row.value"
-        ></el-option>
-      </el-select>
-    </div>
-  </div>
-  <div class="demo-select">
-    <div class="block">
-      <span class="demonstration">请选择起始日期列</span>
-      <el-select v-model="selectedrow3" placeholder="日期列">
-        <el-option
-          v-for="row in rowOptions3"
-          :key="row.value"
-          :label="row.label"
-          :value="row.value"
-        ></el-option>
-      </el-select>
-    </div>
-  </div>
-  <div class="demo-select">
-      <div class="block">
-        <span class="demonstration">图形样式</span>
-        <el-select v-model="selectedChartType" placeholder="请选择图形样式">
-          <el-option
-            v-for="type in chartTypes"
-            :key="type.value"
-            :label="type.label"
-            :value="type.value"
-          ></el-option>
-        </el-select>
-      </div>
-    </div>
-  </div>
-
-      
-</template>
-
-<script setup>
-import { ref, defineExpose, defineProps, defineEmits,watch } from 'vue';
-const selectedEntity = ref(null);
-const selectedChartType = ref(''); // 默认图表类型
-const selectedrow = ref(null);
-const selectedrow2 = ref(null);
-const selectedrow3= ref(null);
-
-const rowOptions2=ref(null);
-const rowOptions3=ref(null);
-const chartTypes = [
-  { value: 'line', label: '折线图' },
-  { value: 'bar', label: '柱状图' },
-  { value: 'pie', label: '饼图' }
-];
-// 向父组件发送事件的方式
-const emits = defineEmits(['update:selectedEntity', 'update:selectedrow', 'update:selectedrow2','update:selectedrow3','update:selectedChartType']);
-
-const props= defineProps({
-  rowOptions: Array,
-
-})
-
-watch(() => props.rowOptions, (newVal) => {
-  // 更新rowOptions2，将新数据插入到指定位置
-  rowOptions2.value = [
-    { value: 'entity', label: '线索数' }, // 保留原有数据
-    ...newVal // 将新的选项添加进来
-  ];
-  rowOptions3.value = [
-    { value: 'entity', label: '线索数' }, // 保留原有数据
-    ...newVal // 将新的选项添加进来
-  ];
-}, { immediate: true });
-
-// 监听数据变化，并通过事件传递给父组件
-defineExpose({
-  selectedEntity,
-  selectedrow,
-  selectedrow2,
-  selectedrow3,
-  selectedChartType
-});
-
-// 监听选择的值变化，并触发对应的事件
-watch(selectedEntity, () => {
-  emits('update:selectedEntity', selectedEntity.value);
-});
-
-watch(selectedrow, () => {
-  emits('update:selectedrow', selectedrow.value);
-});
-watch(selectedrow2, () => {
-  emits('update:selectedrow2', selectedrow2.value);
-});
-watch(selectedrow3, () => {
-  emits('update:selectedrow3', selectedrow3.value);
-});
-watch(selectedChartType, () => {
-  emits('update:selectedChartType', selectedChartType.value);
-});
-
-</script>
-
-
-<style>  
-
-.el-row {
-    margin-top: 5px;
-    margin-bottom: 10px;
-  }
-  
-  .demo-select {
-    display: flex;
-    width: 100%;
-    padding: 0;
-    flex-wrap: wrap;
-  }
-  
-  .demo-select .block {
-    padding: 10px 0;
-    text-align: center;
-    border-right: solid 1px var(--el-border-color);
-    flex: 1;
-  }
-  
-  .demo-select .block:last-child {
-    border-right: none;
-  }
-  
-  .demo-select .demonstration {
-    display: block;
-    color: var(--el-text-color-secondary);
-    font-size: 14px;
-    margin-bottom: 20px;
-  }
-  
-  .demo-date-picker {
-    display: flex;
-    width: 100%;
-    padding: 0;
-    flex-wrap: wrap;
-  }
-  
-  .demo-date-picker .block {
-    padding: 30px 0;
-    text-align: center;
-    border-right: solid 1px var(--el-border-color);
-    flex: 1;
-  }
-  
-  .demo-date-picker .block:last-child {
-    border-right: none;
-  }
-  
-  .demo-date-picker .demonstration {
-    display: block;
-    color: var(--el-text-color-secondary);
-    font-size: 14px;
-    margin-bottom: 20px;
-  }
-
-  </style>
-  

src/views/ShowGraph.vue

@@ -92,7 +92,7 @@ import * as echarts from 'echarts';
                 :Message4="SendOpenSelected"
               >
               </component>
-              <el-card v-if="entity">
+              <!-- <el-card v-if="entity">
           <el-row>
             <el-table
               :data="columnData"
@@ -111,7 +111,7 @@ import * as echarts from 'echarts';
                   
             </el-table>
           </el-row>
-        </el-card>
+        </el-card> -->
               <el-form-item>
                 <el-button type="primary" size="medium" @click="handleGenerateChart">
                   点击生成图表
@@ -138,13 +138,14 @@ import * as echarts from 'echarts';
 
 import { ref } from 'vue'
 
+import { markRaw } from 'vue';
 import { useRouter } from 'vue-router';
 import * as echarts from 'echarts';
 import Entity1Form from '@/components/graph/Entity1Form.vue';
 import Entity2Form from '@/components/graph/Entity2Form.vue';
 import Entity3Form from '@/components/graph/Entitu3Form.vue';
 import Entity4Form from '@/components/graph/Entity4Form.vue';
-import Entity5Form from '@/components/graph//Entity5Form.vue';
+// import Entity5Form from '@/components/graph//Entity5Form.vue';
 import HeaderPage from "@/components/HeaderPage.vue";
 import { avatarEmits } from 'element-plus';
 import AddDialog from '@/components/components_cluespage/AddDialog.vue';
@@ -155,7 +156,7 @@ export default {
     Entity2Form,
     Entity3Form,
     Entity4Form,
-    Entity5Form,
+   
     HeaderPage
   },
   props: ['columns','tabledata'],
@@ -189,9 +190,7 @@ export default {
         {value:'entity2',label:'以两个日期之间存在为横坐标'},
         { value: 'entity3', label: '实数区间为横坐标' },
         { value: 'entity4', label: '字符串意义上的完全相同为横坐标' },
-        {
+       
-          value: 'entity5', label: '三维数据'
-        },
       ],
       dates: [],
 
@@ -216,13 +215,13 @@ export default {
   //   }
   // },
   computed: {
-    entity()
+    // entity()
-    {
+    // {
-      if (this.selectedEntity=='entity5')
+    //   if (this.selectedEntity=='entity5')
-      return 1;
+    //   return 1;
-    else
+    // else
-    return 0;
+    // return 0;
-    },
+    // },
     columnData() {
       if (this.srow)
     {
@@ -253,8 +252,8 @@ export default {
           return 'Entity3Form';
         case 'entity4':
           return 'Entity4Form';
-        case 'entity5':
+        // case 'entity5':
-            return 'Entity5Form';
+        //     return 'Entity5Form';
         default:
           return null;
       }
@@ -262,7 +261,7 @@ export default {
   },
   created()
   {
-    console.log(this.$route.params.tabledata)
+    //console.log(this.$route.params.tabledata)
     this.mytable=JSON.parse(this.$route.params.tabledata);
     this.mycolumns = JSON.parse(this.$route.params.columns);
     
@@ -304,77 +303,77 @@ export default {
 
 
 
-    handleSelectionChange(selection) {
+    // handleSelectionChange(selection) {
-            // 在这里处理选择变化，selection 是选中的行数据数组
+    //         // 在这里处理选择变化，selection 是选中的行数据数组
-            let obj=selection.map(item=>item.name)
+    //         let obj=selection.map(item=>item.name)
-            // console.log(obj)
+    //         // console.log(obj)
-            this.selectedColumnData =selection.map(item=>item.name)
+    //         this.selectedColumnData =selection.map(item=>item.name)
            
-            // console.log( this.selectedColumnData);
+    //         // console.log( this.selectedColumnData);
-            // console.log('选择的行数据:', selection);
+    //         // console.log('选择的行数据:', selection);
-        },
+    //     },
     returnHome(){
     
       window.history.back();
         },
-        extractThreeColumns(tableData) {
+//         extractThreeColumns(tableData) {
-    let extractedData = tableData.map(row => ({
+//     let extractedData = tableData.map(row => ({
-        month: row[this.srow3],
+//         month: row[this.srow3],
-        product: row[this.srow],
+//         product: row[this.srow],
-        amount: row[this.srow2]
+//         amount: row[this.srow2]
-    }));
+//     }));
 
-    return extractedData;
+//     return extractedData;
-},
+// },
-    count_sum_time()
+//     count_sum_time()
-    {
+//     {
 
-      this.hasUpperContent = true;
+//       this.hasUpperContent = true;
-    let counts = {};
+//     let counts = {};
-    let salesData=this.extractThreeColumns(this.mytable);
+//     let salesData=this.extractThreeColumns(this.mytable);
-    // console.log(salesData)
+//     // console.log(salesData)
-    // 遍历销售记录数组，填充 counts 对象
+//     // 遍历销售记录数组，填充 counts 对象
-    salesData.forEach(record => {
+//     salesData.forEach(record => {
-        let { month, product, amount } = record;
+//         let { month, product, amount } = record;
-        let currentMonth=new Date(month)
+//         let currentMonth=new Date(month)
-        let monthKey1 = currentMonth.getFullYear() + '-' + (currentMonth.getMonth() + 1);
+//         let monthKey1 = currentMonth.getFullYear() + '-' + (currentMonth.getMonth() + 1);
-        if (!counts[monthKey1]) {
+//         if (!counts[monthKey1]) {
-            counts[monthKey1] = {};
+//             counts[monthKey1] = {};
-        }
+//         }
-        if ( !counts[monthKey1][product])
+//         if ( !counts[monthKey1][product])
-        counts[monthKey1][product] = amount;
+//         counts[monthKey1][product] = amount;
-      else
+//       else
-      counts[monthKey1][product] += amount;
+//       counts[monthKey1][product] += amount;
-    });
+//     });
 
-    // 现在 counts 对象包含了每个月份每种产品的销售额信息
+//     // 现在 counts 对象包含了每个月份每种产品的销售额信息
    
-    const products = this.selectedColumnData;
+//     const products = this.selectedColumnData;
-    let years = Array.from(new Set(salesData.map(record => new Date(record.month).getFullYear()+ '-' + (new Date(record.month).getMonth() + 1)))).sort();
+//     let years = Array.from(new Set(salesData.map(record => new Date(record.month).getFullYear()+ '-' + (new Date(record.month).getMonth() + 1)))).sort();
 
-    // Create the structure similar to 'source'
+//     // Create the structure similar to 'source'
-    let result = [['product', ...years]];
+//     let result = [['product', ...years]];
 
-    products.forEach(product => {
+//     products.forEach(product => {
-        let rowData = [product];
+//         let rowData = [product];
-for (let i = 0; i < years.length; i++) {
+// for (let i = 0; i < years.length; i++) {
-    rowData.push(0);
+//     rowData.push(0);
-}
+// }
-        result.push(rowData);
+//         result.push(rowData);
-    });
+//     });
-    products.forEach(product=>
+//     products.forEach(product=>
-    {
+//     {
-      years.forEach(year => {
+//       years.forEach(year => {
-        if (counts[year][product])
+//         if (counts[year][product])
-            result[products.indexOf(product)+1][years.indexOf(year)+1]+=counts[year][product];
+//             result[products.indexOf(product)+1][years.indexOf(year)+1]+=counts[year][product];
-          else
+//           else
-          result[products.indexOf(product)+1][years.indexOf(year)+1]+=0;
+//           result[products.indexOf(product)+1][years.indexOf(year)+1]+=0;
-        });
+//         });
-    }
+//     }
-    )
+//     )
-    // console.log(result)
+//     // console.log(result)
-    return result;
+//     return result;
-},
+// },
     countsumbystring() {
       // 创建一个对象来存储每个名字对应的实数总和
       this.hasUpperContent = true;
@@ -419,13 +418,11 @@ for (let i = 0; i < years.length; i++) {
 for (let i = 0; i < counts.length; i++) {
   yAxis.push({
     type: 'value',
-    name: this.srow2[i],
+  
     position: 'left',
-    offset:i*40,
+
     alignTicks: true,
-    axisLine: {
+
-      show: true
-    }
   });
 }
 return yAxis;
@@ -741,7 +738,7 @@ currentDate.setDate(currentDate.getDate()+1);
       try
       {
       const chartContainer = this.$refs.chartContainer;
-      this.chartInstance = echarts.init(chartContainer);
+      this.chartInstance =markRaw( echarts.init(chartContainer));
         // console.log(chartContainer);
       let option;
       if (!this.entity)
@@ -749,12 +746,18 @@ currentDate.setDate(currentDate.getDate()+1);
       if (this.stype === 'bar' || this.stype == 'line') {
         option = {
           toolbox: {
-            feature: {
+          show: true,
-              dataView: { show: true, readOnly: false },
+          orient: 'vertical',
-              restore: { show: true },
+          left: 'right',
-              saveAsImage: { show: true }
+          top: 'center',
-            }
+          feature: {
-          },
+            mark: { show: true },
+            dataView: { show: true, readOnly: false },
+            magicType: { show: true, type: ['line', 'bar', 'stack'] },
+            restore: { show: true },
+            saveAsImage: { show: true }
+          }
+        },
           xAxis: {
             type: 'category',
             data: Object.keys(counts),
@@ -842,7 +845,7 @@ currentDate.setDate(currentDate.getDate()+1);
                           lastMonth = 1;  
                           lastYear++;
                       } 
-                      lastXDataDateString = `${lastYear}-${lastMonth}-${lastDate}`;  console.log('aaa');
+                      lastXDataDateString = `${lastYear}-${lastMonth}-${lastDate}`;  //console.log('aaa');
                       xdata.push(lastXDataDateString);  
                       ydata.push(0); 
                       tim ++;