图表样式

src/views/cockpit/common/ThreeStackedBarAndLine.vue

@@ -33,20 +33,36 @@ export default {
                     },
                 },
                 grid: {
-                    top: '10%',
+                    top: '20%',
                     left: '3%',
                     right: '3%',
                     bottom: '5%',
                     containLabel: true,
                 },
                 color: ['#efc943', '#4ee1ac', '#186bb8'],
+
                 legend: {
-                    top: '1',
-                    data: ['意向', '进行中', '已完成'],
+                    // data: ['收储面积', '收储个数'],
+                    data: ['收储个数', '意向', '进行中', '已完成'],
+
+                    left: '7%',
+                    top: '1%',
+                    // textStyle: {
+                    //     color: "#666666"
+                    // },
                     textStyle: {
-                        fontSize: 12, // 字体大小
-                        color: '#B3CFFF' // 字体颜色
-                    }
+                        fontSize: 12,
+                        color: '#fff',
+                        padding: [5, 0, 0, 2],
+                        rich: {
+                            a: {
+                                verticalAlign: 'middle',
+                            },
+                        },
+                    },
+                    itemWidth: 15,
+                    itemHeight: 10,
+                    itemGap: 25
                 },
                 xAxis: [{
                     type: 'category',
@@ -96,11 +112,36 @@ export default {
                             color: 'rgba(239, 247, 253, .1)'
                         }
                     },
-                },],
+                }, {
+                    name: '',
+                    nameTextStyle: {
+                        color: "#fff",
+                        fontSize: 12,
+                        padding: [0, 0, 4, 0], //name文字位置 对应 上右下左
+                    },
+                    axisLabel: {
+                        interval: 0,
+                        show: true,
+                        fontSize: 10,
+                        color: '#fff',
+                    },
+                    axisLine: {
+                        show: false,
+                    },
+                    axisTick: {
+                        show: false,
+                    },
+                    splitLine: {
+                        show: false,
+                        lineStyle: {
+                            color: 'rgba(239, 247, 253, .1)'
+                        }
+                    },
+                }],
                 series: [
                     {
-                        name: '项目数量',
 
+                        name: "收储个数",
                         type: 'line',
                         smooth: true,
                         itemStyle: {
@@ -108,6 +149,7 @@ export default {
                                 color: '#FFCC64'  // 折线的颜色
                             }
                         },
+                        yAxisIndex: 1, // 指定使用第二个Y轴  
                         data: y1Data,
                     }, {
                         name: '意向',

src/views/cockpit/wpjg.vue

@@ -329,8 +329,8 @@ export default {
           right: legendType === 'center' ? 'center' : '2%',
           // data: ['监测图斑', '占用耕地', '占用永久基本农田', '违法占地'],
 
-          itemWidth: 12,
-          itemHeight: 12,
+          itemWidth: 15,
+          itemHeight: 10,
           itemGap: 20,
           icon: "rect",
           textStyle: {