Chart Data Transition

Las barras suben desde altura cero hasta sus valores.

Añade un gráfico de barras animado (Bar Chart Grow) en [dónde], también llamado animated bar chart o bar chart entrance.
Cada barra debe subir desde la línea base hasta su valor una tras otra con un escalonado rápido, desacelerando con suavidad al asentarse.
Reprodúcelo una sola vez cuando el gráfico entre en pantalla y muestra el gráfico terminado de inmediato si el usuario prefiere movimiento reducido (prefers-reduced-motion).

Las barras horizontales intercambian posiciones con el tiempo a medida que cambian los valores.

Añade un gráfico de carrera de barras (Bar Chart Race) en [dónde], también llamado racing bar chart.
Las barras horizontales deben crecer y encogerse a medida que cambian los valores con el tiempo y deslizarse con suavidad unas junto a otras cada vez que cambie su posición, cada una con su etiqueta.
Mueve las barras con transformaciones en lugar de reordenar el marcado para que los intercambios se deslicen en vez de saltar, y da a los usuarios una forma de pausarlo.

Un anillo o un gráfico circular se rellena en sentido horario hasta su porcentaje.

Añade una animación "Donut Chart Fill" (también llamada pie chart sweep o animated donut chart) en [dónde].
Empezando por arriba, cada segmento debe barrer en sentido horario por turnos hasta que el anillo muestre su proporción, desacelerando con suavidad al terminar.
Reprodúcela una sola vez cuando el gráfico entre en pantalla y deja los valores reales disponibles como texto para los lectores de pantalla.

Unas barras verticales crecen y se encogen desfasadas, como un ecualizador de audio.

Añade una animación de carga "Bar Loader (Equalizer)" (también llamada bars loader o audio bars) en [dónde].
Unas pocas barras verticales deben estirarse y encogerse desfasadas entre sí como un ecualizador de audio, a un ritmo vivo pero regular.
Haz que el bucle sea continuo, dale una etiqueta de estado para lectores de pantalla y detén el movimiento si el usuario prefiere movimiento reducido (prefers-reduced-motion).

Un número cuenta desde un valor inicial hasta un valor objetivo cuando se vuelve visible.

Añade un contador animado (Number Ticker) en [dónde], también llamado count up o animated counter.
Cuando el número entre en pantalla, debe contar desde cero hasta su objetivo, rápido al principio y frenando con suavidad al llegar.
Usa dígitos de ancho fijo para que nada alrededor tiemble, cuenta una sola vez y da el valor final de inmediato a los lectores de pantalla y si el usuario prefiere movimiento reducido (prefers-reduced-motion).

Cada dígito rueda en vertical hasta el nuevo valor cuando cambia un número.

Añade una animación de números "Odometer" (también llamada rolling numbers o slot-machine digits) en [dónde].
Cuando cambie el valor, cada dígito debe rodar en vertical hasta su nuevo dígito, siempre hacia delante, con un ligero escalonado entre dígitos y un pequeño asentamiento al final.
Mantén todos los dígitos del mismo ancho para que el número no se desplace, y expón solo el valor final a los lectores de pantalla.