What problem does this feature solve?
Based on this issue: #7887
We need our chart to adapt the height/width of the legends both vertical and horizontal type so that items doesn't overflow onto the graph area. Currently they only way is to hardcode a pixel/percentage value but it's not responsive.
1条答案
按热度按时间f87krz0w1#
There is a way in which you can make it dynamic.
The idea is to retrieve the maximum length (in characters) and give that spacing to the grid (by multiplying it by X, depending on the font size).
MaxLength:
let maxLength = 0;const series = option.series.map((key) => {if (key.name.length > maxLength) {maxLength = key.name.length;}....GRid like this:
grid: {containLabel: true,right: showLegend ? maxLength * 9 : 40,bottom: 80,},and thats it :)