Skip to content

Commit f9dde15

Browse files
lyw405lyw405
committed
Initial commit: Publish infographic-cli project
0 parents  commit f9dde15

30 files changed

Lines changed: 7869 additions & 0 deletions

‎.gitignore‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
node_modules/
2+
dist/
3+
dist-types/
4+
*.log
5+
.DS_Store
6+
*.ifgc
7+
*.svg
8+
test-ssr.js
9+
tsconfig.tsbuildinfo

‎CHANGELOG.md‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
# Changelog
2+
3+
All notable changes to this project will be documented in this file.
4+
5+
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
6+
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
7+
8+
## [0.1.0] - 2025-01-20
9+
10+
### Added
11+
- Initial release of `infographic-cli`
12+
- Simple command `ifgc` to render infographics from .ifgc files to SVG
13+
- Support for 236+ built-in infographic templates
14+
- `template` command to list all available templates
15+
- Theme support (`--theme` option)
16+
- Background color customization (`--background` option)
17+
- Config file support (`--config` option)
18+
- Stdin input support for AI integration
19+
- Comprehensive test suite (26 tests)
20+
21+
### Features
22+
- Render from file: `ifgc -i input.ifgc -o output.svg`
23+
- Render from stdin: `echo "..." | ifgc -o output.svg`
24+
- List templates: `ifgc template`
25+
- Automatic output file naming (defaults to input.svg)
26+
- Quiet mode for script usage (`--quiet`)
27+
28+
### Dependencies
29+
- `@antv/infographic` ^0.2.11
30+
- `chalk` ^5.4.1
31+
- `commander` ^12.1.0
32+
33+
[0.1.0]: https://github.com/lyw405/infographic-cli/releases/tag/v0.1.0

‎LICENSE‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2026 lyw405
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎README.md‎

