Infographic

AntV出品的声明式信息图可视化引擎,让数据叙事更简单。

安装使用

复制下面这段提示词发给你的 AI(Claude / Cursor / TRAE / Codex / WorkBuddy 等),它会自动帮你完成安装:

帮我安装这个 AI Skill:Infographic。
它的用途是:AntV出品的声明式信息图可视化引擎,让数据叙事更简单。
完整的 Skill 内容见:https://321skill.com/skills/infographic/raw/index.md
请读取该页面内容,如果是 SKILL.md 格式直接安装,如果是 README 提炼核心 prompt 后安装。

提示词包含完整的 Skill 内容链接,AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。

使用示例

“帮我将这份季度销售数据生成一个信息图,突出增长趋势和区域对比。”,AI可以调用Infographic,根据你的数据快速生成一段声明式代码,并渲染出包含柱状图、趋势线、地图和关键指标卡片的完整信息图。或者

对AI说:“设计一个展示产品开发流程的步骤图。”,AI能利用内置的流程模板,生成一个带有箭头、图标和说明文字的横向流程图。

介绍

AntV Infographic 是 AntV 推出的下一代声明式信息图可视化引擎。它旨在解决传统数据可视化工具在制作复杂、美观、叙事性强的信息图时,开发成本高、灵活性不足的问题。通过精心设计的信息图语法,开发者或AI可以快速、灵活地渲染高质量的信息图,将枯燥的数据转化为生动的视觉故事。

使用方式非常直观。你可以通过安装NPM包,在项目中引入并创建一个Infographic实例,然后向其传入一段简洁的声明式语法来描述信息图的结构、数据和样式。该引擎内置了丰富的模板和组件,支持从简单的列表到复杂的数据叙事图表等多种形态,并能输出高质量的SVG,方便进一步编辑和集成。

这个工具非常适合需要将数据以报告、演示文稿、营销材料或产品文档等形式进行可视化呈现的各类角色。无论是前端开发者、数据分析师、内容创作者还是产品经理,都能利用它高效地生成专业级的信息图。

建议初次使用时,先从官方文档的快速开始和示例库入手,熟悉其核心语法。由于其对AI生成友好,可以尝试结合AI Agent来辅助生成信息图描述代码,能极大提升创作效率。注意,它主要专注于静态或轻度交互的信息图生成,对于需要高度动态交互的复杂图表场景,可能需要结合其他可视化库。

核心特点

与通用图表库(如ECharts)相比,Infographic专注于“信息图”叙事场景,提供了更高层、更语义化的声明式语法,内置大量可直接使用的信息图模板和布局,开箱即用。其语法设计对AI高度友好,支持流式输出和渲染,是专为AI生成时代打造的可视化工具。

注意事项

不适合需要高度自定义交互逻辑或实时数据刷新的复杂动态图表场景。

常见问题

Infographic和G2、ECharts有什么区别?

G2/ECharts是通用的图表库,用于构建各种基础图表;Infographic是更高层的信息图引擎,基于声明式语法快速组合图表、文字、图标等元素,生成具有叙事性的完整信息图。

没有设计基础能做出好看的信息图吗?

可以。Infographic内置了多种精心设计的主题、模板和组件,即使没有设计背景,也能通过简单的配置生成专业、美观的信息图。

给 AI 助手的安装指引

如果你的 AI 编程助手(Claude Code、Cursor、TRAE 等)能看到这个页面,把下面这段发给它即可自动完成安装:

请访问 https://321skill.com/skills/infographic/raw/index.md 读取 Infographic 的原始 Skill 定义(Markdown 格式),按其中说明在我的环境里完成安装和配置。