echart 仪表盘gauge 参数详解

 /*仪表盘*/
	        var gaugeChart = echarts.init(document.getElementById('gaugeChart'));
	        let inputValue = parseInt(Math.random() * 100);
	        gaugeChart.setOption({
			    tooltip: {
			        formatter: "{a} <br/>{b} : {c}%"
			    },
			    series: [{
			        name: '1刻度',
			        type: 'gauge',
			        radius: '35%',
			        center: ['50%', '50%'],
			        startAngle: 220,
			        endAngle: -40,
			        axisLine: {
			            lineStyle: {
			                width:2,
			                color:[[1,'#8c929d']]
			            }
			        },
			        splitLine: {
			            length: 0,
			            lineStyle:{
			                color:'#8c929d',
			                width:2
			            }
			        },
			        axisLabel: {
			            show:false
			        },
			        axisTick:{
			            show:false
			        },
			        detail:{
			            show:false
			        },
			        pointer:{
			            show:false
			        }
			
			    },{
			        name: '2刻度',
			        type: 'gauge',
			        radius: '45%',
			        center: ['50%', '50%'],
			        startAngle: 212,
			        endAngle: -32,
			        axisLine: {
			            lineStyle: {
			                width:2,
			                color:[[1,'#8c929d']]
			            },
			        },
			        splitLine: {
			            length: 0,
			            lineStyle:{
			                color:'#8c929d',
			                width:2
			            }
			        },
			        axisLabel: {
			            show:false
			        },
			        axisTick:{
			            show:false
			        },
			        detail:{
			            show:false
			        },
			        pointer:{
			            show:false
			        }
			
			    },{
			        name: '3刻度',
			        type: 'gauge',//仪表盘
			        radius: '55%',//仪表盘半径
			        center: ['50%', '50%'],//仪表盘位置
			        startAngle:208,//起始角度
			        endAngle: -28,//结束角度
			        data: [{value: inputValue, name: ''}],
			        axisLine: {
			            lineStyle: {//仪表盘轴线相关配置。
			                width:2,
			                color:[[1,'#8c929d']]
			            }
			        },
			        splitLine: {//分隔线样式相关
			            length: 40,//分割线的长度
			            lineStyle: {
			                width:1,
			                color:'#b0b3b8'
			            }
			        },
			        axisLabel: {//大刻度标签。
			            distance: -70,//数字刻度距离
			            textStyle: {//数字刻度样式
		                    color: '#fff',
		                    fontSize:18,
		                },
			            data: [{value: inputValue, name: ''}],
			            formatter:function(param){
			                if ((param % 10)==0) {
			                    return param
			                }
			            }
			        },
			        axisTick:{//小刻度相关
			            show:false
			        },
			        detail: {//仪表盘详情数据相关
			            textStyle: {
		                    color: '#5bdbff',
		                    fontSize:46,
		                    offsetCenter: [0,'80%']
		               }
			        },
			        itemStyle:{//指针样式
			            normal:{
			                color:'#1ed133'
			            }
			        },
			        pointer:{//指针长度与宽度
			            width:8,
			            length:'85%'
			        },
			        data: [{
			            value:inputValue
			        }]
			    },{
			        name: '4线',
			        type: 'gauge',
			        radius: '100%',
			        center: ['50%', '50%'],
			        startAngle: 190,
			        endAngle: -10,
			        axisLine: {
			            lineStyle: {
			                width:2,
			                color:[[1,'#3d80f5']]
			            },
			        },
			        splitLine: {
			            length: -6,
			            lineStyle:{
			                opacity:0
			            }
			        },
			        axisLabel: {
			            show:false
			        },
			        axisTick:{
			            splitNumber:1,
			            lineStyle:{
			                opacity:0,
			            }
			        },
			        detail:{
			            show:false
			        },
			        pointer:{
			            show:false
			        }
			
			    }]
			})