update 更新3d产线产品率

src/views/3DOverview/components/RightContentProductRate.vue

@@ -1,7 +1,5 @@
 <template>
-  <div style="height: calc(100% - 36px); width: 100%; position: relative;">
-    <div :id="id" ref="techy-line-chart" class="techy-chart" />
-  </div>
+  <div :id="id" ref="techy-line-chart" style="position: absolute; top: 0; left: 0; height: 100%; width: 100%; " />
 </template>
 
 <script>
@@ -33,18 +31,26 @@ export default {
     return {
       chart: null,
       option: {
-        color: ['#59CBE8', '#E93CAC', '#FF7345', '#9452FF', '#6A6E87', '#52FFF1'],
+        color: ['#59CBE8', '#FF7345', '#E93CAC', '#9452FF', '#6A6E87', '#52FFF1'],
         grid: {
-          top: '45%',
-          left: 0,
-          right: 12,
-          bottom: '5%',
+          top: '40%',
+          left: '5%',
+          right: '6%',
+          bottom: '10%',
           containLabel: true
         },
+        tooltip: {
+          show: true,
+          trigger: 'axis',
+          axisPointer: {
+            type: 'cross'
+          },
+          formatter: '{b}<br/>{a0}: {c}%<br />{a1}: {c1}%'
+        },
         legend: {
           width: '72%',
           top: '20%',
-          right: 12,
+          right: '6%',
           itemWidth: 12,
           itemHeight: 8,
           textStyle: {
@@ -62,7 +68,7 @@ export default {
             show: false
           },
           axisLabel: {
-            fontSize: 8,
+            fontSize: 10,
             color: '#fffa'
           },
           axisLine: {
@@ -73,19 +79,20 @@ export default {
         },
         yAxis: {
           type: 'value',
-          name: '成品率',
+          name: '成品率              ',
           min: 'dataMin',
-          splitNumber: 2,
+          splitNumber: 3,
           nameTextStyle: {
             color: '#fffc',
             align: 'right',
-            fontSize: 8
+            verticalAlign: 'bottom',
+            fontSize: 12
           },
           axisLine: {
             show: false
           },
           axisLabel: {
-            fontSize: 10,
+            fontSize: 11,
             color: '#fffa',
             formatter: '{value} %'
           },
@@ -270,7 +277,7 @@ export default {
 .techy-chart {
   /* background: #cccc; */
   position: absolute;
-  top: -36%;
+
   height: 150%;
   width: 100%;
 }