Gráfico de líneas
Una medida que cambia en el tiempo.
Definición
Un gráfico de líneas une con un trazo los valores de una medida en fechas sucesivas, de modo que se ven la tendencia, los picos y los cambios de ritmo. Varias líneas en el mismo eje se comparan entre sí. Es la forma por defecto para cualquier medida en el tiempo: ventas, precios, visitas.
- Datos
- x · series
- Buena para
- Enseñar cómo cambia una medida en el tiempo y cuándo cambia de ritmo.
- Evítala cuando
- Cuando el eje horizontal no es tiempo: unir categorías con una línea afirma una continuidad que no existe.
- Se lee bien
- Entre 3 y 100 elementos; dibuja hasta 1000
- Datos que faltan
- Une los puntos a través del hueco.
- Accesibilidad
- Lector de pantalla: resumen en texto · navegable con teclado · respeta «reducir movimiento»
Forma de los datos
Qué columnas pide
| Columna | Tipo | Para qué |
|---|---|---|
x | date | columns.x (alias columns.date) fija la columna temporal exacta. Sin binding se infiere una columna de fechas. El periodo debe ser legible en ISO; no se inventan meses ni se omiten fechas inválidas. |
series · opcional | number | columns.series, columns.y o columns.value selecciona UNA medida numérica; los aliases deben coincidir. Sin binding, cada columna numérica distinta de la fecha es una serie y su nombre rotula la leyenda. No hay formato largo. Un valor presente no finito falla; un hueco sigue omitiéndose. |
Tamaños
Recompuesta, no encogida
El motor vuelve a componer la pieza a cada ancho: los rótulos conservan su cuerpo y la figura gana alto si lo necesita.
Cuándo usarla
Tres preguntas antes de elegirla
¿El eje horizontal son fechas?
Si son categorías sin orden temporal, las barras las comparan sin unirlas.
Sí: quédate con gráfico de líneas
No: usa Gráfico de barras verticales
¿Las series comparten unidad y escala?
Si viven en escalas distintas, las líneas en base 100 las comparan desde un mismo punto de partida.
Sí: quédate con gráfico de líneas
No: usa Líneas en base 100
¿Importa el recorrido entre el principio y el final?
Si sólo cuentan dos momentos, el gráfico de pendiente une el antes y el después.
Sí: quédate con gráfico de líneas
No: usa Gráfico de pendiente
Código
La misma pieza, con tus datos
import { getPreset, renderComposition } from 'visx-render/node';
const spec = await getPreset('line');
spec.data.rows = misFilas; // x
const { svg, warnings } = await renderComposition(spec);También en React con Chart y prepareComposition. Guía para desarrolladores →
Dudas
¿Qué formato de fecha necesita?
Uno legible en ISO, como 2026-03 o 2026-03-15. No se inventan meses ni se descartan fechas mal escritas en silencio.
¿Cómo se pasan varias series?
Cada columna numérica es una serie y su nombre rotula la leyenda. No hay formato largo con una columna de nombre de serie.
¿Qué hace si faltan datos?
Une los puntos a través del hueco.
¿Cómo se ve en el móvil?
El motor la recompone a 360 px de ancho —rótulos, leyenda y alto— en vez de encoger la versión de escritorio.
Relacionadas
Otras formas de responder «cómo cambia en el tiempo»
Burndowntrabajo pendiente frente al plan de un sprint- Líneas en base 100comparar series con distinta escala
Curva de pérdidacómo converge el entrenamiento de un modelo
Curvas de retencióncuánto aguanta cada cohorte
Retornos móvilesrentabilidad en ventanas que se desplazan
Gráfico de áreasuna medida en el tiempo con el volumen destacado