Tres horizontes
Negocio actual, emergente y futuro.
Definición
El gráfico de tres horizontes dibuja, periodo a periodo, el negocio actual, el emergente y el futuro como áreas superpuestas, sin apilar. Se lee buscando en qué periodo cada horizonte adelanta al anterior y si la suma aguanta durante el relevo. Se usa en planes estratégicos para enseñar la transición de una cartera de negocios.
- Datos
- x · value
- Buena para
- Ver cuándo el negocio nuevo releva al actual y si el total se sostiene mientras tanto.
- Evítala cuando
- Cuando lo que importa es el total y su composición en cada periodo: las áreas superpuestas no se suman a ojo.
- Se lee bien
- Entre 4 y 40 elementos; dibuja hasta 1400
- Datos que faltan
- Omite el valor ausente y lo declara aparte.
- Accesibilidad
- Lector de pantalla: resumen en texto · respeta «reducir movimiento»
Forma de los datos
Qué columnas pide
| Columna | Tipo | Para qué |
|---|---|---|
x | string | El periodo del eje de tiempo (una fila por periodo). Se lee como ETIQUETA y en el orden en que vienen las filas: un plan por ejercicio no se reordena ni se parsea como fecha. |
value | number | Cada columna numérica restante es un HORIZONTE, y el orden en que se escriben ES la sucesión: la primera es el negocio núcleo y la última la apuesta más lejana. Hacen falta entre dos y cinco. La columna del total («Total», «Envolvente») se descarta por nombre: la envolvente la calcula la figura. |
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
¿Te interesa cuándo un horizonte adelanta a otro?
Si la pregunta es cuánto aporta cada parte al total, las áreas apiladas lo enseñan.
Sí: quédate con tres horizontes
No: usa Áreas apiladas
¿Los horizontes se suceden en orden, del núcleo a la apuesta lejana?
Si son series independientes sin relevo entre ellas, basta con líneas.
Sí: quédate con tres horizontes
No: usa Gráfico de líneas
¿Tienes cifras por periodo para cada horizonte?
Si solo quieres explicar la idea de una adopción por fases, sin datos, sirve una curva esquemática.
Sí: quédate con tres horizontes
No: usa Curva en S
Código
La misma pieza, con tus datos
import { getPreset, renderComposition } from 'visx-render/node';
const spec = await getPreset('threehorizons');
spec.data.rows = misFilas; // x, value
const { svg, warnings } = await renderComposition(spec);También en React con Chart y prepareComposition. Guía para desarrolladores →
Dudas
¿Por qué no se apilan las áreas?
Porque apiladas el cruce entre horizontes se vuelve invisible, y ese cruce es lo que se quiere ver.
¿Cómo se calcula el cruce?
A partir de los datos, interpolando en el mismo tramo recto que se dibuja; no se marca a ojo.
¿En qué orden van los horizontes?
En el de las columnas: la primera es el negocio núcleo y la última la apuesta más lejana.
¿Qué hace si faltan datos?
Omite el valor ausente y lo declara aparte.
¿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»
Gráfico de áreasuna medida en el tiempo con el volumen destacado
Gráfico de control por atributostasa de defectos de lotes frente a sus límites
Barras y línea combinadasuna cifra absoluta junto a su tasa
Bandas de Bollingerprecio frente a su rango habitual de variación
Gráfico con selector de rangoexplorar un tramo de una serie larga
Burndowntrabajo pendiente frente al plan de un sprint