echarts实现颜色渐变的环状图(包括自定义各种配置项的属性)

实现效果:

echarts实现颜色渐变的环状图(包括自定义各种配置项的属性)_第1张图片

实现代码:

option = {
    color: [new echarts.graphic.LinearGradient(1, 1, 0, 0, [{
        offset: 0,
        color: '#F2A635'
    },
    {
        offset: 0.9,
        color: '#ffffff'
    }]), new echarts.graphic.LinearGradient(1, 1, 0, 0, [{
        offset: 0,
        color: '#26DCCE'
    },
    {
        offset: 0.9,
        color: '#ffffff'
    }]), new echarts.graphic.LinearGradient(1, 1, 0, 0, [{
        offset: 0,
        color: '#352CFE'
    },
    {
        offset: 0.9,
        color: '#ffffff'
    }]), new echarts.graphic.LinearGradient(1, 1, 0, 0, [{
        offset: 0,
        color: '#D285FE'
    },
    {
        offset: 0.9,
        color: '#ffffff'
    }])],
    tooltip: {
        trigger: 'item',
        formatter: "{a} 
{b} : {c} ({d}%)", textStyle: { fontSize: 18 } }, legend: { orient: 'vertical', x: 'left', y: 'center', itemGap: 20, itemWidth: 30, itemHeight: 20, textStyle: { color: '#000', fontSize: 25 }, data: ['初创型<=5年', '成长型5-10年', '发展型10-20年', '老字号>20年'] }, toolbox: { show: false, feature: { mark: { show: true }, dataView: { show: true, readOnly: false }, magicType: { show: true, type: ['pie', 'funnel'], option: { funnel: { x: '25%', width: '50%', funnelAlign: 'center', max: 1548 } } }, restore: { show: true }, saveAsImage: { show: true } } }, calculable: true, series: [{ name: '企业类型', type: 'pie', radius: ['40%', '70%'], center: ['60%', '50%'], roseType: 'radius', itemStyle: { normal: { label: { show: false }, labelLine: { show: true } }, emphasis: { label: { show: false, position: 'outer', textStyle: { fontSize: '15', fontWeight: 'bold', color: 'white' } } } }, data: [{ value: 335, name: '初创型<=5年' }, { value: 310, name: '成长型5-10年' }, { value: 234, name: '发展型10-20年' }, { value: 135, name: '老字号>20年' }] }] };

 

你可能感兴趣的:(echarts实现颜色渐变的环状图(包括自定义各种配置项的属性))