使用echarts-liquidfill.js的水球,水球上顯示的文字可以使用chartOption.series[0].label.normal.formatter設置,想顯示什么顯示什么。
水球插件下載地址
https://files.cnblogs.com/files/tong2018/echarts-liquidfill-master.zip
var chartOption = { title: { subtext: '', subtextStyle: { fontSize : 14, fontFamily:'serif', color: '#ffffff' }, top: '80%', textAlign: 'center', left: '50%' }, series: [{ color: ['#86FDFD'],//水波顏色 type: 'liquidFill', waveAnimation: false,//是否流動水球 animation: false, radius: '55%', waveLength: '80%',//波長 waveHeight: '60',//波長 amplitude: '8%',//振幅 outline: { show: true, borderDistance: 4,//內環寬 itemStyle: { color: '#14297b',//內環色 borderColor: '#86FDFD',//外環色 borderWidth: 7//外環寬 } }, backgroundStyle: { color: '#14297b'//水球背景色 }, label: { normal: { formatter:"34.34%",//水球上顯示文字,可以設置任意文字 show: true, textStyle: { color:'#ffffff',//水球顯示文字顏色 fontSize: '22', fontFamily:'serif', fontWeight: '100' } } }, data: [0.34] }] };