什么是饼图?
饼图(Pie Chart)直观展示各部分在整体中所占的比例,适合展示预算分配、用户来源分布、时间占比等数据。Mermaid 的饼图是所有图表类型中语法最简单的。
为什么用饼图?
- 直观展示占比关系 — 一眼看出各部分在整体中的分量
- "部分与整体"一目了然 — 无需计算,直接感知比例大小
- 适合快速汇报 — 非技术人员也能轻松理解
数据适用性
- 最佳扇区数量:3-7 个 — 太少显得空洞,太多难以区分
- 超过 7 个建议合并为"其他" — 保持图表清晰可读
- 数据差异明显时效果最好 — 扇区大小对比鲜明,易于识别
最佳实践
- 从大到小排列 — 最大的扇区放在起始位置(通常是右上角)
- 最重要的放起始位置 — 读者视线首先落在此处
- 使用对比色区分扇区 — Mermaid 自动配色,相邻扇区颜色区分明显
什么时候不该用饼图?
- 超过 7 个类别时 — 考虑用柱状图或条形图
- 数据差异不明显 — 如 30% vs 35%,肉眼难以区分
- 需要精确比较时 — 柱状图更适合精确数值对比
- 有负数或零值时 — 饼图无法表示负值,零值扇区无意义
基本语法
pie title 标题
"类别A" : 数值
"类别B" : 数值
"类别C" : 数值
pie— 声明饼图title 标题— 可选,图表标题"名称" : 数值— 每个扇区的名称和数值- 数值无需加百分号,Mermaid 自动计算各类别占比
完整示例:开发时间分配
pie title 本月开发时间分配
"需求分析" : 15
"前端开发" : 35
"后端开发" : 25
"测试调试" : 15
"文档撰写" : 10
再来一个示例:网站流量来源
pie title 网站月度流量来源
"搜索引擎" : 42
"直接访问" : 28
"社交媒体" : 18
"外链引用" : 12
常用语法速查
| 语法 | 含义 |
|---|---|
pie |
声明饼图 |
pie title 标题 |
带标题的饼图 |
"名称" : 数值 |
一个扇区(数值为相对比例) |
下一步
你已经掌握了 Mermaid 最常用的五种图表!回到 教程首页 回顾所有内容,或直接打开 MermZen 编辑器 开始绘图。
如果您想在 MermZen 中尝试上述代码,可以点击 在线编辑器,然后将代码粘贴进去。