在线图表生成
生成器所有处理都在浏览器本地完成,数据不上传服务器
把数据粘进左框,右边立刻画出图表,可以复制 SVG 源码或下载 `.svg`。 产物是 SVG 源码,不是位图。 这一点决定了它比截图式的图表工具好在哪:SVG 是矢量的,放大不糊,能直接贴进网页、Word、Illustrator;一份图表的文件通常只有几 KB。代价是坐标要自己算 —— 但也没法在这个页面上引图表库(那会让每个访客多下载几百 KB)。 数据格式是「标签,数值」,一行一个。 分隔符逗号、制表符、分号、空格都认,从表格里复制一列通常就是这个形状;Excel 导出的 `"1,200"` 这种带引号的千分位也读得对。标签可以省略,那就按序号编。散点图例外:它要两个数(x 与 y)。 坐标轴的刻度会取整到「好看」的数字。 最大值 97 时,直接把轴画到 97 会让刻度变成 0 / 24.25 / 48.5 这种没法读的数;所以轴的上下界会向上取整到 1、2、5 的整数倍 —— 97 变成 100,刻度就是 0 / 25 / 50 / 75 / 100。这也是所有正经图表库的做法。 ⚠️ 没有解析成数值的行会被跳过,并在图上说明跳过了几行 —— 悄悄少一根柱子,而你以为数据全进去了。
功能
- 五种图表:饼图、柱状图、折线图、散点图、雷达图
- 数据每行一个「标签,数值」,逗号 / 制表符 / 分号 / 空格都认
- Excel 导出的带引号千分位("1,200")也能正确读成 1200
- 坐标轴按「好看的数字」取整(97 → 100,刻度 25 一档)
- 散点图与雷达图的数值轴各自独立计算
- 标题、主色、尺寸、网格线、数值标注都可以调
- 饼图只有一个数据点时画成整圆(用弧线的话起点终点重合,浏览器不画)
- 标签与标题会做 XML 转义,含 `<` 或 `&` 的文字不会破坏这份 SVG
- 导出的 SVG 带 xmlns,能直接当图片文件用
使用方法
- 在左边粘贴数据,每行一个「标签,数值」
- 选图表类型,按需要填标题、改颜色与尺寸
- 右边实时预览;满意后复制 SVG 源码或点「下载 .svg」
常见问题
- 支持 Excel 里直接复制过来的数据吗?
- 支持,而且这是最常见的用法。从表格里选中两列复制,粘进来就是「标签<Tab>数值」或「标签,数值」的形状,两种都认。带引号的千分位也读得对:Excel 导出 CSV 时会把 `1,200` 写成 `"1,200"`,如果按逗号硬切就会切成 `"1` 与 `200"` 两个都读不出来的片段 —— 所以这里的切分是认引号的。
- 为什么柱状图的纵轴最大值是 100 而我最大只有 97?
- 因为刻度取的是「好看的数字」。把轴正好画到 97 的话,五等分的刻度就是 0 / 24.25 / 48.5 / 72.75 / 97 —— 这种刻度读起来毫无意义。所以上下界会向上取整到 1、2、5 的整数倍(这叫 nice number 取整,所有正经图表库都这么做),97 于是落在 100 上,刻度变成 0 / 20 / 40 / 60 / 80 / 100。多出来的那一点是刻度的余量,不是数据错了。
- 出来的图能直接用在 PPT 或文档里吗?
- 能。点「下载 .svg」拿到的是一份完整的矢量文件,Word、PowerPoint、Illustrator、Figma 都能直接插入,而且放大不会模糊。如果目标工具不吃 SVG(某些老版本的 Office 或微信),用截图或先在浏览器里打开再导出 PNG 即可 —— 导出 SVG 而不是 PNG 是因为矢量图在需要改尺寸时没有替代品。
相关工具
渐变配色
查询180 段常用渐变配色,带实时预览与可直接复制的 CSS。按名称、色值或色相分组查找,也能从一段渐变里单独取走某一端的颜色。
配色方案
查询输入一个主色算出七套经典搭配,或随机生成一组带主题的配色(柔和 / 鲜艳 / 暗 / 亮 / 暖 / 冷 / 霓虹 / 大地色 / 单色),每套都附「什么时候用它」。
SVG 编辑预览
图像左边写 SVG 代码、右边实时预览,可切换棋盘格/深浅背景看透明度,并自动检查 xmlns、viewBox、外部资源等常见问题。代码不会进页面。
UUID 生成
生成器一次生成一整列 UUID v4、v7、ULID、NanoID 或 MongoDB ObjectId,每行一条,可直接粘进表格或脚本。随机数取自浏览器加密接口,不联网、不记录。
占位文本
生成器生成占位文本,可选拉丁文 Lorem ipsum、英文句子、中文或日文填充句,按段落、句子或单词输出。全部在浏览器本地生成,不联网。
模拟数据
生成器按「字段名:类型」写几行字段,就能得到一整批格式逼真的模拟数据,可导出 JSON、CSV、TSV、SQL、XML、YAML 或 TOML。