Echart设置x轴文字数据不隐藏
Echart设置x轴文字数据不隐藏
平常的引入:
会出现x轴文字数据部分隐藏,如下:
但我们一般是不希望隐藏的,如图:
解决方法:设置axisLabel属性
// xAxis的属性,设置x轴文本不隐藏,同理yAxis也有 axisLabel: { interval: 0, // 坐标轴刻度标签的显示间隔 rotate: 40 // 标签倾斜的角度 }
option = { color: ['#3398DB'], tooltip: { trigger: 'axis', axisPointer: { // 坐标轴指示器,坐标轴触发有效 type: 'shadow' // 默认为直线,可选为:'line' | 'shadow' } }, legend: { data: ['访客数'] }, grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true }, xAxis: { type: 'category', data: ['1页', '2页', '3页', '4页', '5页', '6-10页', '11-20页', '20+页'], // xAxis的属性,设置x轴文本不隐藏,同理yAxis也有 axisLabel: { interval: 0, // 坐标轴刻度标签的显示间隔 rotate: 40 // 标签倾斜的角度 } }, yAxis: { type: 'value' }, series: [{ name: '访客数', data: [0.7, 0.2, 0.8, 0.3, 0.4, 1, 0.5, 0.5], type: 'bar', barWidth: '80%', showBackground: true, backgroundStyle: { color: 'rgba(220, 220, 220, 0.8)' // 剩余部分背景图 } }] }