以 skill 自身的术语
一个 AntV skill,将文字描述转化为渲染出的信息图。Agent 编写 AntV Infographic 语法——一种基于缩进的 DSL,首行指定模板,数据块携带 title、desc 以及该模板自身的主字段:列表、序列、对比、数值、节点与关系,或 root。
theme 块用于设置配色、字体和风格化效果。内置模板列表涵盖列表、序列、对比、层级、关系和图表族,覆盖时间线、SWOT、思维导图、路线图、四象限分析和词云。随后 Agent 编写一个名为 <title>-infographic.html 的可直接在浏览器打开的 HTML 文件,用于渲染该图形并导出为 SVG。
它产出什么
- AntV Infographic 语法本身,用户可以阅读、保留或复用。
- 一个用 Write 工具编写的完整 HTML 文件,命名为
<title>-infographic.html。 - 从渲染完成的页面生成的 SVG 导出文件。
工作方式
- 01弄清用户到底想呈现什么
在其他一切之前,该 skill 先读取用户的需求以及他们想表达的信息,因为这决定了模板和数据结构。
- 02当 brief 信息不足时主动追问
如果内容描述不够清晰简洁,该 skill 会要求补充说明,而不是自行编造内容,也可能询问用户想用哪个模板。
- 03将内容形态匹配到对应的模板族
严格的顺序流程对应
sequence-,观点列举对应list-row-或list-column-,二元对比对应compare-binary-,树状结构对应hierarchy-tree-,四象限对应compare-quadrant-。 - 04用 DSL 表达结构
结构被转化为 AntV Infographic 语法:一行模板声明,一个包含 title/desc 及该模板主字段的
data块,外加一个可选的theme块。 - 05生成 HTML 文件
该语法被嵌入一个完整的 HTML 文档中,包含 AntV Infographic 的 script 标签、一个容器和一次渲染调用。
- 06交回文件和语法,并提供调整建议
回复中会附带生成的文件路径和语法,随后邀请用户调整模板、颜色或内容。