piapia123
zh

在线图表生成

生成器

所有处理都在浏览器本地完成,数据不上传服务器

预览改上面的参数,这里立刻重画
SVG 源码

把数据粘进左框,右边立刻画出图表,可以复制 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,能直接当图片文件用

使用方法

  1. 在左边粘贴数据,每行一个「标签,数值」
  2. 选图表类型,按需要填标题、改颜色与尺寸
  3. 右边实时预览;满意后复制 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 是因为矢量图在需要改尺寸时没有替代品。

相关工具