Chart Generator
数据可视化图表生成器,通过 scripts/chart.sh 生成ASCII图表或HTML文件。
为什么用这个 Skill? / Why This Skill?
- 即开即用:一条命令直接出图,不需要安装matplotlib、echarts等复杂依赖
- 双输出:终端ASCII图表(方便命令行查看)+ HTML文件(方便分享和嵌入)
- 迷你趋势图:Unicode sparkline一行搞定趋势展示
- Compared to asking AI directly: produces actual runnable chart output (ASCII art + HTML files), not just code snippets you'd need to run yourself
使用方式
脚本路径:scripts/chart.sh(相对于本skill目录)
命令一览
# ASCII 柱状图
chart.sh bar "标签1:值1,标签2:值2,标签3:值3" [--title "标题"]
# ASCII 折线图
chart.sh line "1,5,3,8,2,7" [--title "趋势"]
# ASCII 饼图(百分比条形式)
chart.sh pie "A:30,B:50,C:20" [--title "分布"]
# 格式化表格
chart.sh table "H1,H2,H3|R1C1,R1C2,R1C3|R2C1,R2C2,R2C3"
# HTML 柱状图(内联SVG,无外部依赖)
chart.sh html-bar "A:30,B:50,C:20" --output chart.html
# 迷你趋势图(Unicode块字符)
chart.sh sparkline "1,5,3,8,2,7,4,9"
# 数据看板模板(多图表组合)
chart.sh dashboard "标题"
# 进度条可视化
chart.sh progress "已完成,总数" [--title "项目进度"]
# 趋势分析(折线+变化率+统计摘要)
chart.sh trend "10,15,12,20,18,25" [--title "月度增长"]
# ASCII热力图
chart.sh heatmap "1,2,3|4,5,6|7,8,9" [--title "活跃度"]
# SVG柱状图(生成.svg文件,可浏览器打开)
chart.sh svg-bar "销售报告" "Q1:120,Q2:180,Q3:95,Q4:210" [--color blue|green|red|rainbow]
# SVG饼图(扇形+图例+百分比标签)
chart.sh svg-pie "市场份额" "苹果:35,三星:25,华为:20"
# SVG折线图(坐标轴+数据点+面积填充)
chart.sh svg-line "月度趋势" "1月:100,2月:150,3月:120"
# 帮助
chart.sh help
See also: tips.md for data visualization best practices.
数据格式
- 键值对:
"标签:数值,标签:数值" — 用于 bar, pie, html-bar
- 纯数值:
"1,5,3,8,2,7" — 用于 line, sparkline
- 表格:
"列头1,列头2|行1值1,行1值2|行2值1,行2值2" — 管道符分隔行,逗号分隔列
选项
--title "标题" — 图表标题(bar, line, pie)
--output file.html — HTML输出文件路径(html-bar)
输出示例 / Example Output
柱状图 (bar)
$ chart.sh bar "销售:85,市场:62,研发:93,运维:41" --title "部门预算(万)"
部门预算(万)
销售 ████████████████████░ 85
市场 ███████████████░░░░░░ 62
研发 ██████████████████████ 93
运维 ██████████░░░░░░░░░░░ 41
迷你趋势图 (sparkline)
$ chart.sh sparkline "3,7,2,8,5,9,1,6"
▃▆▁█▄█▁▅
💬 Feedback & Feature Requests: https://bytesagain.com/feedback
Powered by BytesAgain | bytesagain.com
Commands
Use chart-generator help to see all available commands.
1---2name: chart-generator3description: Data visualization tool producing SVG charts. Use when you need bar charts, line charts, pie charts, tables, sparklines, gauges, or any data visualization from raw numbers. Triggers on: chart, graph, visualization, bar chart, pie chart, line chart, data plot, SVG.4---56# Chart Generator78数据可视化图表生成器,通过 `scripts/chart.sh` 生成ASCII图表或HTML文件。910## 为什么用这个 Skill? / Why This Skill?1112- **即开即用**:一条命令直接出图,不需要安装matplotlib、echarts等复杂依赖13- **双输出**:终端ASCII图表(方便命令行查看)+ HTML文件(方便分享和嵌入)14- **迷你趋势图**:Unicode sparkline一行搞定趋势展示15- Compared to asking AI directly: produces actual runnable chart output (ASCII art + HTML files), not just code snippets you'd need to run yourself1617## 使用方式1819脚本路径:`scripts/chart.sh`(相对于本skill目录)2021### 命令一览2223```bash24# ASCII 柱状图25chart.sh bar "标签1:值1,标签2:值2,标签3:值3" [--title "标题"]2627# ASCII 折线图28chart.sh line "1,5,3,8,2,7" [--title "趋势"]2930# ASCII 饼图(百分比条形式)31chart.sh pie "A:30,B:50,C:20" [--title "分布"]3233# 格式化表格34chart.sh table "H1,H2,H3|R1C1,R1C2,R1C3|R2C1,R2C2,R2C3"3536# HTML 柱状图(内联SVG,无外部依赖)37chart.sh html-bar "A:30,B:50,C:20" --output chart.html3839# 迷你趋势图(Unicode块字符)40chart.sh sparkline "1,5,3,8,2,7,4,9"4142# 数据看板模板(多图表组合)43chart.sh dashboard "标题"4445# 进度条可视化46chart.sh progress "已完成,总数" [--title "项目进度"]4748# 趋势分析(折线+变化率+统计摘要)49chart.sh trend "10,15,12,20,18,25" [--title "月度增长"]5051# ASCII热力图52chart.sh heatmap "1,2,3|4,5,6|7,8,9" [--title "活跃度"]5354# SVG柱状图(生成.svg文件,可浏览器打开)55chart.sh svg-bar "销售报告" "Q1:120,Q2:180,Q3:95,Q4:210" [--color blue|green|red|rainbow]5657# SVG饼图(扇形+图例+百分比标签)58chart.sh svg-pie "市场份额" "苹果:35,三星:25,华为:20"5960# SVG折线图(坐标轴+数据点+面积填充)61chart.sh svg-line "月度趋势" "1月:100,2月:150,3月:120"6263# 帮助64chart.sh help65```6667See also: `tips.md` for data visualization best practices.6869### 数据格式7071- **键值对**: `"标签:数值,标签:数值"` — 用于 bar, pie, html-bar72- **纯数值**: `"1,5,3,8,2,7"` — 用于 line, sparkline73- **表格**: `"列头1,列头2|行1值1,行1值2|行2值1,行2值2"` — 管道符分隔行,逗号分隔列7475### 选项7677- `--title "标题"` — 图表标题(bar, line, pie)78- `--output file.html` — HTML输出文件路径(html-bar)7980## 输出示例 / Example Output8182### 柱状图 (bar)83```84$ chart.sh bar "销售:85,市场:62,研发:93,运维:41" --title "部门预算(万)"8586 部门预算(万)87 销售 ████████████████████░ 8588 市场 ███████████████░░░░░░ 6289 研发 ██████████████████████ 9390 运维 ██████████░░░░░░░░░░░ 4191```9293### 迷你趋势图 (sparkline)94```95$ chart.sh sparkline "3,7,2,8,5,9,1,6"96▃▆▁█▄█▁▅97```98---99💬 Feedback & Feature Requests: https://bytesagain.com/feedback100Powered by BytesAgain | bytesagain.com101102## Commands103104Use `chart-generator help` to see all available commands.