话不多说直接上图 应用的是echart中的仪表盘
``javascriptvar chartDom = document.getElementById('main')var myChart = echarts2.init(chartDom)var optionoption = {series: [{center: ['50%', '46%'],radius: '90%',type: 'gauge',startAngle: 220,endAngle: -40,min: 0,max: 2.6,roundCap: true,itemStyle: {color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0, color: '#297FFE' }, //柱图渐变色{offset: 1, color: '#08E5FF' } //柱图渐变色]),shadowColor: '#297FFE',shadowBlur: 10,shadowOffsetX: 2,shadowOffsetY: 2},progress: {// show:false,roundCap: true,show: true,width: 12},axisLine: {roundCap: true,lineStyle: {width: 12}},axisTick: {show: false},splitLine: {show: false},axisLabel: {show: false},pointer: {show: false},title: {show: false},detail: {valueAnimation: true,fontSize: 80,offsetCenter: [0, '0%'],formatter: function(value) {return '{value|' + value + '}{unit|%}'},rich: {value: {fontSize: 28,fontWeight: 'bolder',color: '#15A9F1'},unit: {fontSize: 12,color: '#15A9F1',padding: [0, 0, -10, 10]}}},data: [{value: 2.33,name: '月收益'}],title: {color: '#00EBEE',fontSize: 14,offsetCenter: [0, '80%']}}]}option && myChart.setOption(option)
有问题欢迎讨论