Ejemplos de Componentes Interactivos

Una de las principales ventajas de Mirla es la capacidad de integrar el archivo digital directamente en la redacción de un artículo o ensayo. A continuación, se presenta una demostración de los componentes interactivos y visualizaciones de datos que pueden ser insertados en cualquier publicación del sitio.

Para destacar un objeto particular dentro de la narrativa, se utiliza la tarjeta de vista previa. Esta permite al lector ver una miniatura y un título, y hacer clic para profundizar en los metadatos del ítem sin perder el contexto del artículo.

<mirla-preview pid="ayayaysergio_lp4u3sgcl2" title="Detalle de la esquina superior izquierda"></mirla-preview>

Galerías y Exploración

El índice de la colección es el componente principal para explorar el archivo. Muestra una cuadrícula de elementos paginada e incluye una barra de búsqueda y filtros desplegables dinámicos basados en los metadatos.

<mirla-index type="" filters="medio_impresion, ciudad"></mirla-index>

Las minigalerías son agrupaciones automáticas de elementos (galerías en línea) basadas en un criterio específico de la base de datos. En el siguiente ejemplo, el componente extrae e ilustra de manera dinámica hasta cinco elementos cuya técnica de impresión sea Offset.

<mirla-gallery key="medio_impresion" value="tec-offset" limit="5"></mirla-gallery>

Visualizaciones de Datos

Para ofrecer un panorama estadístico rápido del archivo, los gráficos de barras interactúan directamente con los metadatos. Al hacer clic en cualquiera de las barras, el sistema filtrará la colección y revelará los elementos asociados a esa categoría.

<mirla-barchart key="medio_impresion"></mirla-barchart>

El dendrograma o árbol jerárquico es ideal para entender la composición geográfica o categórica de la colección a través de múltiples niveles de anidación. Aquí se visualiza la distribución de las publicaciones primero por país, y posteriormente por ciudad de origen.

<mirla-tree keys="pais,ciudad"></mirla-tree>

La dimensión temporal es a menudo fundamental en el estudio de publicaciones independientes e impresos. La línea de tiempo distribuye horizontalmente los elementos según sus años de publicación documentados.

<mirla-timeline datekey="fecha"></mirla-timeline>

Para el análisis de redes y relaciones complejas, el gráfico interactivo basado en física ilustra las conexiones entre diferentes entidades. El siguiente diagrama mapea las relaciones entre los autores y sus países de procedencia.

<mirla-network sourcekey="autores" targetkey="pais"></mirla-network>

El deslizador de comparación es una herramienta visual excelente para contrastar dos ítems. Puede utilizarse para evaluar el estado de conservación de un documento (antes y después), comparar distintas capas de una misma obra, o simplemente examinar las diferencias visuales entre dos publicaciones distintas de la colección.

<mirla-compare pid1="atroz0000000_lp4u1qok82" pid2="ayayaysergio_lp4u3sgcl2"></mirla-compare>

Para contextualizar los archivos espacialmente, el mapa geográfico sitúa los objetos en el territorio, leyendo automáticamente las coordenadas insertadas en la base de datos maestra.

<mirla-map coordkey="latlong"></mirla-map>

El gráfico de Waffle proporciona una abstracción visual rápida en una cuadrícula proporcional de 10x10. En este caso, representa las proporciones de las diferentes técnicas o medios de impresión documentados en el archivo.

<mirla-waffle key="medio_impresion"></mirla-waffle>

Componentes Nativos y Gestión

Mirla respeta completamente el uso de HTML estándar. Las tablas tradicionales creadas manualmente a través del editor visual conviven sin conflicto con las visualizaciones dinámicas generadas por código.

Finalmente, para propósitos de gestión de datos, catalogación e investigación profunda, es posible integrar la tabla general de metadatos. Esta tabla interactiva ofrece acceso completo al archivo, permitiendo la búsqueda en tiempo real, el ordenamiento por columnas y la descarga del set de datos en formato CSV para su uso en software de terceros.

<mirla-table></mirla-table>