echarts条纹饼状图实现颜色渐变

var data = [];
var labelData = [];
var color = fColorGradualChange("#ffffff", "#00abee", 60)
for (var i = 0; i < 100; ++i) {
    data.push({
        value: Math.random() * 10 + 10 - Math.abs(i - 12),
        name: i + ':00'
    });
    labelData.push({
        value: 1,
        name: i ,
        itemStyle:{
            normal: {
                color: "#005197"
            }
        }
    });
}
for(var i=0;i<labelData.length;++i){
    if(labelData[i].name < 60){
        labelData[i].itemStyle = {
            normal: {
             color: color[i]
         }
        }
    }
}

option = {
    backgroundColor:'#100d40',
    title: {
        text: '60%',
        left: '50%',  
        textAlign: 'center',
        top: '45%',
        textStyle:{
            fontSize:60,
            color:'#fff'
        }
    },
    series: [{
        hoverAnimation:false,
        type: 'pie',
        data: labelData,
        radius: ['45%', '60%'],
        itemStyle: {
            normal: {
                borderWidth:2,
                borderColor: 'black'
            }
        },
        label: {
            normal: {
                position: 'inside',
                show:false,
            }
        }
    }]
};


/**
 *   颜色渐变
 *   num：颜色个数
 */
function fColorGradualChange(startColor, endColor, num) {
    var rgb = /^rgb|RGB\((([0-9]|[1-9]\d|1\d\d|2([0-4]\d|5[0-5])),){2}([0-9]|[1-9]\d|1\d\d|2([0-4]\d|5[0-5]))\)$/;    //rgb
    var hex = /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i; //16进制
    //颜色预处理
    var startRGB, endRGB;
    if (hex.test(startColor)) {
        startRGB = fAnalysisRGB(startColor);
    } else if (rgb.test(startColor)) {
        startRGB = startColor.substring(3, 15).split(',');
    }
    if (hex.test(endColor)) {
        endRGB = fAnalysisRGB(endColor);
    } else if (rgb.test(startColor)) {
        endRGB = endColor.substring(3, 15).split(',');
    }
    var startR = startRGB[0], startG = startRGB[1], startB = startRGB[2];
    var endR = endRGB[0], endG = endRGB[1], endB = endRGB[2];
 
    var sR = (endR - startR) / num;
    var sG = (endG - startG) / num;
    var sB = (endB - startB) / num;
 
    var colors = [];
    for (var i = 0; i < num; i++) {
        colors .push(fColorToHex(parseInt((sR * i + startR)), parseInt((sG * i + startG)), parseInt((sB * i + startB))));
    }
    return colors ;
}
 
 
/**
 *   解析rgb格式
 */
function fAnalysisRGB(color) {
    var color = color.toLowerCase().substring(1, color.length);
    var colors= [];
    colors.push(parseInt(color.substring(0, 2), 16))
    colors.push(parseInt(color.substring(2, 4), 16))
    colors.push(parseInt(color.substring(4, 6), 16))
    return colors;
}
 
/**
 *   rgb转hex
 */
function fColorToHex(r, g, b) {
    var hex = "#" + fAddZero(r.toString(16)) + fAddZero(g.toString(16)) + fAddZero(b.toString(16));
    return hex;
}
 
/**
 *   加0补位
 */
function fAddZero(v) {
    var newv = "00" + v;
    return newv.substring(newv.length - 2, newv.length);
}

颜色渐变方法此处转载