类似 (https://www.visactor.io/vchart/demo/bar-chart/basic-bar)这样的条形图,
当轴标签非常长的时候,怎么实现换行?截断相关效果
类似 (https://www.visactor.io/vchart/demo/bar-chart/basic-bar)这样的条形图,
当轴标签非常长的时候,怎么实现换行?截断相关效果
10 回答11.2k 阅读
5 回答4.9k 阅读✓ 已解决
4 回答3.2k 阅读✓ 已解决
2 回答2.8k 阅读✓ 已解决
3 回答5.2k 阅读✓ 已解决
1 回答3.3k 阅读✓ 已解决
3 回答2.4k 阅读✓ 已解决
解决方案 Solution
不同图表库的解决方案不一样,根据你给的demo,在VChart中只需要配置axes 中对应轴的
label
相关配置:formatMethod
返回数组,可以实现自定义换行style.maxLineWidth
可以实现自动截断style.ellipsis
可以设置省略符代码示例
Code Example
结果展示
在线效果参考:https://codesandbox.io/s/axis-label-auto-limit-pnsvzl
相关文档
坐标轴demo:https://www.visactor.io/vchart/demo/axis/animation
坐标轴教程:https://www.visactor.io/vchart/guide/tutorial_docs/Chart_Conc...
相关配置:https://www.visactor.io/vchart/option/barChart#axes-band.labe...
github:https://github.com/VisActor/VChart