Estudio de Chartist.js

Visualización de Datos ⭐ 44 stars
Gráficos SVG responsivos con control total de apariencia.

🤖 Skill de implementación: frontend-desarrollo (regla: solo catálogo de las 66 · versiones por ERR/MEJ)

1 · Características

Instalación: npm i chartist (o CDN)

import Chartist from 'chartist';
new Chartist.Line('.ct-chart', { series: [[1, 3, 2, 4]] });

Dos casos de uso comunes implementados con esta librería.

Línea con etiquetas.

import Chartist from 'chartist';

new Chartist.Line('.ct-chart', {
  labels: ['Ene', 'Feb', 'Mar'],
  series: [[10, 20, 15]],
});

🔁 Cómo funciona: Chartist genera SVG responsivo a partir de labels y series.

Bar chart con ajuste automático.

import Chartist from 'chartist';

new Chartist.Bar('.ct-chart', {
  labels: ['A', 'B', 'C'],
  series: [[5, 9, 7]],
}, { distributeSeries: true });

🔁 Cómo funciona: `Bar` dibuja las barras en SVG y se adapta al contenedor.

Categoría	Visualización de Datos
Stars (GitHub)	⭐ 44
Sitio oficial	https://gionkunz.github.io/chartist-js/
GitHub	https://github.com/gionkunz/chartist-js
Instalación	`npm i chartist (o CDN)`
Relacionadas	D3.js · Chart.js · Highcharts

📦 Regla de librerías (local primero): revisar C:\Users\TUF\Documents\librerías\local\ antes de descargar. Volver al índice de los 66 estudios.