skills.rest
Pinvou
PinvouOFFICIAL
Explore all skills by this author →
GitHub

visualizer

Generate validated Chart.js HTML dashboards from structured data and business metrics.

2.0k|291|Updated Jul 24, 2026
Search Tags:#html#data visualization#validation#dashboard#csv#chart.js#kpi
One-click install
npx skills add https://github.com/Pinvou/pinvou-agent --skill visualizer-pinvou
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: visualizer
Source: https://github.com/Pinvou/pinvou-agent/tree/main/pinvou3-app/src-tauri/resources/common/skill-marketplace/visualizer
Command: npx skills add https://github.com/Pinvou/pinvou-agent --skill visualizer-pinvou

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve? Turning Excel, CSV, JSON, or business metrics into polished data visualization dashboards usually requires manual chart building and styling. This Skill converts structured data into deliverable HTML dashboards with Chart.js, enforcing accessibility, design consistency, and machine-checked quality before delivery. ## Core Features & Use Cases - Chart.js Dashboard Generation: Builds KPI cards, trend charts, and comparison charts as standalone HTML files using the Chart.js UMD build. - Automated Validation: Ships a Python validator that rejects banned libraries (ECharts, Plotly), missing accessibility attributes, comments, gradients, and other style violations before delivery. - Design System Enforcement: Applies a flat, compact design system with custom HTML legends, persistent value labels, and strict typography rules. - Use Case: A user uploads a quarterly sales CSV and asks for a dashboard; the Skill aggregates the data, writes a validated HTML file with bar and line charts, and presents it as an artifact card. ## Quick Start Ask the agent to turn your spreadsheet or metrics into a Chart.js dashboard, for example: create a sales dashboard from this CSV with KPI cards and a monthly trend chart.

Frequently Asked Questions about visualizer

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I turn a CSV or Excel file into a chart dashboard?▼

Provide the CSV, Excel, JSON, or table data and request a dashboard or visualization report. The data is aggregated first, then rendered into an HTML file with Chart.js charts, KPI cards, and custom legends, validated before delivery.

What chart library does this visualization workflow use?▼

It uses Chart.js 4.4.1 loaded as a UMD bundle from cdnjs.cloudflare.com. ECharts, Plotly, Vega, and D3 pseudo-maps are banned unless the user explicitly requests them, and the validator rejects HTML containing those libraries.

How is the generated HTML dashboard validated before delivery?▼

A bundled Python script, validate_visualizer_html.py, checks the HTML for the Chart.js UMD reference, canvas accessibility attributes, disabled default legends, custom legend markup, and banned patterns like comments, gradients, shadows, and emoji. Failed output must be fixed and revalidated.

Does Chart.js support accessibility for screen readers?▼

Yes, when configured properly. Every canvas element must include role="img", a descriptive aria-label, and fallback text between the tags, and the validator fails the artifact if any canvas is missing these attributes.

When should I not use this data visualization skill?▼

Avoid it for landing pages, banners, posters, resumes, or other visual design tasks without a data-chart core; those belong to a visual design skill. Also avoid it when a real geographic map is needed but no real topology data is available.

Related Skills

Explore More Data & Analytics Skills→
brainbrewlabsbrainbrewlabs
7

data-cleaning

Profile and clean tabular datasets, then write a cleaned file with a change report.

Official
Intermediate
Clos01Clos01
3

html-ppt-weekly-report

Generate structured HTML weekly status report presentations from team updates and metrics.

Community
Intermediate
withmartian-sandboxwithmartian-sandbox

metrics-dashboard

Convert raw metrics into validated KPI dashboards with formulas and data lineage.

Official
Advanced
inbharataiinbharatai
22

dashboard-builder

Build interactive data dashboards and reports with Streamlit and Dash.

Community
Intermediate