今天在开发当中遇到一个需求问题,我们使用ECharts的时候,展示饼状图默认2位小数,需要展示4位小数,在网上也没有找到比较好的案例,后来去了ECharts官网读取里面的api文档,现在把自己的代码展示出来,供大家参考,希望能帮到大家:
页面展示效果已经达到了,代码参照如下:
var theSer = { type: 'liquidFill', // 水波图 data: [ //可以有多个水波 { value: proportionList[i].bval, //所占比例 0-1 } ], amplitude: 5, //波的振幅 waveLength: 150, //波长 waveAnimation: true, animationEasing: 0, animationEasingUpdate: 0, animationDuration: 0, animationDurationUpdate: 0, radius: 164, //水波图的半径 center: [(i+1)*widthGap+(164/2)+i*164, '50%'], //圆心位置 itemStyle: { normal: { color: waterColor //水波的颜色 } }, //波线的阴影 backgroundStyle: { color: '#fff', //背景色 borderColor: '#fff', borderWidth: 1, shadowColor: '#ffffff', shadowBlur: 20 }, //球状的背景颜色 outline: { show: true, //true显示水波图上的文字 borderDistance: 6, itemStyle: { color: '#ffffff', borderColor: waterColor, borderWidth: 2, shadowBlur: 30, shadowColor: '#ffffff' } }, label: { show: true, color: '#294D99', insideColor: '#fff', fontSize: 50, fontWeight: 'bold', align: 'center', baseline: 'middle', position: 'inside', normal: { textStyle: { color: waterColor, //本来的颜色 insideColor: 'white', //被淹没的颜色 fontSize: 30 }, show: true, // formatter: '{c} ({d}%)', //自定义显示格式(b:name, c:value, d:百分比) // formatter: '{c}%' //自定义显示格式(b:name, c:value, d:百分比) formatter: function (a, b, c) { console.log(a) // console.log(b) // console.log(c) if(a.data.value == 1){ return 100+"%"; }else{ return parseFloat(a.data.value).toFixed(4)+"%"; } }, }, }, };