Barras divergentes
Valores a ambos lados de un punto neutro.
Definición
Las barras divergentes alinean cada pregunta de una encuesta de acuerdo en torno a un eje central, la frontera entre desacuerdo y acuerdo: el desacuerdo se extiende hacia un lado y el acuerdo hacia el otro. Se lee a qué lado cae el peso de cada fila y se comparan filas entre sí. Es la forma habitual de enseñar encuestas de clima o de satisfacción.
- Datos
- category · value
- Buena para
- Comparar entre preguntas hacia qué lado se inclinan las respuestas de una escala de cinco puntos.
- Evítala cuando
- Cuando las categorías no tienen un orden ni un punto neutro: dos lados que no existen confunden.
- Se lee bien
- Entre 2 y 20 elementos; dibuja hasta 200
- Datos que faltan
- Dibuja el valor ausente como cero.
- Accesibilidad
- Lector de pantalla: tabla de datos · respeta «reducir movimiento»
Forma de los datos
Qué columnas pide
| Columna | Tipo | Para qué |
|---|---|---|
category · opcional | string | La fila (la pregunta). Sin ella el chart devuelve una serie vacía. |
value · opcional | number | Por POSICIÓN, no por nombre: las cinco primeras columnas numéricas son, EN ORDEN, muy en desacuerdo · en desacuerdo · neutral · de acuerdo · muy de acuerdo. Cambiar el orden de las columnas cambia el significado del dibujo sin avisar. |
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
¿Las respuestas siguen una escala con centro?
Si las categorías no tienen orden ni punto neutro, unas barras apiladas reparten el total sin fingir dos lados.
Sí: quédate con barras divergentes
No: usa Barras apiladas¿Quieres ver el reparto completo de cada pregunta?
Si basta con un saldo neto por fila, unas barras horizontales ordenadas lo comparan antes.
Sí: quédate con barras divergentes
No: usa Gráfico de barras horizontales¿Comparas preguntas entre sí, y no dos grupos?
Si enfrentas dos poblaciones —dos años, dos colectivos—, las barras opuestas ponen cada una a un lado.
Sí: quédate con barras divergentes
No: usa Barras opuestasCódigo
La misma pieza, con tus datos
import { getPreset, renderComposition } from 'visx-render/node';
const spec = await getPreset('divergingbar');
spec.data.rows = misFilas; // tus columnas
const { svg, warnings } = await renderComposition(spec);También en React con Chart y prepareComposition. Guía para desarrolladores →
Dudas
¿En qué orden van las columnas?
Por posición, no por nombre: las cinco primeras columnas numéricas son, en orden, muy en desacuerdo, en desacuerdo, neutral, de acuerdo y muy de acuerdo. Si cambias el orden, cambia el significado del dibujo sin aviso.
¿Por qué las filas se pueden comparar?
Porque el eje se ancla en la frontera entre desacuerdo y acuerdo en todas ellas: el centro es el mismo para cada pregunta.
¿Hace falta la columna de pregunta?
Sí. Sin la columna de categoría el gráfico devuelve una serie vacía.
¿Qué hace si faltan datos?
Dibuja el valor ausente como cero. Si un hueco no es un cero en tus datos, rellénalo o elimina la fila antes de dibujar.
¿Cómo se ve en el móvil?
El motor la recompone a 480 px de ancho —rótulos, leyenda y alto— en vez de encoger la versión de escritorio.
Relacionadas
Otras formas de responder «comparar cifras»
Análisis de accretion/dilutionefecto de una operación en el beneficio por acción
Gráfico de flechascambio con dirección entre dos momentos
Gráfico de barras verticalescomparar valores entre pocas categorías
Serie con banda de referenciatu serie frente al rango de sus pares
Comparativa con parestu resultado frente al de otras empresas
Gráfico de Bland-Altmanacuerdo entre dos métodos de medición