Lines changed: 198 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,198 @@
1+
# infographic-cli
2+
3+
[![npm version](https://badge.fury.io/js/infographic-cli.svg)](https://www.npmjs.com/package/infographic-cli)
4+
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
5+
[![Node.js Version](https://img.shields.io/node/v/infographic-cli.svg)](https://www.npmjs.com/package/infographic-cli)
6+
7+
Command-line interface for [AntV Infographic](https://github.com/antvis/Infographic) - instantly create stunning SVG infographics from simple declarative syntax. Render from strings, files, or stdin.
8+
9+
## Quick Start
10+
11+
```bash
12+
# Install
13+
npm install -g infographic-cli
14+
15+
# Render from string (quickest for testing)
16+
ifgc -s "infographic list-row-simple-horizontal-arrow
17+
data
18+
title My First Infographic
19+
items
20+
- label Step 1
21+
- label Step 2" -o output.svg
22+
23+
# Render from file
24+
ifgc -i input.ifgc -o output.svg
25+
26+
# List available templates
27+
ifgc template
28+
```
29+
30+
## Installation
31+
32+
```bash
33+
npm install -g infographic-cli
34+
```
35+
36+
This installs two commands: `ifgc` (short) and `infographic` (long).
37+
38+
## Usage
39+
40+
### Basic Rendering
41+
42+
```bash
43+
# From string (quickest for testing)
44+
ifgc -s "infographic list-row-simple-horizontal-arrow
45+
data
46+
title My Chart
47+
items
48+
- label Item 1" -o output.svg
49+
50+
# From file (output defaults to input.svg)
51+
ifgc -i input.ifgc
52+
53+
# Specify output file
54+
ifgc -i input.ifgc -o output.svg
55+
56+
# From stdin
57+
echo '...' | ifgc -o output.svg
58+
59+
# From stdin with file input
60+
cat input.ifgc | ifgc -o output.svg
61+
```
62+
63+
### Options
64+
65+
| Option | Description |
66+
|--------|-------------|
67+
| `-s, --string <content>` | Input .ifgc content as a string |
68+
| `-i, --input <file>` | Input .ifgc file |
69+
| `-o, --output <file>` | Output file (default: input.svg) |
70+
| `--background <color>` | Background color (default: transparent) |
71+
| `-c, --config <file>` | JSON configuration file |
72+
| `-t, --theme <name>` | Theme name |
73+
| `-q, --quiet` | Suppress log output |
74+
75+
### List Templates
76+
77+
```bash
78+
ifgc template
79+
```
80+
81+
Visit [AntV Infographic](https://github.com/antvis/Infographic) to see template previews.
82+
83+
## Examples
84+
85+
### Example 1: Simple Step List
86+
87+
```bash
88+
cat > steps.ifgc << EOF
89+
infographic list-row-simple-horizontal-arrow
90+
data
91+
title Getting Started
92+
desc Three simple steps to begin
93+
items
94+
- label Step 1
95+
desc Install the package
96+
- label Step 2
97+
desc Create your first infographic
98+
- label Step 3
99+
desc Export and share
100+
EOF
101+
102+
ifgc -i steps.ifgc -o steps.svg
103+
```
104+
105+
### Example 2: Timeline
106+
107+
```bash
108+
cat > timeline.ifgc << EOF
109+
infographic timeline-horizontal-basic-date
110+
data
111+
title Project Roadmap
112+
items
113+
- label Q1
114+
desc Planning
115+
- label Q2
116+
desc Development
117+
- label Q3
118+
desc Testing
119+
- label Q4
120+
desc Launch
121+
EOF
122+
123+
ifgc -i timeline.ifgc -o timeline.svg
124+
```
125+
126+
### Example 3: Using Theme
127+
128+
```bash
129+
cat > swot.ifgc << EOF
130+
infographic compare-quadrant-four-areas-card
131+
data
132+
title SWOT Analysis
133+
items
134+
- label Strengths
135+
desc Internal advantages
136+
- label Weaknesses
137+
desc Internal limitations
138+
- label Opportunities
139+
desc External possibilities
140+
- label Threats
141+
desc External risks
142+
EOF
143+
144+
ifgc -i swot.ifgc -o swot.svg -t dark
145+
```
146+
147+
### Example 4: From stdin
148+
149+
```bash
150+
echo 'infographic list-row-simple-horizontal-arrow
151+
data
152+
title Quick Tasks
153+
items
154+
- label Task A
155+
- label Task B
156+
- label Task C' | ifgc -o tasks.svg
157+
```
158+
159+
## Output Format
160+
161+
### SVG (Default)
162+
163+
Infographic is a vector graphics format, perfect for:
164+
165+
- **Web use** - Scalable, interactive, small file size
166+
- **Documentation** - GitHub, GitLab, Notion, etc.
167+
- **Design tools** - Figma, Sketch, Illustrator
168+
- **Code documentation** - Docusaurus, VitePress, etc.
169+
170+
### Converting to PNG
171+
172+
If you need PNG for specific use cases, you can convert the SVG:
173+
174+
**Online tools**:
175+
- [SVG to PNG](https://svgtopng.com/)
176+
- [CloudConvert](https://cloudconvert.com/svg-to-png)
177+
178+
**Command line** (requires additional tools):
179+
- ImageMagick: `convert output.svg output.png`
180+
- Node.js with sharp: `sharp('output.svg').png().toFile('output.png')`
181+
182+
## Infographic Syntax
183+
184+
Learn more about the declarative infographic syntax at [antvis/Infographic](https://github.com/antvis/Infographic).
185+
186+
## See Also
187+
188+
- [AntV Infographic](https://github.com/antvis/Infographic) - The core library
189+
- [Infographic Documentation](https://infographic.antv.vision/) - Official documentation
190+
- [Infographic Editor](https://infographic.antv.vision/examples) - Online examples
191+
192+
## License
193+
194+
MIT &copy; 2026 [lyw405](https://github.com/lyw405)
195+
196+
## Changelog
197+
198+
See [CHANGELOG.md](CHANGELOG.md) for a list of changes in each version.

‎__tests__/fixtures/examples/01-basic-list.txt‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
infographic list-row-simple-horizontal-arrow
2+
data
3+
title Getting Started Example
4+
desc A simple list-based infographic
5+
items
6+
- label Step 1
7+
desc Initial setup and configuration
8+
- label Step 2
9+
desc Development and testing
10+
- label Step 3
11+
desc Deployment and monitoring

‎__tests__/fixtures/examples/02-list-with-icons.txt‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
infographic list-row-horizontal-icon-arrow
2+
data
3+
title Customer Growth Engine
4+
desc Multi-channel reach and repeat purchases
5+
items
6+
- label Lead Acquisition
7+
value 18.6
8+
desc Channel investment and content marketing
9+
icon plane
10+
- label Conversion Optimization
11+
value 12.4
12+
desc Lead scoring and automated follow-ups
13+
icon earth
14+
- label Loyalty Boost
15+
value 9.8
16+
desc Membership programs and benefits
17+
icon plane
18+
- label Brand Advocacy
19+
value 6.2
20+
desc Community rewards and referral loops
21+
icon earth
22+
- label Customer Success
23+
value 7.1
24+
desc Training support and activation
25+
icon plane
26+
- label Product Growth
27+
value 10.2
28+
desc Trial conversion and feature nudges
29+
icon earth
30+
- label Data Insights
31+
value 8.5
32+
desc Key metrics and attribution analysis
33+
icon plane
34+
- label Ecosystem Partnership
35+
value 5.4
36+
desc Co-marketing and resource exchange
37+
icon earth

‎__tests__/fixtures/examples/03-timeline.txt‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
infographic sequence-timeline-rounded-rect-node
2+
data
3+
title Internet Technology Evolution
4+
desc Key milestones from Web 1.0 to AI era
5+
items
6+
- time 1991
7+
label World Wide Web
8+
desc Tim Berners-Lee launched the first website
9+
- time 2004
10+
label Web 2.0 Rise
11+
desc Social media and user-generated content
12+
- time 2007
13+
label Mobile Internet
14+
desc iPhone release changed the world
15+
- time 2015
16+
label Cloud Native
17+
desc Containers and microservices adoption
18+
- time 2020
19+
label Low-Code Platforms
20+
desc Visual development lowering barriers
21+
- time 2023
22+
label AI Large Models
23+
desc ChatGPT sparked generative AI revolution
24+
theme antv

‎__tests__/fixtures/examples/04-themed-dark.txt‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
infographic list-row-simple-horizontal-arrow
2+
theme dark
3+
colorPrimary #61DDAA
4+
colorBg #1F1F1F
5+
data
6+
title Development Process
7+
desc Software development lifecycle stages
8+
items
9+
- label Planning
10+
desc Requirements gathering and analysis
11+
- label Design
12+
desc Architecture and system design
13+
- label Implementation
14+
desc Coding and development
15+
- label Testing
16+
desc Quality assurance and bug fixing
17+
- label Deployment
18+
desc Production release
19+
- label Maintenance
20+
desc Ongoing support and updates

‎__tests__/fixtures/examples/05-quarterly-revenue.txt‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
infographic quadrant-quarter-simple-card
2+
data
3+
title Quarterly Revenue Overview
4+
desc Business revenue data by quarter
5+
items
6+
- label Q1
7+
value 68
8+
desc First quarter performance
9+
icon earth
10+
- label Q2
11+
value 82
12+
desc Second quarter growth
13+
icon plane
14+
- label Q3
15+
value 91
16+
desc Third quarter acceleration
17+
icon earth
18+
- label Q4
19+
value 105
20+
desc Fourth quarter achievement
21+
icon plane
22+
theme antv

0 commit comments

Comments
 (0)