Gráfico de mapa de árbol (Treemap)
Visualice datos jerárquicos utilizando rectángulos anidados proporcionales al valor.
Acerca de Gráfico de mapa de árbol (Treemap)
Los mapas de árbol muestran datos jerárquicos (estructurados en árbol) como un conjunto de rectángulos anidados. A cada rama del árbol se le asigna un rectángulo, que luego se rellena con rectángulos más pequeños que representan sub-ramas.
Cómo usar
- Pegue datos jerárquicos: use un formato estructurado como 'Padre > Hijo' o 'Categoría, Valor'.
- Asigne sus niveles: la herramienta detecta automáticamente los patrones de anidamiento para una visualización instantánea.
- Navegue por las categorías: haga clic en los encabezados para profundizar en ramas específicas.
- Ajuste los colores: elija una paleta de gradiente o categórica para resaltar la densidad o el agrupamiento.
- Exportar: descargue como PNG de alta resolución o SVG para informes interactivos.
Casos de uso comunes
- Análisis del sistema de archivos: visualice el uso del espacio en disco por carpeta y tipo de archivo.
- Resumen del mercado de valores: realice un seguimiento de la capitalización de mercado y el rendimiento por sector y empresa individual.
- Visualización de presupuestos: explore las categorías y sub-categorías de gastos de forma proporcional.
- Segmentación de clientes: analice los grupos de clientes por región y comportamiento de compra.
Detalles técnicos
Desarrollado por Apache ECharts. Cuenta con un algoritmo de teselado recursivo para una utilización óptima del área y navegación por migas de pan interactiva.
Preguntas frecuentes
- ¿Puedo hacer clic para ampliar las secciones?
- Sí, al hacer clic en una categoría, el mapa de árbol se ampliará en esa rama específica para obtener más detalles.
- ¿Qué datos funcionan mejor en un mapa de árbol?
- Los mapas de árbol son ideales para datos jerárquicos con valores numéricos, como presupuestos por departamento, ventas por categoría de producto o tamaño de carpeta de sistema de archivos. Cada rectángulo representa una categoría cuya área es proporcional a su valor.
- ¿Cómo exporto mi mapa de árbol a PowerPoint?
- Haz clic en «Descargar PPTX». El mapa de árbol se captura como imagen de alta resolución y se incrusta en una diapositiva de PowerPoint. Como los mapas de árbol usan renderizado dinámico de canvas, la exportación PPTX reproduce fielmente los rectángulos proporcionales y etiquetas tal como se ven en pantalla.
- ¿Cómo debo formatear los datos para un mapa de árbol?
- Prepara como mínimo una columna de Etiqueta y una de Valor (solo números positivos). Para mapas de árbol jerárquicos, añade una columna Padre con el nombre de la categoría padre de cada elemento. Los nodos hoja sin hijos tienen el tamaño de su valor; los rectángulos padre tienen el tamaño de la suma de sus hijos.
- ¿Se procesan mis datos de forma segura?
- Sí. Todos los cálculos de diseño del mapa de árbol ocurren en el lado del cliente en tu navegador. Tus datos jerárquicos nunca se envían a ningún servidor, por lo que puedes usar esta herramienta de forma segura con datos confidenciales de presupuesto, portafolio o negocio.
- ¿Cuál es la diferencia entre un treemap y un gráfico sunburst?
- Ambos gráficos visualizan datos jerárquicos por área proporcional, pero usan diseños diferentes. Un Treemap usa rectángulos anidados — cada padre se subdivide en rectángulos más pequeños que representan a sus hijos, lo que lo hace eficiente para mostrar muchos nodos hoja en un espacio compacto. Un Gráfico Sunburst usa anillos concéntricos centrados en la raíz, lo que hace que los niveles jerárquicos sean visualmente explícitos y fáciles de rastrear. Los treemaps son mejores para jerarquías planas grandes; los sunburst son mejores para mostrar profundidad y explorar a través de pocos niveles.
Datos del gráfico en PNG — Reanudar edición
¿Qué son los datos de gráfico incrustados?
Los PNG y enlaces compartidos pueden incluir datos y ajustes originales. Cualquiera con el archivo o enlace completo puede recuperarlos.
Cómo usarlo
- Exporte su gráfico a PNG
- Guarde el archivo PNG
- Coloque o pegue el PNG en la herramienta "Reanudar Gráfico desde PNG" en cualquier momento que necesite editarlo nuevamente
- Su gráfico se restaura exactamente como lo dejó — realice cambios y exporte de nuevo
Por qué es mejor que imágenes estáticas
Otras herramientas de gráficos exportan imágenes PNG que son finales — una vez exportadas, no puede editarlas sin rehacer el trabajo desde cero.
- No necesita guardar la hoja de cálculo de origen por separado — el PNG ES su copia de seguridad
- Comparta un PNG con un colega y pueden restaurarlo y editarlo sin los datos originales
- Años después, si necesita actualizar un gráfico, abra el PNG y reanude — sin buscar archivos antiguos
- Para archivo: guarde PNGs junto a sus informes y presentaciones; son completamente autónomos
¿Es seguro?
Los PNG y enlaces compartidos pueden incluir datos y ajustes originales. Cualquiera con el archivo o enlace completo puede recuperarlos.
URL de Inserción — Gráficos interactivos para presentaciones
¿Qué es una URL de Inserción?
Una URL de Inserción abre una versión limpia e interactiva de su gráfico en un navegador, mostrando solo el gráfico sin la interfaz de la herramienta, paneles de configuración o botones de exportación. Los subtítulos y las interacciones al pasar el cursor funcionan completamente. Los datos del gráfico están cifrados en la URL, al igual que en el Enlace de Recuperación.
Dónde encontrarlo
- Haga clic en el botón "🔗 Embed URL" en la página de la herramienta de gráficos; copiará instantáneamente la URL en su portapapeles
- La URL de Inserción también se guarda debajo de los límites de la diapositiva en su archivo PPTX exportado, marcada como "Embed URL — interactive view"
Uso de URLs de Inserción en otras herramientas
Las URLs de Inserción funcionan en cualquier lugar que admita iframes o inserciones de URL:
- Notion — Pegue la URL como un bloque de inserción (escriba /embed en Notion)
- Confluence — Utilice la macro HTML o la macro iframe con la URL de Inserción
- SharePoint — Inserte a través del elemento web "Insertar"
Cualquier sitio web o página de intranet — Utilice un iframe HTML estándar:
<iframe
src="YOUR_EMBED_URL"
width="800"
height="500"
frameborder="0"
allowfullscreen>
</iframe>Nota para despliegues privados: Si su organización utiliza una versión de Lokaltools alojada privadamente en su intranet, la URL de Inserción apuntará a su dominio interno. Estos solo funcionarán para los espectadores dentro de la red corporativa o VPN, tal como lo requiere su equipo de seguridad de IT.
Colores del Gráfico — Genere paletas de marca en segundos
La mayoría de las herramientas de gráficos le dan una paleta fija que no puede cambiar, o requieren que elija manualmente cada color uno por uno. Lokaltools utiliza un sistema de color de tres pasos que comienza con el color de su marca y construye automáticamente una paleta completa y armoniosa.
Paso 1 — Ancla de Marca
Ingrese el código hexadecimal del color principal de su marca (por ejemplo, #0066CC) en el campo "Brand Anchor". Este suele ser su color de logo principal, el color de su botón principal o el color dominante de sus guías de marca. El color Ancla de Marca se utiliza como punto de partida para toda la generación de la paleta. Cada color del gráfico se remonta a esta única entrada, asegurando que sus gráficos siempre tengan un estilo de marca sin selección manual de colores.
Paso 2 — Armonía de Color
El menú desplegable "Harmony" selecciona la regla de teoría del color utilizada para generar los colores restantes del gráfico a partir de su Ancla de Marca. Cada armonía crea una relación de color diferente.
| Armonía | Qué crea | Cuándo usar |
|---|---|---|
| Analógico | Colores uno al lado del otro en la rueda — sutiles y discretos | Datos de un solo tema donde los colores deben sentirse similares |
| Complementario | Dos colores directamente opuestos en la rueda — alto contraste | Comparación de dos series, positivo vs. negativo |
| Triádico (Equilibrado) | Tres colores espaciados uniformemente — vibrante pero equilibrado | La mayoría de los gráficos de negocios con 3-6 series de datos |
| Complementario dividido | Un ancla + dos colores que flanquean su complemento | Buen contraste pero menos agresivo que el complementario puro |
| Tetrádico | Cuatro colores que forman un rectángulo en la rueda — rico y variado | Gráficos con más de 4 series que necesitan máxima distinción |
El ajuste "Triádico (Equilibrado)" es el predeterminado y funciona mejor para la mayoría de las presentaciones de negocios. Cambie a "Analógico" para un aspecto más sutil y conservador, o use "Complementario" cuando desee que dos series de datos contrasten fuertemente (por ejemplo, Presupuesto vs. Real).
Paso 3 — Muestras Generadas (Anulación Manual)
Debajo del selector de armonía, la herramienta muestra 5 a 6 muestras de color generadas; estos son los colores reales que aparecerán en su gráfico. Si algún color individual no se siente bien, haga clic en esa muestra para abrir el selector de color y reemplazarlo con cualquier color de su elección. Sus anulaciones manuales se conservan en el Enlace de Recuperación.
Modo de Fondo (Alternancia Claro / Oscuro): Cambie el brillo de su paleta para que coincida con el fondo de su diapositiva. Esto ajusta automáticamente los colores generados para asegurar que permanezcan legibles y claros.
Consejos para usar Colores de Marca
- Encontrar su código hexadecimal exacto: Consulte el PDF de las guías de marca de su empresa, o haga clic derecho en el logo de su empresa en su sitio web $ ightarrow$ Inspeccionar $ ightarrow$ busque el valor de color CSS.
- Cuándo usar Analógico vs. Triádico: Use Analógico cuando su gráfico tenga un mensaje dominante y desee que los colores se sientan unificados. Use Triádico cuando cada serie represente cosas realmente distintas (por ejemplo, Ingresos, Costo, Ganancia).
- Hacer coincidir los colores exportados con su plantilla de PowerPoint: La exportación "PPTX Exacto" conserva los colores perfectos a nivel de píxel; lo que ve en el navegador es exactamente lo que aparece en su diapositiva de PowerPoint.
Preguntas frecuentes
- ¿Funciona esta herramienta sin conexión?
- Sí — una vez que la página se carga, la herramienta funciona completamente sin conexión a Internet. La única excepción es la vista interactiva de la URL de Inserción, que requiere acceso a la página de la herramienta de gráficos para mostrar el contenido insertado.
- ¿Puedo usar esto para datos confidenciales o sensibles?
- Sí. Sus datos se procesan íntegramente en su navegador utilizando WebAssembly. Nunca se envían a los servidores de Lokaltools ni a terceros. Esto hace que la herramienta sea adecuada para datos financieros, datos de pacientes, documentos legales y cualquier otra información sensible.
- ¿Qué formato de datos puedo pegar?
- Simplemente copie celdas de Excel, Google Sheets o Apple Numbers y péguelas; la herramienta detecta el formato automáticamente. También se admite la carga de archivos CSV. Los datos copiados de páginas web o PDFs pueden no despegarse correctamente; límpielos primero en Excel.
- ¿Cómo encuentro el color hexadecimal de la marca de mi empresa?
- Consulte el documento de las guías de marca de su empresa, o abra el sitio web de su empresa, haga clic derecho en el logo o en un botón de marca, elija "Inspeccionar (Inspect)" y busque un valor de color CSS que comience con #.
- ¿Puedo guardar el color de mi marca para no tener que escribirlo la próxima vez?
- El color Ancla de Marca se guarda en el Enlace de Recuperación junto con todos los demás ajustes de su gráfico. Exporte su gráfico y use el Enlace de Recuperación la próxima vez para restaurar automáticamente sus colores de marca.
- ¿Son permanentes los datos de gráfico incrustados?
- Sí. Los datos incrustados se almacenan en el archivo PNG mismo — no en ningún servidor — por lo que no hay fecha de caducidad. Siempre que tenga el archivo PNG, puede restaurar y editar su gráfico.
- ¿Puedo compartir el PNG con un colega?
- Sí — cualquier persona con el archivo PNG puede restaurar y editar el gráfico usando la herramienta "Reanudar Gráfico desde PNG". Trate el PNG como un documento compartido: comparta solo con personas que deben tener acceso a los datos subyacentes.
- ¿Cuál es la diferencia entre los datos PNG incrustados y la URL de Inserción?
- Los datos PNG incrustados contienen el estado completo de su gráfico cifrado en el archivo PNG — puede colocarlo en la herramienta "Reanudar Gráfico desde PNG" para editar y volver a exportar. Una URL de Inserción abre una vista interactiva de solo lectura de su gráfico sin capacidades de edición.
Privacidad y Seguridad
Esta herramienta se ejecuta completamente en su navegador. Sus datos siguen este camino: Su Hoja de Cálculo $ ightarrow$ Su Navegador $ ightarrow$ Sus Archivos Exportados. No hay otro camino. No hay paso de carga. No hay procesamiento en el servidor. No hay análisis del contenido de sus datos.
Los PNG de gráficos pueden incluir los datos originales y la configuración como metadatos recuperables. Los enlaces de recuperación e inserción contienen los datos y la clave para abrirlos en el fragmento de la URL. Cualquiera con el archivo o el enlace completo puede recuperarlos. Comparte solo con los destinatarios previstos. Normalmente el fragmento no se envía en solicitudes HTTP, pero JavaScript y los servicios con los que compartes el enlace pueden leerlo.
Para las organizaciones que requieren confirmación formal: Lokaltools no puede leer sus datos, no almacena sus datos y no tiene mecanismos técnicos para acceder a sus datos, incluso bajo mandato legal. Esto no es una política, es un hecho arquitectónico.
Detalles Técnicos
Desarrollado por Apache ECharts para el renderizado de lienzo de alto rendimiento, PapaParse para el análisis inteligente de datos delimitados por comas y tabulaciones, y PptxGenJS para generar objetos de gráficos nativos OOXML. El cifrado del Enlace de Recuperación utiliza la API Web Crypto integrada en el navegador (AES-256-GCM) con compresión pako; no se requieren bibliotecas de cifrado externas. Todo el procesamiento se realiza al 100% en el lado del cliente. Ningún dato se transmite en ningún momento.
Procesamiento local
Nuestras herramientas locales de archivos, texto y gráficos procesan el contenido en tu dispositivo mediante JavaScript, APIs del navegador y, cuando hace falta, WebAssembly. Nuestros eventos no incluyen nombres o contenido de archivos, texto introducido, valores de gráficos, errores sin filtrar, correos ni referencias de licencia. Las herramientas de red (DNS, WHOIS, IP y pruebas de velocidad) contactan servicios externos para su función. Cargar el sitio, fuentes, bibliotecas y modelos también genera solicitudes de red. WebAssembly no impide por sí mismo el acceso a la red.