← ClaudeAtlas

chart-dashboardlisted

Build a self-contained HTML dashboard, data-story report, or slide deck from supplied information (metrics, tables, notes, pasted data, a topic), rendered with the bundled zero-dependency charts-lib SVG chart library. Use whenever the user asks for a dashboard, analytics page, KPI/bento view, illustrated report, or a presentation, slides or a deck built from data they provide or describe.
raghuramsirigiri/claude-chart-dashboard · ★ 1 · Data & Documents · score 74
Install: claude install-skill raghuramsirigiri/claude-chart-dashboard
# Chart dashboard Turn whatever information the user gives — a table, pasted numbers, a set of metrics, notes, or just a topic and some facts — into a single self-contained HTML page of SVG charts rendered with `charts-lib`: a dashboard, a report, or a slide deck. ## Workflow 1. **Extract the data.** Pull every number, category, and time series out of the user's input into a short plan: for each planned panel note *title, chart type, categories, series*. If the user gave a topic with no numbers, say plainly that figures are illustrative and label them as such on the page. Never silently invent numbers that read as real measurements. Three things count as invention, and the last two are easy to miss: - **Filling a gap.** A missing week is a gap (`null`), not a zero — a zero draws a collapse that never happened. And a gap only reads as one if the series is unsmoothed: `Charts.line` defaults to `spline`, which drops nulls and draws an unbroken curve through the hole. Set `type: 'line'` on any series with an interior gap. - **Estimating onto a real chart.** If you interpolate or model a value, it does not belong as another point on the primary trend, however carefully you dash the line or footnote it. Readers remember the shape, not the caveat. Put estimates in their own panel, or leave the hole visible. - **Rescaling stale numbers.** When you're updating an existing page and the user gave you new figures for onl