Browse Source

4.25修改对比

liuqiao 1 year ago
parent
commit
afe83ec35e
2 changed files with 56 additions and 157 deletions
  1. 28 78
      src/view/result/Wdisaster.vue
  2. 28 79
      src/view/result/Wdisaster2.vue

+ 28 - 78
src/view/result/Wdisaster.vue

@@ -118,46 +118,12 @@ const handleDelete=(event)=>{
             arr.push(res.rows[i].data[k].val);
           }
           // var arr = Array.from(Object.values(res.rows[i].data),x=>x);
-        series.value.push({
+          series.value.push({
          name:res.rows[i].code,
          type: 'line',
-      showSymbol: false,
-      smooth: true,
-      data:arr,//res.rows[i].data
-         itemStyle:{
-           normal:{
-             color: {
-               type: 'linear',
-               x: 0,
-               y: 0,
-               x2: 0,
-               y2: 1,
-               colorStops: [
-               {
-                 offset:1, color: '#ACD6FF ' // 0% 处的颜色
-               },
-               {
-                 offset:0.7, color: '#105CF0 '// 100% 处的颜色
-               },
-               {
-                 offset:0.66, color: '#FF7A00 '// 100% 处的颜色
-               },
-               {
-                 offset:0.2, color: '#FF0000 '// 100% 处的颜色
-               },
-               {
-                 offset:0, color: '#CE0000' // 0% 处的颜色FF7A00
-               }, 
-              
-              ],
-            
-               global: false // 缺省为 false
-             }
-           }
-         },
-         lineStyle: {
-                    width: 3, // 设置线条宽度
-                },
+         showSymbol: false,
+          smooth: true,
+          data:arr,//res.rows[i].data
           })
         }
       }
@@ -268,46 +234,30 @@ const lineChart=()=>{
   // console.log(series.value);
   let myChart;
  myChart = echarts.init(document.getElementById('line2'));
-  let option = {
-     tooltip: {
-       trigger: 'axis',
-     },
-     grid: {
-       left: '0',
-       right: '0',
-       bottom: '10',
-       top:'20',
-       containLabel: true
-     },
-     xAxis: [
-       {
-         type: 'category',
-         data:steptimes.value,
-         splitLine: {
-           show: false,
-         },
-         axisLine: {
-           lineStyle: {
-             type: 'solid',
-             color: '#E6E7EC',//左边线的颜色
-             width:'1'//坐标线的宽度
-           }
-         },
-         axisLabel: {
-           textStyle: {
-             color: '#B8CED6',//坐标值得具体的颜色
-           }
-         }
-       }
-     ],
-     yAxis: [
-       {
-         type: 'value',  
-       }
-     ],
-     color: 'rgba(37, 190, 171, 1)',
-     series:series.value
-   }
+ let option = {
+  tooltip: {
+    trigger: 'axis'
+  },
+  // legend: {
+  //   data: ['Email', 'Union Ads', 'Video Ads', 'Direct', 'Search Engine']
+  // },
+  grid: {
+    left: '3%',
+    right: '4%',
+    bottom: '3%',
+    containLabel: true
+  },
+
+  xAxis: {
+    type: 'category',
+    boundaryGap: false,
+    data:steptimes.value,
+  },
+  yAxis: {
+    type: 'value'
+  },
+  series: series.value
+};
    myChart.setOption(option);
    window.onresize = function() {
     // 让图表自适应大小

+ 28 - 79
src/view/result/Wdisaster2.vue

@@ -117,46 +117,12 @@ const handleDelete=(event)=>{
             arr.push(res.rows[i].data[k].val);
           }
           // var arr = Array.from(Object.values(res.rows[i].data),x=>x);
-        series.value.push({
+          series.value.push({
          name:res.rows[i].code,
          type: 'line',
-      showSymbol: false,
-      smooth: true,
-      data:arr,//res.rows[i].data
-         itemStyle:{
-           normal:{
-             color: {
-               type: 'linear',
-               x: 0,
-               y: 0,
-               x2: 0,
-               y2: 1,
-               colorStops: [
-               {
-                 offset:1, color: '#ACD6FF ' // 0% 处的颜色
-               },
-               {
-                 offset:0.7, color: '#105CF0 '// 100% 处的颜色
-               },
-               {
-                 offset:0.66, color: '#FF7A00 '// 100% 处的颜色
-               },
-               {
-                 offset:0.2, color: '#FF0000 '// 100% 处的颜色
-               },
-               {
-                 offset:0, color: '#CE0000' // 0% 处的颜色FF7A00
-               }, 
-              
-              ],
-            
-               global: false // 缺省为 false
-             }
-           }
-         },
-         lineStyle: {
-                    width: 3, // 设置线条宽度
-                },
+         showSymbol: false,
+          smooth: true,
+          data:arr,//res.rows[i].data
           })
         }
       }
@@ -246,47 +212,30 @@ const lineChart=()=>{
   // console.log(series.value);
   let myChart;
  myChart = echarts.init(document.getElementById('line3'));
-  let option = {
-     tooltip: {
-       trigger: 'axis',
-     },
-     grid: {
-       left: '0',
-       right: '0',
-       bottom: '10',
-       top:'20',
-       containLabel: true
-     },
-     xAxis: [
-       {
-         type: 'category',
-         data:steptimes.value,
-         splitLine: {
-           show: false,
-         },
-         axisLine: {
-           lineStyle: {
-             type: 'solid',
-             color: '#E6E7EC',//左边线的颜色
-             width:'1'//坐标线的宽度
-           }
-         },
-         axisLabel: {
-           textStyle: {
-             color: '#B8CED6',//坐标值得具体的颜色
-           }
-         }
-       }
-     ],
-     yAxis: [
-       {
-         type: 'value',
-       
-       }
-     ],
-     color: 'rgba(37, 190, 171, 1)',
-     series:series.value
-   }
+ let option = {
+  tooltip: {
+    trigger: 'axis'
+  },
+  // legend: {
+  //   data: ['Email', 'Union Ads', 'Video Ads', 'Direct', 'Search Engine']
+  // },
+  grid: {
+    left: '3%',
+    right: '4%',
+    bottom: '3%',
+    containLabel: true
+  },
+
+  xAxis: {
+    type: 'category',
+    boundaryGap: false,
+    data:steptimes.value,
+  },
+  yAxis: {
+    type: 'value'
+  },
+  series: series.value
+};
    myChart.setOption(option);
    window.onresize = function() {
     // 让图表自适应大小