AntV Infographic：让 AI 生成真正可编辑的信息图
痛点切入
AI 生成信息图最尴尬的地方，不是它不会画，而是它画完以后很难改。
让模型直接生成一张图片，第一眼可能还行。可一旦你想改文案、换颜色、删掉一个模块、把第二步挪到第三步，马上就进入“重新抽卡”模式。对真正要发文章、做 PPT、写报告的人来说，这不够。
AntV Infographic 解决的是另一个问题：不要让 AI 直接吐一张死图，而是让 AI 生成一种可解析、可渲染、可继续编辑的信息图语法。它把“生成图片”变成“生成结构”，这一步很关键。
如果你之前关注过 Pi 这种可扩展 agent harness，AntV Infographic 属于同一类思路：不是把 AI 当魔法按钮，而是给 AI 一个更稳定的中间层。
项目简介
AntV Infographic 是 AntV 开源的下一代声明式信息图可视化引擎，仓库为 antvis/Infographic，MIT 协议，主语言是 TypeScript。GitHub 当前是五千星量级项目，官网是 infographic.antv.vision。
它的 npm 包名是 @antv/infographic，抓到的 package 版本为 0.2.19。项目定位很清楚：用一套信息图 DSL 和渲染引擎，把文字描述、结构化数据和 AI 输出变成可编辑的 SVG 信息图。
README 里列出的核心能力包括：
- AI 友好的配置和语法，支持 AI 流式输出和渲染
- 约 200 个内置信息图模板、数据项组件和布局
- 主题系统，支持手绘、渐变、图案和自定义
- 内置编辑器，AI 生成后还能继续调整
- 默认 SVG 输出，保证清晰度和可编辑性
- skills 集成，支持 Claude Code 和 Codex 工作流
这不是一个通用图表库，也不是另一个 Mermaid。它更像“信息图的可执行排版语言”。
为什么是它
AntV Infographic 最大的差异是：它把 LLM 不擅长的像素级绘图，换成了 LLM 更擅长的结构化文本生成。
让模型生成 SVG 也能做到，但问题是 SVG 太底层。模型很容易写出坐标混乱、层级难改、布局不可复用的代码。AntV Infographic 选择在 SVG 上面再加一层更贴近信息图的语法：模板、数据、列表、布局、主题。
这让模型只需要描述“我要一个横向步骤列表，有三步，每步有标题和说明”，而不是直接计算每个矩形和文字的位置。
它比图片生成更适合生产流程
信息图不是海报图。它通常要反复改。
老板会改措辞，运营会改颜色，编辑会要求适配微信宽度，PPT 里还要调整比例。纯图片生成在这里很脆：改一点就要重来，且无法保证新版本保持同一布局。
AntV Infographic 输出的是 SVG，并且带编辑器。它更像设计稿和代码之间的中间产物。AI 负责生成初稿，人负责校对和微调，这比“生成一张漂亮但不可控的图”更接近真实工作流。
它比通用图表库更懂信息图
AntV 自家已经有 G2、G6、L7 这类成熟可视化项目。Infographic 没必要再做一个通用图表库。
它的方向更窄：列表、步骤、对比、流程、数据项、卡片、叙事型信息结构。也就是说，它服务的是“把信息讲清楚”，不是“探索复杂数据”。
这个定位反而让它好用。你不会为了做一个四步流程图去配置完整坐标系，也不会为了做一个指标卡片去拼一堆低层组件。
快速上手
安装很简单：
npm install @antv/infographic最小用法如下：
import { Infographic } from "@antv/infographic";
const infographic = new Infographic({
container: "#container",
width: "100%",
height: "100%",
editable: true,
});
infographic.render(`
infographic list-row-simple-horizontal-arrow
data
lists
- label Step 1
desc Start
- label Step 2
desc In Progress
- label Step 3
desc Complete
`);真正值得注意的是 render 接收的是一段 DSL，而不是一坨图形配置对象。这个形式对 AI 很友好：模型可以逐 token 输出，前端可以一边接收一边渲染。
流式渲染也很直接：
let buffer = "";
for (const chunk of chunks) {
buffer += chunk;
infographic.render(buffer);
}这意味着你可以做一种很自然的体验：AI 还没说完，信息图已经开始长出来。
亮点代码
AntV Infographic 的亮点不是某个 API 多复杂，而是它把信息图语法设计成了可容错、可渐进渲染的文本协议。
这对 agent 很重要。LLM 输出不是一次性稳定 JSON，经常会流式、半截、回补、局部修正。一个面向 AI 的渲染引擎，必须能接受“不完整输入”，并尽可能给出可视反馈。
README 给出的流式写法非常短：
let buffer = "";
for (const chunk of chunks) {
buffer += chunk;
infographic.render(buffer);
}这段代码背后的含义是：AntV Infographic 不要求 AI 一次生成完美配置。它允许前端把 partial output 直接喂进去，逐步渲染。对 AI 生成类产品，这是比“生成完成后再预览”更好的交互模型。
另一个亮点是 skills 集成。仓库里提供了 infographic-creator、infographic-syntax-creator、infographic-structure-creator、infographic-item-creator、infographic-template-updater。也就是说，它不只是一个 JS 包，还把“怎么让 agent 使用它”打包成了技能。
这点很聪明。很多开源库停在 API 文档，AntV Infographic 直接把 AI 使用路径也放进仓库。
社区与生态
AntV 本身是成熟的数据可视化品牌，这给 Infographic 提供了天然背书。仓库当前五千星量级、数百 fork，Issues 开启，最近一次 push 是 2026 年 5 月 6 日。
README 里列出了一批生态项目，包括 Markdown Viewer、InfographicAI、LangChat Slides、WeChat Markdown Editor、Zojo、docsify-infographic、markdown-it-infographic、obsidian-infographic、slidev-addon-infographic、VSCode Extension 等。
这个生态方向很说明问题：AntV Infographic 最容易落地的地方，不是 BI 大屏，而是文档、Markdown、PPT、知识库、公众号编辑器、AI slide 生成器。
换句话说，它更靠近“内容生产基础设施”，而不是传统数据分析工具。
适用场景与局限
AntV Infographic 适合这些场景：
- AI 写作工具里自动生成解释型信息图
- Markdown / 文档系统里嵌入可编辑视觉块
- PPT 和 slide 生成器里生成流程、步骤、对比和摘要页
- 公众号、报告、知识库里把长段文字转成结构化视觉
- Agent 工作流中用 skills 生成可落地的 HTML / SVG 资产
但它不适合所有可视化需求。
如果你要做复杂交互式分析、百万级数据渲染、地图可视化、动态图网络，那应该看 AntV 的 G2、G6、L7，而不是 Infographic。Infographic 的优势是表达型、模板型、叙事型信息图。
另一个限制是语法学习成本。它比直接写 SVG 简单，但不是完全零成本。想让团队稳定使用，你需要沉淀模板、prompt 和示例。否则模型会生成看似合理但不符合你品牌规范的图。
最后，它还比较年轻。仓库创建于 2025 年 9 月，版本仍在 0.x。适合积极试用和产品集成验证，但如果要放进高稳定性生产链路，最好锁版本并保留降级方案。
结论
AntV Infographic 最值得关注的地方，是它把“AI 生成信息图”从图片生成拉回到了工程可控的轨道：文本语法、模板、SVG、编辑器、skills。
如果你正在做 AI 文档、AI PPT、知识库、Markdown 编辑器或内容生成工具，它值得认真试。别把它当图表库看，把它当“让 AI 输出可编辑信息图的渲染层”看，会更准确。
