echarts x轴或y轴文本字体颜色改变 - 童心小城 - 博客园

1：x轴文本字体颜色改变

xAxis : [
                    {
                        type : 'category',
                        data : ['<30','30-','40-','50-','60-','>=70'],
                        axisLabel: {
                            show: true,
                            textStyle: {
                                color: '#fff'
                            }
                        }
                    }
                ]

2.y轴文本字体颜色改变

yAxis : [
                    {
                        type : 'value',
                        name : '%',
                        axisLabel : {
                            formatter: '{value}',
                            textStyle: {
                                color: '#fff'
                            }
                        }
                    }
        ]

3.修改前面几个颜色后面几个颜色

xAxis: [
              {
                type: "category",
                data: xdata,["广州","深圳",],
                axisLabel: {
                  color: "#D3E4FF",
                  fontFamily: "PingFangSC-Medium",
                  fontSize: 14,
                  clickable: true,
                  textStyle: {
                    color: function (params, index) {
                      let colorValue;
                      if (index <= 5) {
                        colorValue = "#32CC7F";//前面6个
                      } else if (index > 5 && index <= 14) {
                        colorValue = "#FFA800";//中间9个
                      } else if (index > 8) {
                        colorValue = "#F81D22";//后面的几个
                      }
                      return colorValue;
                    },
                  },
                },
              },
            ],

设置x轴间隔显示 interval: 1

var myChart12 = echarts.init(document.getElementById('chart12'));
        option12 = {
            color: ['#63AFF9'],
            xAxis: {
                type: 'category',
                data:["示范区", "禹王台区", "龙亭区"],
                axisLabel: {
                    interval: 1  //0：表示全部显示不间隔；auto:表示自动根据刻度个数和宽度自动设置间隔个数
                }
            },
            yAxis: {
                type: 'value',
                name: '家'
            },
            series: [{undefined
                data: [80, 32, 90, 34, 129, 133, 130, 200, 16, 150, 188, 178, 156],
                type: 'line'
            }]
        };
        myChart12.setOption(option12)