如图,想要这样的设计,文字和百分比都各自垂直对齐。
本来想要设置 legend.width ,但是设置了不生效,后来找到了原因。
orient=“horizontal” 的时候,只有width会起作用,height为auto;orient=“vertical” 的时候只有height会起作用,width为auto。
所以可以换种角度,用富文本实现。注意,rich
参数只有指定了 formatter
后才有效
legend: {
formatter: function (data) {
const { name, percent } = data;
return `{a|${name}}` + `{b|${percent}}`;
},
textStyle: {
rich: {
a: {
width: 120,
fontSize: 14,
fontWeight: 400,
},
b: {
fontSize: 16,
fontWeight: 700,
},
},
},
},