效果
代码
{
type : 'liquidFill' ,
shape : shapes[ 0 ] . value,
radius : '90%' ,
data : [
{
name : '独立百货' ,
value : 0
}
] ,
center : [ '50%' , '50%' ] ,
color : [
{
type : 'linear' ,
x : 0 ,
y : 0 ,
x2 : 0 ,
y2 : 1 ,
colorStops : [
{
offset : 0 ,
color : '#446bf5'
} ,
{
offset : 1 ,
color : '#2ca3e2'
}
] ,
globalCoord : false
}
] ,
backgroundStyle : {
borderWidth : 1 ,
color : 'rgba(51, 66, 127, 0.7)'
} ,
label : {
normal : {
textStyle : {
color : '#fff'
} ,
formatter : '独立百货\n\n{c}' ,
fontSize : 28 ,
}
} ,
outline : {
show : false ,
borderDistance : 10 ,
itemStyle : {
borderWidth : 2 ,
borderColor : '#112165'
}
}
}
设置水波纹下的文字颜色
label : {
normal : {
textStyle : {
color : '#fff'
} ,
insideColor : 'red' ,
formatter : '独立百货\n\n{c}' ,
fontSize : 28 ,
}
} ,
自定义文字
label : {
normal : {
textStyle : {
color : '#fff'
} ,
formatter : function ( params ) {
return '{title|' + params. name+ '}' + '\n' + '{value|' + params. value. toFixed ( 2 ) * 100 + '%' + '}' ;
} ,
fontSize : 28 ,
rich : {
title : {
fontSize : '18px' ,
} ,
value : {
fontSize : '42px' ,
}
} ,
} ,
} ,
测试数据
{
"source" : [ {
"name" : "独立百货" ,
"value" : 0.5
} ]
}