Echarts 实现仪表盘轴线颜色扇形渐变

<body>

// 基于准备好的dom，初始化echarts实例

var myChart = echarts.init(document.getElementById('main'));

// 指定图表的配置项和数据

var option = {

tooltip: {

formatter: '{a} <br/>{b} : {c}%'

series: [

{

name: '业务指标',

type: 'gauge',

detail: {formatter: '{value}%'},

data: [{value: 1, name: '完成率'}],

axisLine: { // 坐标轴线

lineStyle: { // 属性lineStyle控制线条样式

color: [

[0.1, 'red'],

[0.3, new echarts.graphic.LinearGradient(

0, 1, 0, 0,

[{

offset: 0,

color: 'red'

}, {

offset: 0.8,

color: 'rgb(235,205,6)'

}]

)],

[0.7, 'rgb(235,205,6)'],

[0.9, new echarts.graphic.LinearGradient(

0, 1, 0, 0,

[{

offset: 0,

color: 'rgb(13,211,97)'

}, {

offset: 0.6,

color: 'rgb(235,205,6)'

}]

)],

[1, 'rgb(13,211,97)']

}

]

};

// 使用刚指定的配置项和数据显示图表。

myChart.setOption(option);

</script>

</body>