要想echart饼图显示百分比,只需要设置series中的label
标签相关属性即可,我们来一起看一下、
比如,我们想要在饼图label后面追加百分比的显示,可以使用如下配置:
series: [
{
// 其他配置省略,以下是百分比显示
label: {
show: true,
formatter: '{b} ({d}%)'
},
}
]
其中{b}
表示标签名,{d}%
是该项的百分比,实现的效果类似如下图:
如果你想要将百分比显示在饼图的扇形里面,可以是用label中的position属性,position:'inside'
即可,比如如下:
series: [
{
// 其他配置省略,以下是百分比显示
label: {
show: true,
position: 'inside',
formatter: '{d}%'
},
}
]
但这样外面的线就没了,不是特别好看,如果既要有外边的线还要将百分比显示在饼图内部,那就只能series中设置两个相同的饼图对象,只要label不一样,使其相互重叠,其他的也没什么更好的办法,如果你有更好的办法可以留言哦!
以上就是echarts饼图如何显示百分比的全部内容,希望对你有帮助哦。