效果图
配置代码: label.formmatter
formmatter 回调函数要配合rich 属性
option3: {
title: {
text: '各优惠券领取比',
left: 'center',
},
tooltip: {
trigger: 'item',
},
legend: {
orient: 'vertical',
left: 'right',
},
color: ['#45C2E0', '#C1EBDD', '#FFC851', '#5A5476', '#1869A0', '#FF9393'],
series: [
{
name: '优惠券',
type: 'pie',
radius: '50%',
data: [
{
value: 1048,
name: '优惠券1',
percent: '40',
num: '个数',
},
{ value: 735, name: '优惠券2 ', percent: '35', num: '个数' },
{ value: 580, name: '优惠券3', percent: '25', num: '个数' },
],
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)',
},
},
label: {
position: 'inner', //标签的位置
formatter: function (params) {
console.log(params);
let str =
'{a|' +
params.data.name +
'}{abg|}\n{hr|}\n {b|' +
'百分比' +
':} {per|' +
params.data.percent +
'%}' +
'{abg|}\n{hr|}\n {b|' +
'个数' +
':} {per|' +
params.data.value +
'}';
return str;
},
rich: {
a: {
color: '#6E7079',
align: 'center',
fontWeight: 'bold',
},
b: {
color: '#4C5058',
fontSize: 14,
fontWeight: 'bold',
},
per: {
color: '#4C5058',
},
},
},
},
],
},