option = {
backgroundColor: '#090d1a',
legend: {
show: true,
icon:'circle',
orient:'horizontal',
textStyle: {
color: '#FFFFFF',
fontSize: 12,
lineHeight: 20,
},
},
tooltip: {
show: false,
},
series: [
// 最外层圆
{
type: 'pie',
radius: ['70%', '60%'],
center: ['50%', '50%'],
hoverAnimation: false,
data: [
{
value: 30,
name: '已签合同数量',
itemStyle: {
normal: {
color: '#0984f2',
},
},
},
],
label: {
show: true,
position: 'outside',
formatter(param){
const {name,value} = param;
return name+':'+value;
},
fontSize:16,
color: '#FFFFFF',
},
labelLine: {
normal: {
length: 100,
length2: 10,
lineStyle: {
width: 1,
},
},
},
},
// 次外层圆
{
type: 'pie',
radius: ['60%', '50%'],
center: ['50%', '50%'],
hoverAnimation: false,
z: 10,
data: [
{
value: 10,
itemStyle: {
normal: {
color: '#042f65',
},
},
}
],
labelLine: {
show: false,
},
},
// 内层圆
{
type: 'pie',
radius: ['40%', '30%'],
center: ['50%', '50%'],
hoverAnimation: false,
z: 50,
data: [
{
value: 30,
name: '到货合同数量',
itemStyle: {
normal: {
color: '#15e961',
},
},
},
{
value: 30,
name: '已签合同数量',
itemStyle: {
normal: {
color: 'transparent',
},
},
}
],
label: {
show: true,
position: 'outside',
formatter(param){
let result ='';
const {name,value} = param;
if(name !== '已签合同数量'){
result = name+':'+value;
}
return result;
},
fontSize:16,
color: '#FFFFFF',
},
labelLine: {
normal: {
length: 100,
length2: 40,
lineStyle: {
width: 1,
},
},
},
},
// 次内层圆
{
type: 'pie',
radius: ['30%', '20%'],
center: ['50%', '50%'],
hoverAnimation: false,
z: 10,
data: [
{
value: 10,
itemStyle: {
normal: {
color: '#074944',
},
},
},
{
value: 10,
itemStyle: {
normal: {
color: 'transparent',
},
},
}
],
labelLine: {
show: false,
},
},
],
};