概述
echarts x轴标签文字过多导致显示不全/x轴旋转/x轴显示完全
这主要涉及两点:
1.grid设置距下端有距离
2.x轴rotate 设置
下面直接放在echarts官网的的普通柱状图实例里,调整就明白了。注意对比去掉grid和axisLabel的不同效果。
option = {
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat3333', 'Su332'],
axisLabel: {
rotate: 40
}
},
grid: {
left: "3%",
top: 130,
right: 60,
bottom: 50,
containLabel: true,
},
yAxis: {
type: 'value'
},
series: [{
data: [120, 200, 150, 80, 70, 110, 130],
type: 'bar'
}]
};
参考:https://blog.csdn.net/superlover_/article/details/79714823
最后
以上就是丰富玉米为你收集整理的echarts x轴标签文字过多导致显示不全/x轴旋转/x轴显示完全的全部内容,希望文章能够帮你解决echarts x轴标签文字过多导致显示不全/x轴旋转/x轴显示完全所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
发表评论 取消回复