PortalJS Add Chart
Añade un gráfico de recharts, delimitado a un dataset, en la página showcase de PortalJS.
Probado · Funciona
Qué hace
Instala recharts, escribe un componente Chart.tsx reutilizable y lo conecta a la sección Views del showcase de un dataset de PortalJS, delimitado al dataset elegido para que no afecte a otros showcases. Soporta gráficos de línea, barras, área, tarta y dispersión leyendo el mismo CSV/JSON que ya usa la tabla. Se activa al visualizar un dataset ya registrado en datasets.json dentro de un portal PortalJS.
Informe de la prueba
Ejecutamos un pase real de add-chart en un portal PortalJS de prueba: npm install recharts@^2.15.0 funcionó y tsc --noEmit pasó limpio; la skill delimitó correctamente el gráfico a un solo dataset, mientras que un baseline desde cero lo renderizaba en todas las páginas de dataset.
Probado el: 2026-07-10 · Claude Code 2.x (agent harness)
Instalación
git clone https://github.com/datopian/portaljs cd portaljs mkdir -p ~/.claude/skills cp -r skills/portaljs-add-chart ~/.claude/skills/portaljs-add-chart
Comandos y prompts de ejemplo
/portaljs-add-chartAñade un gráfico de recharts, delimitado a un dataset, en la página showcase de PortalJS.
Los skills se activan con peticiones en lenguaje natural, sin comandos que memorizar. Tras instalarlo, prompts como estos lo activan (en inglés):
Add a bar chart to this PortalJS dataset showcase pageWire a recharts line chart into my dataset's Views sectionShow this registered CSV dataset as a scatter chart on the portal