Echarts使用问题问题集合

一：Echarts使用问题--Y轴文字被遮住的解决办法

问题：今天要解决的是Y轴文字被遮住的问题。

被遮住的样式：

image.png

解决办法：

使用grid的left与right解决：

  options: {
    grid: {
         left: '1%',
         right: '7%',
         bottom: '10%',
         containLabel: true,
        },                                                           
}

解决后的样式：

image.png

二：Echarts使用问题--Y轴字体过大导致图的部分拥挤

问题：Echarts使用问题--Y轴字体过大导致图的部分拥挤

image.png

解决办法：

使用grid的left与right解决：

  options: {
     yAxis: {
                        type: 'value',
                        // y轴的字段修改
                        axisLabel: {
                            formatter: '{value} °C',
                            // 控制Y轴字体大小和颜色
                            textStyle: {
                                fontSize: '8', // 控制Y轴label字体大小
                                color: 'red', // 控制Y轴label字体颜色
                            },
                        }
                    },                                                       
  }

解决后的样式：

image.png