home / skills / antvis / infographic / infographic-syntax-creator

infographic-syntax-creator skill

safe

This skill generates AntV Infographic syntax output from user content, selecting templates, organizing data, and applying themes for clear visuals.

npx playbooks add skill antvis/infographic --skill infographic-syntax-creator

Review the files below or copy the command above to add this skill to your agents.

Files (2)

SKILL.md

1.1 KB

---
name: infographic-syntax-creator
description: Generate AntV Infographic syntax outputs. Use when asked to turn user content into the Infographic DSL (template selection, data structuring, theme), or to output `infographic <template>` plain syntax.
---

# Infographic Syntax Creator

## Overview

Generate AntV Infographic syntax output from user content, following the rules in `references/prompt.md`.

## Workflow

1. Read `references/prompt.md` for syntax rules, templates, and output constraints.
2. Extract the user's key structure: title, desc, items, hierarchy, metrics; infer missing pieces if needed.
3. Select a template that matches the structure (sequence/list/compare/hierarchy/chart).
4. Compose the syntax using `references/prompt.md` as the formatting baseline.
5. Preserve hard constraints in every output:
   - Output is a single `plain` code block; no extra text.
   - First line is `infographic <template-name>`.
   - Use two-space indentation; key/value pairs are `key value`; arrays use `-`.
   - Compare templates (`compare-*`) must have exactly two root nodes with children.

Overview

This skill generates AntV Infographic DSL outputs from user content, producing ready-to-use infographic syntax. It selects an appropriate template, structures data and themes, and enforces strict formatting constraints for direct rendering.

How this skill works

The skill extracts key elements from the user's input—title, description, items, hierarchy, and metrics—and infers missing pieces when necessary. It picks a template that matches the structure (sequence, list, compare, hierarchy, chart), composes the DSL following the formatting rules, and ensures every output meets the hard constraints required for rendering.

When to use it

You want a plain AntV Infographic DSL block for immediate rendering or testing.
You need user content converted into a structured infographic template and data payload.
You want a template recommendation (sequence/list/compare/hierarchy/chart) based on content.
You require strict formatting and indentation for automated pipeline ingestion.
You need an output that preserves theme, layout choices, and comparison rules.

Best practices

Provide a clear title and brief description to guide template selection and layout.
List items with concise labels and numeric metrics when possible to enable charts.
Indicate hierarchy or relationships explicitly for tree or compare templates.
Specify preferred theme or color hints if presentation style matters.
Review the generated DSL block as a single plain code block before rendering.

Example use cases

Convert a product roadmap into a sequential infographic template with milestones and dates.
Turn a short report into a compare template showing two alternatives with pros and cons.
Create a hierarchy infographic representing organizational structure from an outline.
Generate a data-driven chart infographic from a small table of metrics.
Produce a list-style infographic for key takeaways of a meeting or article.

FAQ

What output format will I get?

A single plain code block that starts with 'infographic <template-name>' and follows two-space indentation and key value rules.

Can the skill infer missing data?

Yes. It will infer reasonable defaults for missing pieces like missing metrics or minor structural hints, but explicit data yields more accurate templates.