pie渐变色

描述:当前是关于Echarts图表中的 饼图 示例。
 
            let demo = [
  {
    "x": "生效裁判",
    "y": 0.61078,
    "unit":""
  }
];
let datayy = _Data();
option =  {
    backgroundColor:'#041F34',	
	graphic:{
        type:"text",
        left:"center",
        top:"35%",
        z:4,
        zlevel:6,
        style:{
            text:datayy[0].unit?(datayy[0].value + datayy[0].unit):(parseInt(datayy[0].value*100) + '%'),
            fill:"#fff",
            textFont: 'normal 30px Roboto-Medium',
            textAlign:"center"
            
        }
    },
	series: [
			{
	            type: 'pie',
	           	zlevel:1,
	            silent:true,
	            radius: ['96%', '97%'],
	            hoverAnimation:false,
	           // animation:false,    //charts3 no
	            label: {
	                normal: {
	                    show: false
	                },
	              
	            },
	            labelLine: {
	                normal: {
	                    show: false
	                }
	            },
	          
	            data: _pie1()
	        },
	        {
	          
	            type: 'pie',
	           	zlevel:2,
	            silent:true,
	            radius: ['95%', '98%'],
	            startAngle: -65,
	            //hoverAnimation:false,
	            //animation:false,
	            label: {
	                normal: {
	                    show: false
	                },
	              
	            },
	            labelLine: {
	                normal: {
	                    show: false
	                }
	            },
	          
	            data: _pie2()
	        },
	        {
	           
	            type: 'pie',
	           	zlevel:1,
	            silent:true,
	            radius: ['65%', '70%'],
	            hoverAnimation:false,
	           // animation:false,
	            label: {
	                normal: {
	                    show: false
	                },
	              
	            },
	            labelLine: {
	                normal: {
	                    show: false
	                }
	            },
	          
	            data: [{
	            		name: 'pie1',
	                    value: 20,
	                    itemStyle:{
	                        normal:{
	                            color: "#588ec5",
	                            borderWidth:0,
	                            borderColor:"rgba(0,0,0,0)"                                                  
	                        }
	                    }
	            	}]
	        }, 
			{
	         	
	            type: 'pie',
	           	zlevel:2,
	            silent:true,
	            radius: ['0%', '65%'],
	            hoverAnimation:false,
	           // animation:false,
	            label: {
	                normal: {
	                    show: false
	                },
	              
	            },
	            labelLine: {
	                normal: {
	                    show: false
	                }
	            },
	          
	            data: [{
	            		name: 'pie1',
	                    value: 20,
	                    itemStyle:{
	                        normal:{
	                            color: "rgba(0,0,0,0.4)",
	                                                              
	                        }
	                    }
	            	}]
	        },
	        {						
	            type: 'pie',
	           	zlevel:4,
	            silent:true,
	            radius: ['0', '70%'],
	           // hoverAnimation:false,
	            //animation:false,
	            label: {
	                normal: {
	                    show: false
	                },
	              
	            },
	            labelLine: {
	                normal: {
	                    show: false
	                }
	            },		          
	            data: _pieData(datayy)			                 			               			            																		
			}

	]

}

function _pie1(){
    let dataArr = [];
    for(var i=0;i<8;i++){
       
        dataArr.push({
    		name: (i+1).toString(),
            value: 20,
            itemStyle:{
                normal:{
                    color: "rgba(88,142,197,0.4)",
                    borderWidth:0,
                    borderColor:"rgba(0,0,0,0)"                                                  
                }
            }
    	})
        
    }
    return dataArr

}
function _pie2(){
    let dataArr = [];
    for(var i=0;i<8;i++){
        if(i%2 === 0){
            dataArr.push({
        		name: (i+1).toString(),
                value: 25,
                itemStyle:{
                    normal:{
                        color: "rgba(88,142,197,0.5)",
                        borderWidth:0,
                        borderColor:"rgba(0,0,0,0)"                                                  
                    }
                }
        	})
        }else{
            dataArr.push({
        		name: (i+1).toString(),
                value: 20,
                itemStyle:{
                    normal:{
                        color: "rgba(0,0,0,0)",
                        borderWidth:0,
                        borderColor:"rgba(0,0,0,0)"                                                  
                    }
                }
        	})
        }
        
    }
    return dataArr

}
function _pieData(data){
	let _data = data;	
	let dataArr = [];
	for(var i=0;i<5;i++){
		if(i === 2 ){
			let dt = (data[0].unit)?25:(Number(data[0].value));
			dataArr.push({
				name: (i+1).toString(),
                value: dt,                    
                itemStyle:{
                    normal:{
                    	
						color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
								offset: 0,
								color: 'rgb(147,187,216)'
							}, {
								offset: 1,
								color: '#588ec5'
						}]),
                        borderWidth:0,
                        borderColor:"rgba(0,0,0,0.4)"
                        
                    }
                }
			})
		}else{
			let dta = (data[0].unit)?25:(1-Number(data[0].value))/4;			
			dataArr.push({
				name: (i+1).toString(),
                value: dta,
                itemStyle:{
                    normal:{
                        color: "rgba(0,0,0,0)",
                        borderWidth:0,
                        borderColor:"rgba(0,0,0,0)"                                                  
                    }
                }
			})
		}
		
	}
	//console.log(dataArr)
	return dataArr
}
function _Data() {
	let yData = [];
	if (demo) {
		demo.map(item => {
			yData.push({
				name: "",
				value: item.y,
				unit:item.unit
			})
		})
	}

	return yData;
}