echarts图表的x轴文字自适应换行的问题

image.png

image.png
            axisLabel: {//**该项配置重点关注**
              show: true,
              interval: 0,
              width: xLabelWidth - 10,
              overflow: "breakAll"
            }

interval: 0,是为了保证每个类目都能展示,默认值为auto,此时如果有超长类目,会隐藏该类目掉相邻的类目,保证有一条可以完整显示,不设为0的话即使超长类目名折行显示了,它相邻的类目还是无法展示。

overflow:“breakAll”,作用同word-break,值为break是普通的换行,值为breakAll会拆开连续的英语字符串并折行。

width,width的作用就是在文字长度超过多少px的时候执行换行。echarts的实例上有个getWidth方法,可以直接获取到当前图表的宽度,只需取到图表的宽度然后除以你类目的总长度即可计算出width,当然若图表grid设置了左右间隙则需减去相应的值

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容