Generador de Diagrama de Cuerdas Doble Abanico Colorido

Generador gratuito en línea de diagramas de cuerdas de doble abanico colorido. Sube un CSV de tres columnas source,target,value para crear un gráfico bipartito en forma de reloj de arena: cinco arcos sólidos se abren hacia las 12 y cinco arcos pastel hacia las 6 sobre el mismo círculo, con aberturas a las 2 y a las 9. Cintas translúcidas se cruzan en la cintura central y cada sector lleva su propio eje graduado desde 0. Incluye un ejemplo 5 × 5, exportación PNG / SVG y modo oscuro.

Qué es un diagrama de cuerdas de doble abanico

El diagrama de cuerdas de doble abanico es una variante bipartita del diagrama de cuerdas clásico: la misma disposición que aparece en circlize como bipartite chord plot. En lugar de repartir todos los nodos por un único anillo completo, divide el mismo círculo en dos abanicos opuestos: los nodos fuente ocupan el abanico alrededor de las 12 y los nodos destino el de las 6, con dos aberturas a las 2 y a las 9 que dibujan la silueta de reloj de arena. Cada nodo es una banda de arco cuyo ancho angular es proporcional a su flujo total; el abanico superior usa cinco tonos saturados (casi negro, carmesí, verde hierba, azul medio, cian) y el inferior los repite en versiones pastel, con el negro compartido en lugar de aclarado. Cada relación fuente-destino se convierte en una cinta de color translúcida cuyo ancho de extremo sigue el valor y que se estrecha hacia el centro al cruzar la cintura abierta: la densidad de la imagen equivale, por tanto, a la distribución de flujos.

Qué puedes hacer

• Subir CSV — tres columnas source,target,value, hasta 8 nodos por lado y 120 filas.
• Render inmediato — dos abanicos, cintas que cruzan el centro y un eje graduado propio desde 0 para cada sector (marcas principales cada 10).
• La longitud de arco equivale al flujo — el ancho del sector sigue el flujo total del nodo y el de la cinta cada valor, sin maquetación manual.
• Modo claro / oscuro — un clic cambia el fondo y la exportación conserva el fondo elegido.
• Exportar PNG / SVG — PNG en 2× y SVG vectorial, sin marca de agua.
• Privacidad local — todo se procesa en el navegador, nada se sube.

Cómo usarlo

1. Abre la página para ver el ejemplo 5 × 5 renderizado como diagrama de doble abanico; sube o arrastra tu propio CSV, o pulsa antes «Cargar ejemplo».
2. Pasa el cursor por un sector o una cinta para leer el total del nodo o el valor de un flujo.
3. Cambia entre modo claro y oscuro, o usa el botón de la esquina superior derecha para la vista a pantalla completa.
4. Pulsa «Descargar PNG» o «Descargar SVG» para guardar la imagen.

Ejemplo de formato CSV (tres columnas separadas por comas, con o sin la cabecera source,target,value):

source,target,value
C1,R1,14
C1,R2,9
C2,R2,16
C2,R3,7

Ámbitos de uso

• Canales y flujos: canales de captación hacia resultados de conversión, proveedores aguas arriba hacia familias de compra.
• Reparto de costes: centros de coste hacia cuentas de gasto, departamentos hacia proyectos.
• Cobertura de requisitos y pruebas: requisitos hacia módulos, módulos hacia casos de prueba.
• Encuestas matriciales: opciones de respuesta hacia segmentos de audiencia, síntomas hacia diagnósticos.
• Presentaciones y pósters: los ejes graduados integrados hacen legibles los valores, así que el gráfico puede ir directo a una diapositiva o a la portada de un informe.

Notas

Acepta archivos de texto .csv; un nombre no puede aparecer a la vez en las columnas source y target (datos estrictamente bipartitos). El abanico superior usa cinco tonos sólidos y el inferior sus ecos pastel; cada cinta toma un tono aclarado del color de su fuente con una opacidad de aproximadamente 0,7, y el abanico inferior lleva además una fina banda exterior segmentada por color de pareja. El eje de cada sector parte de 0 en un extremo del arco y crece en sentido horario hasta el flujo total del nodo: los números de arriba ascienden de izquierda a derecha y los de abajo de derecha a izquierda en pantalla, según la convención tradicional de circlize. Si necesitas comparar con precisión diferencias numéricas pequeñas, es mejor un gráfico de barras.

---

Última verificación: 2026-09-11

Cómo leer este gráfico

Empieza por la separación de colores: el abanico de las 12 lleva las fuentes (cinco tonos sólidos) y el de las 6 los destinos (ecos pastel, con el negro compartido). Un sector más ancho implica un flujo total mayor para ese nodo. Toma cualquier cinta de color: un extremo se apoya en el borde interno de un sector fuente y el otro aterriza en el borde interno de un sector destino, así que se lee «esta fuente → este destino»; una cinta más ancha indica un valor mayor. El eje graduado del exterior de cada sector es la escala de flujo acumulado del propio nodo, desde 0 con marcas principales cada 10 y cifras alineadas con la tangente del arco, de modo que puedes leer el valor aproximado de cada flujo, no solo su tamaño relativo.