echarts图表X轴倾斜角度设置

有时候X轴会因为数据过长,不能正常显示或被遮挡,这时候可以设置X轴倾斜或竖着显示来节约空间。

配置如下

        option = {
            grid: {},
            xAxis: {
                type: 'category',
                boundaryGap: false,
                axisLabel: {
                    show: true,
                    textStyle: {
                        color: '#fff'
                    },
                    interval: 0, //显示所有X轴信息
                    rotate: 40 //倾斜角度
                },
            },
            yAxis: {},
            series: []
        };

interval

坐标轴刻度标签的显示间隔
例如 :0为显示所有X轴信息,1为每间隔一个显示,2为每间隔两个显示….,中间的会被隐藏,依次类推。

rotate

标签倾斜的角度,旋转的角度是-90到90度。

效果如图

发表评论