饼图生成器
输入两列 CSV,生成饼图。自动为各扇区配色,支持导出 PNG,全部在浏览器本地处理。
使用方法
- 1 粘贴两列数据——标签和数值。每一行都会变成图表中的一个扇区。
- 2 如果标签过长,可以开启或关闭图例显示。
- 3 将图表下载为 PNG 图片。
为什么使用此工具
- 两列 CSV——数据结构简单,便于输入。
- 使用精心挑选的 10 色调色板自动为各扇区上色。
- Chart.js 采用懒加载——初始加载体积小巧。
- 完全在客户端渲染——你的数据不会被上传。
常见问题
各项百分比必须加起来等于 100 吗?
不一定——Chart.js 会按各数值占总和的比例来显示。
想要中间镂空的图表?
可以试试 <a class="underline" href="/doughnut-chart-maker">环形图生成器(Doughnut Chart Maker)</a>——输入数据格式相同,只是布局呈环形。
需要绘制趋势线(trend line)?
可以试试 <a class="underline" href="/line-chart-maker">折线图生成器(Line Chart Maker)</a>。
什么是 饼图生成器?
饼图生成器(Pie Chart Maker)是一款可将两列 CSV 数据在浏览器中直接转换为饼图的工具。它会把一个圆按比例切分成若干扇区,每一行数据对应一个扇区,并自动为每个扇区分配颜色。生成的图表可导出为 PNG 图片,整个渲染过程都在客户端完成,不会有任何数据上传到服务器。
功能特性
CSV 到切片的映射
每一行数据都会变成饼图中的一个切片:第一列为标签,第二列为数值。Chart.js 会自动将数值归一化为占总数的比例,因此你的数字不必刚好加总为 100。
自动配色切片
切片按顺序从固定的 10 色调色板中取色;如果 CSV 超过 10 行,颜色会从调色板起始处循环重复。
符合 RFC 4180 的 CSV 解析
内置解析器按照 RFC 4180 处理带引号的字段、字段内嵌的逗号以及 CRLF/LF 换行符,并能自动检测分隔符(逗号、分号或制表符)。
纯客户端处理,支持 PNG 导出
Chart.js 采用延迟加载(lazy-load),渲染完全在浏览器标签页内完成,不会向服务器发送任何数据。使用 Download PNG 即可将当前画布导出为无损的 PNG 图像。
示例
Input
Browser,Share
Chrome,63
Safari,19
Edge,5
Firefox,3
Other,10
Output
pie-chart-maker.png — 5 slices sized by value (63/19/5/3/10, not required to sum to 100), colored from the 10-color palette in row order, exported at the canvas's current rendered pixel size via toDataURL('image/png')
常见使用场景
-
1
市场份额拆解
粘贴浏览器或平台份额数据(例如 Chrome、Safari、Edge),即可为报告或幻灯片即时呈现各部分的相对占比。
-
2
预算与成本分配
将电子表格导出的费用类别与金额数据转换为饼图,用于预算审查或向相关方汇报更新。
-
3
调查及流量来源构成
无需打开电子表格应用,即可直观展示受访者或访客在各类别(Organic、Direct、Referral、Social)中的分布情况。
Pie Chart Maker 使用 Chart.js 4 将两列的 CSV 数据(标签、数值)转换为饼图,每一行 CSV 数据都会变成一个扇形切片,颜色取自固定的 10 色调色板。在你输入数据的同时,图表会在浏览器中实时渲染,并可通过 canvas 的 toDataURL API 导出为 PNG 图片。CSV 解析与渲染均完全在浏览器端完成——不会有任何数据上传到服务器。
- 分类
- 创作者
- 价格
- 免费
- 隐私
- 基于浏览器
- 注册
- 无需
参考资料
- Chart.js — 环形图与饼图 — Chart.js
- Chart.js — 颜色 — Chart.js
- HTMLCanvasElement: toDataURL() 方法 — MDN Web Docs
- RFC 4180 — 逗号分隔值(CSV)文件的通用格式与 MIME 类型 — IETF
隐私
除非另有说明,否则你的数据永远不会离开浏览器。饼图生成器 完全在客户端运行 — 无需上传服务器,不记录日志,不追踪你输入的内容。
相关工具
在 Zerethon Social 上创作、分享与成长
免费注册。赚取积分,收集成就,与全球创作者建立联系。