一个阶段完成

manpower/js/index2.js

@@ -164,7 +164,7 @@ let app = new Vue({
     }
   },
   methods: {
-    handleShowTip(index) {
+    handleShowTip (index) {
       this.showTip = true
       this.tipNum = index
     },
@@ -558,7 +558,7 @@ let app = new Vue({
             name: '全员劳动生产率同比变化',
             type: 'line',
             barWidth: 15,
-            yAxisIndex: 1,
+            // yAxisIndex: 1,
             itemStyle: {
               normal: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -656,7 +656,7 @@ let app = new Vue({
             name: '人工成本利润率同比变化',
             type: 'line',
             barWidth: 15,
-            yAxisIndex: 1,
+            // yAxisIndex: 1,
             itemStyle: {
               normal: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -763,7 +763,7 @@ let app = new Vue({
               width: 2,
             },
             data: dataC1[0],
-           
+
           },
           {
             name: '全员劳动生产率同比变化',
@@ -1142,6 +1142,7 @@ let app = new Vue({
           },
           {
             name: '2022年累计招聘数',
+            yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
             type: 'bar',
             barWidth: 15,
             itemStyle: {
@@ -1173,6 +1174,13 @@ let app = new Vue({
         axisLine: {
           show: false,
         },
+        axisLabel: {
+          show: true,
+          formatter: '{value} %',
+          textStyle: {
+            color: 'rgba(250,250,250,0.6)',
+          },
+        },
       })
       myChart.setOption(option)
     },
@@ -1429,13 +1437,13 @@ let app = new Vue({
         trigger: 'axis',
         formatter: '{a0}:{c0}' + '%'
       },
-      option.yAxis[0].axisLabel = {
-        show: true,
+        option.yAxis[0].axisLabel = {
+          show: true,
           formatter: '{value} %',
           textStyle: {
             color: 'rgba(250,250,250,0.6)',
           },
-      }
+        }
       myChart.setOption(option)
     },
     initChartR8 () {
@@ -1470,13 +1478,13 @@ let app = new Vue({
         trigger: 'axis',
         formatter: '{a0}:{c0}' + '%'
       },
-      option.yAxis[0].axisLabel = {
-        show: true,
+        option.yAxis[0].axisLabel = {
+          show: true,
           formatter: '{value} %',
           textStyle: {
             color: 'rgba(250,250,250,0.6)',
           },
-      }
+        }
 
       myChart.setOption(option)
     },

manpower/js/index3.js

@@ -164,7 +164,7 @@ let app = new Vue({
     }
   },
   methods: {
-    handleShowTip(index) {
+    handleShowTip (index) {
       this.showTip = true
       this.tipNum = index
     },
@@ -557,7 +557,7 @@ let app = new Vue({
             name: '全员劳动生产率同比变化',
             type: 'line',
             barWidth: 15,
-            yAxisIndex: 1,
+            // yAxisIndex: 1,
             itemStyle: {
               normal: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -655,7 +655,7 @@ let app = new Vue({
             name: '人工成本利润率同比变化',
             type: 'line',
             barWidth: 15,
-            yAxisIndex: 1,
+            // yAxisIndex: 1,
             itemStyle: {
               normal: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -1140,6 +1140,7 @@ let app = new Vue({
           },
           {
             name: '2022年累计招聘数',
+            yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
             type: 'bar',
             barWidth: 15,
             itemStyle: {
@@ -1163,6 +1164,21 @@ let app = new Vue({
       option.title.text = '各三级企业年利润与招聘情况分析'
       option.legend.data = ['2022年利润(万）', '2022年累计招聘数']
       option.legend.show = true
+      option.yAxis[0].max = function (value) {
+        if (Math.abs(value.max) > Math.abs(value.min)) {
+          return (Math.abs(value.max) * 1.2).toFixed(2);
+        } else {
+          return (Math.abs(value.min) * 1.2).toFixed(2);
+        }
+      }
+      option.yAxis[0].min = function (value) {
+        if (Math.abs(value.max) > Math.abs(value.min)) {
+          return (-Math.abs(value.max) * 1.2).toFixed(2);
+        } else {
+          return (-Math.abs(value.min) * 1.2).toFixed(2);
+        }
+      }
+
       option.yAxis.push({
         splitLine: {
           show: false,
@@ -1170,6 +1186,28 @@ let app = new Vue({
         axisLine: {
           show: false,
         },
+        axisLabel: {
+          show: true,
+          formatter: '{value}',
+          textStyle: {
+            color: 'rgba(250,250,250,0.6)',
+          },
+        },
+        max: function (value) {
+          if (Math.abs(value.max) > Math.abs(value.min)) {
+            return (Math.abs(value.max) * 1.2).toFixed(2);
+          } else {
+            return (Math.abs(value.min) * 1.2).toFixed(2);
+          }
+        },
+        min: function (value) {
+          if (Math.abs(value.max) > Math.abs(value.min)) {
+            return (-Math.abs(value.max) * 1.2).toFixed(2);
+          } else {
+            return (-Math.abs(value.min) * 1.2).toFixed(2);
+          }
+        }
+
       })
       // option.yAxis = [
       //   {
@@ -1455,10 +1493,10 @@ let app = new Vue({
       }
       option.yAxis[0].axisLabel = {
         show: true,
-          formatter: '{value} %',
-          textStyle: {
-            color: 'rgba(250,250,250,0.6)',
-          },
+        formatter: '{value} %',
+        textStyle: {
+          color: 'rgba(250,250,250,0.6)',
+        },
       }
       myChart.setOption(option)
     },
@@ -1496,10 +1534,10 @@ let app = new Vue({
       }
       option.yAxis[0].axisLabel = {
         show: true,
-          formatter: '{value} %',
-          textStyle: {
-            color: 'rgba(250,250,250,0.6)',
-          },
+        formatter: '{value} %',
+        textStyle: {
+          color: 'rgba(250,250,250,0.6)',
+        },
       }
       myChart.setOption(option)
     },

manpower/js/index4.js

@@ -163,7 +163,7 @@ let app = new Vue({
     }
   },
   methods: {
-    handleShowTip(index) {
+    handleShowTip (index) {
       this.showTip = true
       this.tipNum = index
     },
@@ -556,7 +556,7 @@ let app = new Vue({
             name: '全员劳动生产率同比变化',
             type: 'line',
             barWidth: 15,
-            yAxisIndex: 1,
+            // yAxisIndex: 1,
             itemStyle: {
               normal: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -654,7 +654,7 @@ let app = new Vue({
             name: '人工成本利润率同比变化',
             type: 'line',
             barWidth: 15,
-            yAxisIndex: 1,
+            // yAxisIndex: 1,
             itemStyle: {
               normal: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -939,7 +939,7 @@ let app = new Vue({
       option.legend.show = true
       option.tooltip = {
         trigger: 'axis',
-        formatter: '{a0}:{c0}'+ '%' + '<br/>' + '{a1}:{c1}' + '%'
+        formatter: '{a0}:{c0}' + '%' + '<br/>' + '{a1}:{c1}' + '%'
       }
       option.grid.right = '15%'
       option.yAxis = [
@@ -1140,6 +1140,7 @@ let app = new Vue({
           {
             name: '2022年累计招聘数',
             type: 'bar',
+            yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
             barWidth: 15,
             itemStyle: {
               normal: {
@@ -1162,6 +1163,21 @@ let app = new Vue({
       option.title.text = '各四级企业年利润与招聘情况分析'
       option.legend.data = ['2022年利润(万）', '2022年累计招聘数']
       option.legend.show = true
+      option.yAxis[0].max = function (value) {
+        if (Math.abs(value.max) > Math.abs(value.min)) {
+          return (Math.abs(value.max) * 1.2).toFixed(2);
+        } else {
+          return (Math.abs(value.min) * 1.2).toFixed(2);
+        }
+      }
+      option.yAxis[0].min = function (value) {
+        if (Math.abs(value.max) > Math.abs(value.min)) {
+          return (-Math.abs(value.max) * 1.2).toFixed(2);
+        } else {
+          return (-Math.abs(value.min) * 1.2).toFixed(2);
+        }
+      }
+
       option.yAxis.push({
         max: function (val) {
           if (Math.abs(val.max) > Math.abs(val.min)) {
@@ -1183,6 +1199,13 @@ let app = new Vue({
         axisLine: {
           show: false,
         },
+        axisLabel: {
+          show: true,
+          formatter: '{value}',
+          textStyle: {
+            color: 'rgba(250,250,250,0.6)',
+          },
+        },
       })
       myChart.setOption(option)
     },
@@ -1437,10 +1460,10 @@ let app = new Vue({
       }
       option.yAxis[0].axisLabel = {
         show: true,
-          formatter: '{value} %',
-          textStyle: {
-            color: 'rgba(250,250,250,0.6)',
-          },
+        formatter: '{value} %',
+        textStyle: {
+          color: 'rgba(250,250,250,0.6)',
+        },
       }
       myChart.setOption(option)
     },
@@ -1478,10 +1501,10 @@ let app = new Vue({
       }
       option.yAxis[0].axisLabel = {
         show: true,
-          formatter: '{value} %',
-          textStyle: {
-            color: 'rgba(250,250,250,0.6)',
-          },
+        formatter: '{value} %',
+        textStyle: {
+          color: 'rgba(250,250,250,0.6)',
+        },
       }
       myChart.setOption(option)
     },