Stacked Area 100%
100% Stacked Area
Qué es
Variante del Área Apilada donde el total siempre es 100%. Muestra cómo evolucionan las proporciones de cada parte a lo largo del tiempo de forma continua.
Para qué sirve
Para mostrar la evolución de composición porcentual a lo largo del tiempo cuando los datos son continuos.
Cómo leerlo
Anatomía
La versión continua del stacked bar 100%: hereda la misma convención de marcar la línea del 100% con el mismo peso que la línea de cero, pero aplicada a una curva en vez de barras discretas. El límite superior de cada banda ya no es un valor absoluto que sube y baja —como en un área apilada común— sino una participación porcentual sobre un total que la normalización hace desaparecer del gráfico. Es, de las cuatro variantes "apiladas" de este catálogo, la que exige más cuidado de lectura: el ojo tiende a interpretar que una banda se "achica" cuando en realidad puede estar creciendo en términos absolutos, solo que más lento que el total —una serie puede duplicar su valor real de un extremo a otro del gráfico y aun así verse más angosta, si el total se triplicó en el mismo período. Es la trampa perceptiva más citada en contra de esta forma de gráfico, y la razón por la que conviene acompañarla siempre de las cifras absolutas en algún lugar cercano.
Por qué funciona
Fundamento perceptivo
A diferencia del Stacked Bar 100%, las áreas comunican continuidad y flujo, lo que es más natural para datos temporales continuos.
Errores comunes
Capas intermedias difíciles de comparar
Igual que en las barras apiladas al 100%, solo la capa inferior tiene una línea base fija en cero; las capas intermedias flotan sobre una base que cambia de grosor de un punto a otro, lo que hace muy difícil juzgar si una capa intermedia realmente creció o solo parece haberlo hecho porque la capa de abajo cambió de tamaño.
Orden de las capas sin criterio
El orden en que se apilan las categorías cambia qué tan fácil es leer cada una: las capas más cercanas a la línea base (la más estable) son las más fáciles de comparar en el tiempo, mientras que las de más arriba, con una base irregular, son las más difíciles. Ordenar las categorías más volátiles cerca de la base, y las más estables arriba, suele facilitar la lectura general.
Demasiadas categorías apiladas
Con más de 5 o 6 categorías apiladas, los colores empiezan a repetirse en tonos parecidos entre sí, o la paleta se vuelve tan extensa que distinguir una capa de la vecina exige mirar la leyenda constantemente. Igual que en otros gráficos apilados, agrupar las categorías menores bajo "otros" suele ser más legible que mostrarlas todas por separado.
Dónde se usa
Contextos de aplicación

Cuota de mercado de navegadores web
Participación de cada navegador sobre el total de visitas, medida mes a mes de forma continua.

Composición de la matriz energética
Qué porcentaje de la electricidad generada proviene de cada fuente, a lo largo de las décadas.

Tráfico de un sitio web por dispositivo
Participación de visitas desde celular, computador y tablet, siguiendo su evolución mes a mes.
Cómo construirlo
El mismo gráfico, en 11 librerías open source
Cada librería resuelve las mismas decisiones de diseño, como la escala, el espaciado entre barras o la inserción de la etiqueta de valor, de un modo distinto. Algunas las automatizan; otras las dejan explícitas en el código, a criterio de quien lo escribe. Comparar once implementaciones con los mismos datos y el mismo color de marca aísla esa diferencia, que de otro modo queda oculta detrás de estilos visuales distintos.
stackplot() apila todas las series en una sola llamada; como estos datos ya suman 100 por año, el resultado ya es un área 100% apilada sin necesitar ningún parámetro de normalización.
import matplotlib.pyplot as plt
# CNE y Coordinador Electrico Nacional, matriz electrica chilena por
# tecnologia, 2016-2023 -- ya son porcentajes que suman 100.
anios = ["2016", "2019", "2023"]
termica = [63.4, 56.0, 37.3]
hidraulica = [24.0, 24.6, 26.1]
ernc = [12.6, 19.4, 36.6]
# stackplot() apila todas las series en una sola llamada; como estos
# datos ya suman 100, el resultado ya es un area 100% apilada.
fig, ax = plt.subplots(figsize=(8, 5))
ax.stackplot(anios, termica, hidraulica, ernc,
colors=["#490827", "#760D3E", "#D2601F"], alpha=0.9,
labels=["Térmica", "Hidráulica convencional", "ERNC"])
ax.legend(frameon=False, loc="upper center", bbox_to_anchor=(0.5, -0.08), ncol=3)
plt.tight_layout()
plt.show()Herramientas para construirlo
No-code, desktop y plataformas web, con su licencia visible, abierta o comercial.
Términos relacionados
Con datos reales
Ejemplos de uso.
¿Cómo cambió la matriz eléctrica chilena?
Participación de cada tecnología en la generación eléctrica del Sistema Eléctrico Nacional, 2016-2023. Las renovables no convencionales (solar y eólica, entre otras) pasaron de casi marginales a casi empatar con la generación térmica.
Fuente: Comisión Nacional de Energía (CNE) y Coordinador Eléctrico Nacional
Gráficos relacionados