共计 342 个字符,预计需要花费 1 分钟才能阅读完成。
一、问题描述
echarts 图表的类目数据最多可以自适应到两行,超过两行的时候,会跟 X 轴坐标产生重叠。
二、处理方法
这里只描述思路,未提供具体代码。
计算方法:图表总高度 = grid + 间隙 1 + legend + 间隙 2 + dataZoom
除了 legend 高度外,其他高度都是固定的,因此难点在于动态计算 legend 高度,计算 legend 高度的思路如下:
1、获取图表总宽度 chartWidth
2、获取每个 legend 条目的宽度和间隙总和 legendWidth
3、获取 legend 行数,legendRowNum = legendWidth / chartWidth
4、获取 legend 总高度 = 行数乘以每行的高度,legendRowNum * perRowHeight
原文地址: echarts 图表 legend 高度自适应
正文完