倾斜显示之前写过了,在我Echarts标签里面可以找到。今天主要详解设置X轴文字省略显示、动态显示X轴标签文字
1.设置X轴文字省略显示,直接贴代码
xAxis: [
{
type: 'category',
data: _this.qyjyNameList,
// data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
axisTick: {
alignWithLabel: true
},
axisLabel: {
interval: 0,
rotate: 40,
// 超过4个字显示省略号
formatter: function (value) {
if (value.length > 4) {
return `${value.slice(0, 4)}...`;
}
return value;
}
}
}
]
如图:
2.动态设置X轴标签文字,当x轴数据有3条以上需要倾斜,否则就正常显示
想要的效果:
改变rotate属性
只需要一个三元表达式就搞定了
作者:微微一笑绝绝子
出处:https://www.cnblogs.com/wwyxjjz/p/15243852.html
本博客文章均为作者原创,转载请注明作者和原文链接。