配置项如下
var seriesData = [
{
name: "即办件",
value: 60,
num: 0.56,
},
{
name: "承诺件",
value: 299,
num: 0.3,
},
];
let total = '8215';
let title = "总经费";
//初始化
option = {
title: [{ //中间的文字内容
text: '{name|' + title + '}\n{val|' + total + '}',
top: 'center',
left: '20%',
textStyle: {
rich: {
name: {
fontSize: 14,
fontWeight: 'normal',
color: '#666666',
padding: [10, 0]
},
val: {
fontSize: 18,
fontWeight: 'bold',
color: '#333333',
}
}
}
},
{
text: '单位:个', //单位
top: 20,
left: 20,
textStyle: {
fontSize: 14,
color:'#666666',
fontWeight: 400
}
}],
legend: {
type: "plain",
icon: "",
left: "50%",
top: "25%",
align: "left",
height: "100%",
orient: "vertical",
itemGap: 10,
itemWidth: 10, // 设置宽度
itemHeight: 10, // 设置高度
symbolKeepAspect: false,
textStyle: {
rich: {
name: {
width: 30,
fontSize: 10,
color: "#ffffff",
},
value: {
align: "right",
width: 30,
fontSize: 15,
color: "#f2111a",
},
count: {
align: "right",
fontSize: 20,
width: 30,
padding: [10, 0, 0, 0],
color: "#f2111a",
},
count2: {
align: "right",
fontSize:31,
padding: [8, 0, 0, 0],
color: "#f2111a",
},
unit: {
color: "#ffffff",
fontSize: 15,
width: 20,
padding: [8, 0],
},
},
},
// data: seriesData.map((item) => item.name),
formatter: function (name) {
if (seriesData && seriesData.length) {
for (var i = 0; i < seriesData.length; i++) {
if (name === seriesData[i].name) {
return (
"{name| " + name + "}" +
"{count| " + seriesData[i].value + "} " +
"{unit|" + "万元" + "}" +
"{count2| " + seriesData[i].num + "%}"
);
}
}
}
},
},
series: [
{
name: "数量",
type: "pie",
radius: ["50%", "55%"],
center: ["25%", "50%"],
data: seriesData,
label: {
normal: {
show: false,
position: "center",
// formatter: '{text|{c}}\n{b}',
rich: {
text: {
padding: 8,
color: "#f2111a",
fontFamily: "LCDEF",
fontSize: 17,
},
name: {
fontSize: 18,
fontFamily: "LCDEF",
color: "#ffffff",
},
},
},
},
},
],
}