echarts 圆环分布图

option = {
    title: {
	text: '75%',
	textStyle: {
		color: '#48FFFF',
		fontSize: 12
	},
	left: 'center',
	top: 'center'
},
angleAxis: {
	max: 100, // 满分
	clockwise: false, // 逆时针
    // 隐藏刻度线
	axisLine: {
		show: false
	},
	axisTick: {
		show: false
	},
	axisLabel: {
		show: false
	},
	splitLine: {
		show: false
	}
},
radiusAxis: {
	type: 'category',
    // 隐藏刻度线
	axisLine: {
		show: false
    },
    axisTick: {
		show: false
    },
    axisLabel: {
		show: false
    },
    splitLine: {
		show: false
    }
  },
polar: {
	center: ['50%', '50%'],
	radius: '140%' //图形大小
},
series: [{
	type: 'bar',
    data: [{
		name: '作文得分',
		value: 25,
		itemStyle: {
			normal: {
				color: { // 完成的圆环的颜色
                    colorStops: [{
                        offset: 0,
                        color: '#48FFFF' // 0% 处的颜色
                    }, {
                        offset: 0.5,
                        color: '#3B4068' // 100% 处的颜色
                    }]
                }
			}
		},
    },],
	coordinateSystem: 'polar',
	roundCap: true,
	barWidth: 25,
	barGap: '-100%', // 两环重叠
	radius: ['49%', '52%'],
	z: 5,
},{ // 灰色环
    type: 'bar',
    data: [{
		value: 100,
		itemStyle: {
			color: '#3B4068',
		}
    }],
    coordinateSystem: 'polar',
    roundCap: true,
    barWidth: 35,
    barGap: '-90%', // 两环重叠
    radius: ['48%', '53%'],
    z: 1
  },
  { // 黄色
    type: 'bar',
    data: [{
		value: 50,
    	itemStyle: {
    			normal: {
    				color: { // 完成的圆环的颜色
                        colorStops: [{
                            offset: 0,
                            color: '#3B4068' // 0% 处的颜色
                        }, {
                            offset: 1,
                            color: 'yellow' // 100% 处的颜色
                        }]
                    }
    			}
    		},
    }],
    coordinateSystem: 'polar',
    roundCap: true,
    barWidth: 25,
    barGap: '-100%', // 两环重叠
    radius: ['70%', '90%'],
    z: 2
  },
  { // 绿色
    type: 'bar',
    data: [{
		value: 80,
    	itemStyle: {
    			normal: {
    				color: { // 完成的圆环的颜色
                        colorStops: [{
                            offset: 0.6,
                            color: '#3B4068' // 0% 处的颜色
                        }, {
                            offset: 1,
                            color: 'blue' // 100% 处的颜色
                        }]
                    }
    			}
    		},
    }],
    coordinateSystem: 'polar',
    roundCap: true,
    barWidth: 25,
    barGap: '-100%', // 两环重叠
    radius: ['80%', '90%'],
    z:1
  }]
 
}