https://blog.csdn.net/ypjmfc/article/details/78979319
代码是在参考文章基础上修改的:
var data = [
{value:40, name:'货币'},
{value:20, name:'股票'},
{value:40, name:'债券'}
]
option = {
tooltip: {
trigger: 'item',
formatter: "{a} <br/>{b}: {c} ({d}%)"
},
legend: {
orient: 'vertical',
right:200,
y: 'center',
itemGap:30,
itemWidth:8,
padding:10,
textStyle:{
fontSize: 12
},
align:'left',
data: [
{
name:'货币',
icon:'circle'
},
{
name:'股票',
icon:'circle'
},{
name:'债券',
icon:'circle'
}
],
formatter: function(name){
var total = 0;
var target;
for (var i = 0, l = data.length; i < l; i++) {
total += data[i].value;
if (data[i].name == name) {
target = data[i].value;
}
}
var arr = [
'{a|'+name+' :}{b|'+((target/total)*100).toFixed(2)+'%}'
]
return arr.join('\n')
},
textStyle:{
rich:{
a:{
fontSize:20,
align:'left',
padding:[0,0,0,10]
},
b:{
fontSize:20,
align:'right',
padding:[0,0,0,10],
lineHeight:25
}
}
},
backgroundColor: "#fff"
},
series: [
{
name: '访问来源',
type: 'pie',
radius: [50, 80],
center: ['50%', '50%'],
label: {
normal: {
show: false
},
emphasis: {
show: false
}
},
data: [
{
value: 40,
name: '货币',
itemStyle: { normal: { color: "#5877F0" } }
},
{ value: 20, name: '股票', itemStyle: { normal: { color: "#AA9FFD" } } },
{ value: 40, name: '债券', itemStyle: { normal: { color: "#F96481" } } }
]
}
]
};