Carrera de líneas

Descripción general

Los gráficos tipo “line race” animan múltiples series a lo largo del tiempo, destacando cómo cambian sus posiciones relativas y sus valores. A medida que avanzan los años, las líneas suben o bajan según los ingresos, ofreciendo una visualización dinámica de la competencia económica y los patrones de crecimiento. Esta técnica da vida a los datos históricos, facilitando identificar líderes, historias de alcance y giros drásticos en el ranking.

Cuándo usarlo

Mostrar la evolución competitiva de indicadores económicos entre países o regiones
Revelar cambios dramáticos en el desempeño relativo durante largos periodos
Crear relatos envolventes con tendencias históricas
Destacar ganadores y rezagados a lo largo de décadas
Presentar desigualdad o convergencia de ingresos
Hacer que datos de largo plazo sean memorables

No es ideal para

Historias donde una comparación estática sea suficiente
Audiencias que prefieren controlar el ritmo por sí mismas
Situaciones donde importan más los valores exactos que la posición relativa
Medios impresos o estáticos sin soporte de animación
Más de 10 series simultáneas (se vuelve caótico)

Variaciones clave

Velocidad de animación (2–10 segundos por década)
Etiquetas finales con el valor de cada serie
Curvas suaves vs segmentos rectos entre puntos
Resaltar al líder actual
Controles interactivos para reproducir o explorar

Casos de uso

Evolución de ingresos nacionales en Europa desde 1950
Rankings de PIB per cápita por décadas
Convergencia o divergencia económica regional
Comparaciones de crecimiento de ingresos por industria
Tasas de adopción tecnológica por país
Mejora de esperanza de vida entre naciones

Datos (CSV)

Year,Finland,France,Germany,Iceland,Norway,Poland,Russia,United Kingdom
1950,8200,9500,7100,10500,11200,5400,6100,9800
...
2020,36900,40200,42100,44800,49800,30100,28300,38100

Configuración del gráfico (JSON)

Consejos de diseño

Usa colores distintivos para cada país y mantener su identidad durante la animación
Activa etiquetas finales para mostrar ranking y valores al cierre
Configura 8–12 segundos para recorrer 70 años cómodamente
Mantén smooth: false para respetar mediciones históricas
Reserva 120–150 px en el margen derecho para las etiquetas finales
Considera énfasis al pasar el cursor para explorar cada serie

Consejos de rendimiento

Limita la visualización a 5–8 series para preservar la claridad
Si tienes más de 50 puntos temporales, muestrea cada 5 años
Usa showPoints: false para mejorar el renderizado
Prueba la velocidad de animación con tu audiencia: demasiado rápido confunde

Preguntas frecuentes

¿Qué ritmo de animación es adecuado? Para décadas de datos, 8–12 segundos totales suelen funcionar (≈0.15–0.2 s por año). Para periodos cortos, 3–5 segundos bastan.

¿Cómo funcionan las etiquetas finales? Aparecen en el borde derecho mostrando nombre y valor final, por lo que no necesitas recurrir a la leyenda para ver el ranking definitivo.

¿Deben mostrarse todas las líneas a la vez? Sí, el efecto “carrera” depende de verlo todo simultáneamente. Si tienes más de 8 series, considera mostrar solo las top 5 y una serie de comparación adicional.

¿Qué hago si las series se cruzan mucho? Eso aporta interés visual. Usa colores bien diferenciados y énfasis al pasar el cursor para que cada usuario pueda seguir una serie concreta.

¿Se puede pausar o reiniciar? Aunque esta configuración se describe en Markdown, la mayoría de librerías permiten agregar botones de play/pausa o reinicio mediante eventos.

¿Y si los valores difieren mucho? Si una serie es 10× otra, usa un eje logarítmico o presenta tasas de crecimiento (%). También puedes dividir la historia en varias secciones o escalas.

Example

Guide