echarts中使用饼状图显示百分比

最新推荐文章于 2025-05-24 00:03:15 发布

FrontJS

最新推荐文章于 2025-05-24 00:03:15 发布

阅读量2.1w

点赞数 1

分类专栏：前端 echarts 文章标签：饼状图

前端同时被 2 个专栏收录

40 篇文章

订阅专栏

echarts

3 篇文章

订阅专栏

本文介绍如何在ECharts的饼图中显示数据的百分比，通过设置series中的label参数，实现每个扇区上显示类别名称、数值及所占比例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

echarts-在现实标题中显示百分比

如图：需要在标题显示所占百分比

使用方式：图中标记部分

复制代码

    series : [{
                name: '类型',
                type: 'pie',
                radius : '55%',
                center: ['50%', '60%'],
                data:valuearray,
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    },
                    normal:{ 
                        label:{ 
                            show: true, 
                            formatter: '{b} : {c} ({d}%)' 
                        }, 
                        labelLine :{show:true} 
                    } 
                }
            }
        ]

复制代码

原文链接：https://www.cnblogs.com/hwagglee/p/5903383.html