ECharts 坐标轴文字显示不全(倾斜处理)

ECharts横坐标文字倾斜,有的时候因为X轴的坐标文字较长,无法水平展示,又要全部显示,这时候就需要倾斜文字显示,当然我做这个不是因为无法显示,因为我们的设计就是斜着的哈哈。(你要是想y轴倾斜也是一样的配置)

用到的是xAxis.axisLabel 属性

axisLabel: {
              interval:0, //坐标刻度之间的显示间隔,默认就可以了(默认是不重叠)
               rotate:38   //调整数值改变倾斜的幅度(范围-90到90)
            }

那么问题来了,此时效果如下

很明显在文字过长的时候文字下方被切掉了,还是显示不全

这时候需要grid属性


grid: {
left: '18%',
bottom:'38%'
},

这样就好了,这些属性具体的使用方法可以查看ECharts的官方文档写的很详细,也很易懂,这里附上官方API地址

https://echarts.baidu.com/option.html#toolbox

  • 9
    点赞
  • 27
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值