Visor de redes
App web estática para cargar grafos en JSON, visualizarlos en 3D y explorar su resiliencia con una simulación simple de ataque (eliminación aleatoria de nodos). Incluye ejemplos listos para probar y scripts opcionales para generar datos.
Tecnologías
Roles
Resultados y Logros
-
Implementación de una demo estática (sin backend) con flujo completo: JSON → visualización 3D → simulación.
-
Carga de JSON por archivo (sin copy/paste) y ejemplos listos para probar.
-
Separación mínima y mantenible:
assets/(tema), páginas HTML,scripts/para generación/ataque.
Qué es
Visor de redes es una demo técnica (sin backend) para cargar un grafo en JSON, renderizarlo en 3D y simular un ataque básico eliminando nodos de forma aleatoria para observar cómo cambia la conectividad.
Cómo se usa
- Abrir la demo.
- Cargar un archivo
.jsondesde el botón “Cargar archivo JSON”. - (Opcional) Ejecutar la simulación de ataque desde la página de simulación.
Notas
- Demo honesta: el modelo de ataque es deliberadamente simple.
- Incluye ejemplos en el repositorio para probar en menos de 1 minuto.
Contexto
Este proyecto nace de un interés por la teoría de redes y la visualización de estructuras complejas. El objetivo era construir una herramienta ligera y sin dependencias de servidor que permitiera cargar cualquier grafo en formato JSON, explorarlo visualmente en 3D y observar cómo responde su estructura ante la eliminación de nodos.
Reto
Representar grafos en 3D de forma interactiva y accesible desde el navegador, sin backend ni instalación. El visor debía soportar archivos JSON de tamaño variable, ofrecer una simulación de ataque comprensible y mantener una estructura de código mínima y mantenible.
Decisiones técnicas
App completamente estática para máxima portabilidad (hosting estático / GitHub Pages) y mínimo mantenimiento. Entrada por archivo JSON para evitar copy/paste y permitir grafos grandes. Visualización 3D con Three.js para renderizado de nodos y enlaces. Simulación de ataque deliberadamente simple: eliminación aleatoria de nodos para observar cambios de conectividad y fragmentación. Scripts auxiliares en Python con NetworkX para generación de grafos de ejemplo.
Mi rol
Diseño, desarrollo y documentación completa del proyecto: arquitectura de la aplicación, frontend HTML/CSS/JS, integración de Three.js para renderizado 3D, scripts Python para generación de datos y simulación, y documentación técnica con dossier bilingüe.
Limitaciones y evolución
El modelo de ataque es deliberadamente simple — no incluye estrategia adversaria. No es un modelo científico completo, sino una demo para exploración visual. Posibles líneas de evolución: ataques dirigidos (por grado, centralidad), métricas de resiliencia cuantitativas y soporte para formatos adicionales de grafo.
¿Te interesa este proyecto?
Si deseas más información técnica, documentación adicional o discutir una colaboración, no dudes en contactarme.
Solicitar información