PortalJS Add Chart

Fügt ein zugriffsbeschränktes recharts-Diagramm zu einer PortalJS-Dataset-Showcase-Seite hinzu.

von datopian · datopian/portaljs

Getestet · Funktioniert ★ 9.6/10

PortalJS Add Chart — Fügt ein zugriffsbeschränktes recharts-Diagramm zu einer PortalJS-Dataset-Showcase-Seite hinzu.

Was es kann

Installiert recharts, schreibt eine wiederverwendbare Chart.tsx-Komponente und bindet sie in den Views-Bereich einer PortalJS-Dataset-Showcase ein — beschränkt auf das gewählte Dataset, sodass andere Showcases unberührt bleiben. Unterstützt Linien-, Balken-, Flächen-, Kreis- und Streudiagramme, die dieselbe CSV/JSON wie die Tabelle lesen. Aktiviert sich, wenn ein bereits in datasets.json registriertes Dataset innerhalb eines PortalJS-Portals visualisiert werden soll.

Testbericht

Test in einem PortalJS-Portal: npm install recharts lief erfolgreich, tsc --noEmit fehlerfrei. Der Skill beschränkte das Diagramm korrekt auf eine Dataset-Showcase, eine Baseline zeigte es dagegen auf jeder Dataset-Seite.

Getestet am: 2026-07-10 · Claude Code 2.x (agent harness)

Installation

git clone https://github.com/datopian/portaljs
cd portaljs
mkdir -p ~/.claude/skills
cp -r skills/portaljs-add-chart ~/.claude/skills/portaljs-add-chart

Befehle & Beispiel-Prompts

  • /portaljs-add-chartFügt ein zugriffsbeschränktes recharts-Diagramm zu einer PortalJS-Dataset-Showcase-Seite hinzu.

Skills reagieren auf normale Anfragen — keine Slash-Befehle nötig. Nach der Installation aktivieren Prompts wie diese den Skill (auf Englisch):

  • Add a bar chart to this PortalJS dataset showcase page
  • Wire a recharts line chart into my dataset's Views section
  • Show this registered CSV dataset as a scatter chart on the portal