Bullet Graph

Categoría Comparación

Qué es

Diseñado como alternativa a los gauges. Una barra central muestra el valor real, una línea marca el objetivo y franjas de fondo indican rangos de rendimiento (malo/regular/bueno).

Para qué sirve

Para mostrar el desempeño de un indicador KPI en relación a un objetivo y rangos cualitativos, especialmente en dashboards compactos.

Cómo leerlo

Anatomía

La anatomía tiene cinco componentes fijos, no aproximados: la etiqueta, que identifica la medida; la escala cuantitativa, con marcas finas y grises fuera del área de trazado, igual que en un gráfico de barras; la medida principal, una barra sólida sin borde que ocupa aproximadamente un tercio del alto de su contenedor, porque debe ser el elemento más prominente; la medida comparativa (el objetivo), una línea perpendicular a la orientación del gráfico que debe pesar visualmente menos que la barra, nunca más; y los rangos cualitativos de fondo, entre dos y cinco franjas que jamás usan colores distintos entre sí, sino intensidades de un mismo tono, de más oscuro (peor) a más claro (mejor), justamente para que alguien con daltonismo pueda distinguirlas igual que cualquier otra persona. Ninguna de estas proporciones es arbitraria: son las que permiten empacar cinco capas de información en el espacio de una sola barra sin que ninguna compita visualmente con las demás.

Termómetro clínico con una marca roja apuntando a los 37°C de referencia sobre una escala lineal graduada: el bullet graph nace justo de este tipo de termómetro, reemplazando el gauge circular por una franja lineal con marca de objetivo

Por qué funciona

Fundamento perceptivo

Empaca cinco capas de información (valor, objetivo, tres rangos de fondo) en el espacio de una sola barra. Es el gráfico de KPI más eficiente en términos de ratio información/espacio.

Errores comunes

Convención poco conocida

A diferencia de una barra o una línea, nadie interpreta un bullet graph de forma intuitiva la primera vez que lo ve: la barra de fondo con rangos cualitativos, la barra central de valor real y la marca de referencia son un lenguaje que hay que aprender. Sin una leyenda clara la primera vez que aparece en un reporte, el lector puede confundir el rango de fondo con el propio valor medido.
Demasiados rangos cualitativos de fondo

El bullet graph fue pensado originalmente con tres franjas de fondo (por ejemplo, malo, aceptable, bueno). Agregar cinco o seis franjas para matizar más el desempeño satura el fondo del gráfico y hace que la barra de valor real, que es el dato más importante, pierda protagonismo frente al degradado de fondo.
Usarlo para series temporales

Un bullet graph compara un valor puntual contra un objetivo y un rango de referencia en un momento dado — no está pensado para mostrar cómo evoluciona una métrica en el tiempo. Repetir un bullet graph por cada mes de un año, uno debajo del otro, generalmente comunica peor una tendencia que una línea de tiempo simple con la meta marcada como referencia horizontal.

Dónde se usa

Contextos de aplicación

Meta de ventas del mes en tienda retail

Pizarra o panel visible en el piso de venta que muestra el avance acumulado del mes frente a la meta comercial, con franjas que marcan si el local va bajo, en línea o sobre el objetivo.

Panel de KPI en planta industrial

Indicador de producción de un turno en una línea de manufactura, donde la barra muestra unidades fabricadas y el tick marca la meta del turno, dentro de rangos de eficiencia esperados.

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.

Matplotlib License (estilo BSD)

Sin función "bullet" en matplotlib: tres barh() apiladas vía left= arman las franjas de fondo, una barh() más delgada encima es la barra de valor, y axvline() dibuja el tick de objetivo.

import matplotlib.pyplot as plt

label = "IPC variación anual"
valor, objetivo, maximo = 3.9, 3, 6
rangos = [2, 4, 6]
colores_rango = ["#EDE8E2", "#C2A878", "#9C9187"]

# Sin funcion "bullet": tres barh() apiladas via left= arman las franjas
# de fondo, una barh() mas delgada encima es la barra de valor, y
# axvline() dibuja el tick de objetivo.
fig, ax = plt.subplots(figsize=(7.6, 1.6))
prev = 0
for r, c in zip(rangos, colores_rango):
    ax.barh([label], [r - prev], left=prev, color=c, height=0.6)
    prev = r
ax.barh([label], [valor], color="#760D3E", height=0.22)
ax.axvline(objetivo, color="#3A3330", linewidth=3, ymin=0.15, ymax=0.85)
ax.set_xlim(0, maximo)
plt.show()