效果图:
实现代码:
var data = [{value: 85}];
var num = data[0].value / 100
var option = {
backgroundColor: '#fff',
series: [{
type: 'gauge',
splitNumber: 1,
axisTick: { show: false },
axisLabel: { show: false, },
axisLine: {
lineStyle: {
color: [
[num, new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
offset: 0.1,
color: "#ec600d"
},
{
offset: 0.6,
color: "#FFC600"
},
{
offset: 1,
color: "#3cf725"
}
])],
[1, '#efefef']
],
width: 35
}
},
radius: '80%',
center: ['50%', '80%'],
startAngle: 180,
endAngle: 0,
pointer: {
length: '100%',
width: 2
},
itemStyle: {
normal: {
color: '#000000'
}
},
title: {
show: true,
offsetCenter: [0, '25%'],
textStyle: {
fontSize: 13
}
},
detail: {
show: false,
offsetCenter: ['100%', '-95%'],
formatter: '{value}%',
textStyle: {
fontSize: 20,
color: '#FA8536'
}
},
data: data
}]
};