ez-tree

# EZ-Tree — Visualización 3D de Árboles y Grafos ## Resumen Visualización de árboles y grafos en 3D — útil para datos jerárquicos y mapas de decisión. 1.4k⭐. ## Repo de referencia - **GitHub:** `github.com/dgreenheck/ez-tree` - **Lenguaje:** JavaScript - **Licencia:** MIT ## Instalación ```bash npm install ez-tree # o git clone https://github.com/dgreenheck/ez-tree.git cd ez-tree && npm install ``` ## Uso Básico ```javascript import EzTree from 'ez-tree'; const tree = new EzTree({ container: '#tree-container', data: { name: 'Root', children: [ { name: 'A', children: [ { name: 'A1' }, { name: 'A2' } ]}, { name: 'B', children: [ { name: 'B1' } ]} ] }, layout: 'radial', // 'radial', 'hierarchical', 'force' colors: ['#2563eb', '#f97316', '#10b981'], }); tree.render(); // Interacción tree.on('click', (node) => { console.log('Clicked:', node.name); }); ``` ## Patrones Clave 1. **Layouts:** Radial, hierárquico, force-directed 2. **Interacción:** Click, hover, zoom, pan 3. **Custom:** Colores, tamaños, formas personalizables 4. **Animation:** Transiciones suaves entre layouts 5. **Export:** PNG, SVG de la visualización ## Integración con Mastermind - Complementa `threejs-3d-maps` — visualización jerárquica vs geoespacial - Útil para `competitive-intelligence` — mapas de competencia - Ideal para `dspy` — visualización de programas - Reemplaza D3.js trees para visualización 3D ## Pitfalls - **Tamaño:** Datos muy grandes (>1000 nodos) pueden ser lentos - **Layout:** El layout radial no siempre es el óptimo - **Dependencias:** Requiere Three.js - **Mobile:** Puede no funcionar bien en móviles ## Referencias - [GitHub: dgreenheck/ez-tree](https://github.com/dgreenheck/ez-tree)