chart-generator

Solid

Generate markdown tables OR XSS-safe SVG charts for sections with needs_table=true. Ensures ≥2 tables per article with ≥1 in front 50%. Uses scripts/build/chart_svg_builder.py.

AI & Automation 49 stars 13 forks Updated 3 weeks ago Apache-2.0

Install

View on GitHub

Quality Score: 82/100

Stars 20%
57
Recency 20%
90
Frontmatter 20%
70
Documentation 15%
36
Issue Health 10%
80
License 10%
100
Description 5%
100

Skill Content

# Chart Generator Fills in tables/charts where outline-architect marked needs_table=true. ## Workflow ``` 1. For each section with needs_table=true: - LLM designs table structure (columns + 4-10 rows) - python -m scripts.build.chart_svg_builder --input table.json --type table 2. Verify final article has ≥2 tables 3. Verify ≥1 table in first 50% of article 4. Inject tables at the outline-architect specified positions ``` ## Default: markdown tables (safe) Always generates GFM markdown tables unless `chart_type` is explicit "bar" / "pie" / "line". ## SVG charts (XSS-safe) Per claude-blog pattern: no inline scripts, no event attributes, CSS-only hover. ## See also - `scripts/build/chart_svg_builder.py`

Details

Author
XuanRanL
Repository
XuanRanL/loamwright-SEO-Skill
Created
1 months ago
Last Updated
3 weeks ago
Language
Python
License
Apache-2.0

Integrates with

Bundled in these plugins

Similar Skills

Semantically similar based on skill content — not just same category

AI & Automation Featured

blog-chart

Generate dark-mode-compatible inline SVG data visualization charts for blog posts. Supports horizontal bar, grouped bar, donut, line, lollipop, area, and radar charts with automatic platform detection (HTML vs JSX/MDX). Enforces chart type diversity, accessible markup (role=img, aria-labelledby), source attribution, and transparent backgrounds. Use whenever the user mentions data visualization, charts, graphs, comparison tables that need to be visualized, or wants to embed inline SVG visualizations in a blog post, even if not invoking blog-write. Use when user says "blog chart", "generate chart", "data visualization", "svg chart", "blog graph", "visualize data", or when the blog-write workflow identifies chart-worthy data points (3+ comparable metrics, trends, before/after data).

2,121 Updated today
AgriciDaniel
AI & Automation Listed

blog-chart

Generate dark-mode-compatible inline SVG data visualization charts for blog posts. Supports horizontal bar, grouped bar, donut, line, lollipop, area, and radar charts with automatic platform detection (HTML vs JSX/MDX). Enforces chart type diversity, accessible markup (role=img, aria-label), source attribution, and transparent backgrounds. Use whenever the user mentions data visualization, charts, graphs, comparison tables that need to be visualized, or wants to embed inline SVG visualizations in a blog post, even if not invoking blog-write. Use when user says "blog chart", "generate chart", "data visualization", "svg chart", "blog graph", "visualize data", or when the blog-write workflow identifies chart-worthy data points (3+ comparable metrics, trends, before/after data).

0 Updated 1 weeks ago
gaznilmuzammil12-prog
Data & Documents Listed

gen-chart

Create polished, validated charts as a self-contained interactive HTML artifact or standalone SVG. In callers that display local Markdown images, also create an inline PNG preview. Interactive HTML includes dark/light themes, crosshair tooltips, legend toggling, and honest-by-construction axes. Accept pasted data (CSV/TSV/JSON/markdown tables), data files in the workspace, or plain-language descriptions with numbers. Use when the user asks to chart, graph, plot, or visualize data, metrics, or trends — line, bar, area, range, scatter, bubble, horizontal diverging bar, pie/donut, histogram, boxplot, or heatmap — or to beautify an existing chart.

1 Updated 5 days ago
gen-chart