Publicación
Dashboard
Tableros que cruzan información geoespacial y estadística en indicadores y gráficos.
Introducción
El módulo Dashboard permite construir paneles personalizados que integran información geoespacial con información estadística. Su objetivo es monitorear, analizar y presentar de forma visual indicadores, métricas y datos relevantes para el seguimiento del estado de una temática, necesidad o problemática particular.
Desde este módulo es posible crear, editar, duplicar y eliminar un Dashboard. Se encuentra disponible en el menú principal Publicación.
A continuación se presentan las principales funcionalidades de este módulo.
1. Interfaz del módulo.
El gestor de cuadros de mando cuenta con una serie de elementos que se describen a continuación.
(se abre a tamaño completo en una ventana nueva)
Imagen 1: Vista general del módulo Dashboard
- A través del botón Dashboard, presente en el menú lateral, se accede al módulo que permite la gestión de los cuadros de mando creados en Geonodo.
- El botón Crear permite generar nuevos cuadros de mando.
- Lista de cuadros de mando con las opciones de abrir, editar, duplicar y eliminar.
2. Funcionalidades
A continuación, veremos el detalle de cada una de las funcionalidades de este módulo.
2.1 Nuevo Dashboard
A continuación se presenta la interfaz de un nuevo Dashboard.
Inicialmente se muestra un lienzo sin contenido. Sobre él se deben agregar los elementos que permitirán visualizar los datos, así como definir su posición y tamaño.
(se abre a tamaño completo en una ventana nueva)
Imagen 2: Opciones de configuración
2.1.1 Configuraciones iniciales
Se recomienda, como primer paso, definir un nombre para el Dashboard. Este puede modificarse haciendo clic en el ícono de lápiz ubicado junto al texto Nuevo Dashboard. En este ejemplo el Dashboard se llamará Seguimiento estado de grifos. Al hacer clic en el ícono con forma de check se guarda el cambio del título.
(se abre a tamaño completo en una ventana nueva)
Imagen 3: Edición del nombre del Dashboard mediante el ícono de lápiz.
Esquema de Colores
Por medio de esta opción de configuración podrá seleccionar un esquema de colores predeterminado que luego podrá personalizar a través de la opciones de configuración de cada uno de los Elementos incluidos en su Dashboard.
(se abre a tamaño completo en una ventana nueva)
Imagen 4: Selección de un esquema de colores predeterminado para el Dashboard.
Layout Responsivo
Conjunto de opciones que habilitan distintas formas de presentación del Dashboard, donde los widgets se reposicionan automáticamente en función del ancho de la pantalla del dispositivo utilizado.
(se abre a tamaño completo en una ventana nueva)
Imagen 5: Opciones de layout responsivo para adaptar la presentación a distintos tamaños de pantalla.
Acceso
Permite definir si el acceso al cuadro de mando será público o privado. En el caso de ser privado, la apertura del Dashboard requerirá que el usuario haya iniciado sesión en Geonodo.
(se abre a tamaño completo en una ventana nueva)
Imagen 6: Configuración del tipo de acceso, público o privado, del Dashboard.
Publicar
El botón Publicar permite pasar el Dashboard de un estado de borrador a un estado público. Al publicarlo se genera una URL de acceso que estará disponible a través del botón Ver, presente en la lista de cuadros de mando ya creados.
(se abre a tamaño completo en una ventana nueva)
Imagen 7: Botón Publicar, que cambia el estado del Dashboard de borrador a público y genera su URL de acceso.
2.1.2 Elementos
Los elementos corresponden a widgets que pueden agregarse al lienzo. Cada elemento insertado se apila en el costado izquierdo del lienzo, desde donde luego puede moverse y redimensionarse.
Para ajustar la posición de un elemento, haga clic sostenido sobre él y arrástrelo hasta la ubicación deseada.
Para modificar el tamaño de un elemento, ingrese a su configuración, guarde los cambios y luego arrastre el elemento desde su esquina inferior derecha.
Encabezado
Este elemento se agrega habitualmente en la parte superior del Dashboard. Permite incluir un título, un subtítulo, un logo y filtros que pueden afectar o recalcular los valores de los elementos de tipo lista, gráfico, indicador, acelerómetro y visor.
Apariencia
Como se observa en la imagen, es posible configurar los textos, sus tamaños, los colores de texto y de fondo, activar o desactivar el borde, así como agregar un logotipo a partir de una URL o seleccionar un ícono.
(se abre a tamaño completo en una ventana nueva)
Imagen 8: Pestaña Apariencia del configurador de Encabezado, con las opciones de texto, logotipo y color.
Filtros
Para agregar uno o más filtros, haga clic en el ícono con el signo más.
(se abre a tamaño completo en una ventana nueva)
Imagen 9: Pestaña Filtros del configurador de Encabezado, con el botón para agregar un nuevo filtro.
A continuación debe establecer las relaciones entre el campo de una capa o tabla y uno o más elementos previamente agregados al Dashboard (gráfico, visor, indicador, etc.). Para ello:
- Indique un nombre para el filtro.
- Seleccione la capa o tabla que se asociará a este filtro.
- Seleccione el campo que se relacionará con los elementos del Dashboard.
- Seleccione la etiqueta, es decir, el campo que se mostrará en la lista desplegable del filtro.
- Agregue una o más relaciones haciendo clic en el ícono con el signo más, junto a la etiqueta Relaciones.
- Seleccione el nombre del elemento que se relacionará con el filtro.
- Seleccione el campo de ese elemento que permitirá establecer la relación con el campo del filtro.
Importante: la relación debe establecerse entre campos del mismo tipo de datos y cuyos valores coincidan.
La siguiente imagen presenta la herramienta de filtro.
(se abre a tamaño completo en una ventana nueva)
Imagen 10: Herramienta de configuración de filtros, con las relaciones entre el campo del filtro y los elementos del Dashboard.
Adicionalmente, es posible establecer acciones entre los filtros a través de un atributo en común. Un ejemplo habitual es agregar filtros de regiones y comunas: al seleccionar una región, el filtro de comuna mostrará únicamente las comunas de la región seleccionada, como se observa en la siguiente imagen.
(se abre a tamaño completo en una ventana nueva)
Imagen 11
Un ejemplo de un encabezado es el siguiente:
(se abre a tamaño completo en una ventana nueva)
Imagen 11: Configuración de acciones entre filtros relacionados, como región y comuna.
Gráfico
Este elemento permite configurar un gráfico a partir de una capa o tabla. Cuenta con opciones de configuración para Datos, Colores y General.
Datos
Selección y configuración de los parámetros que permitirán presentar los datos en el gráfico.
(se abre a tamaño completo en una ventana nueva)
Imagen 13: Pestaña Datos del configurador de Gráfico, con los parámetros de tipo, capa, campo de valor y operación.
- Tipo de gráfico: permite elegir entre gráfico de barras, columnas, torta, líneas, áreas, radar o puntos.
- Capa: selección de una capa o dato presente en Geonodo.
- Usar series: al habilitar esta opción se pueden seleccionar uno o más atributos de tipo numérico para establecer el cálculo de series en el gráfico. También es posible asignar un alias para cambiar el nombre del atributo.
(se abre a tamaño completo en una ventana nueva)
Imagen 14: Opción Usar series habilitada, con la selección de atributos numéricos y la asignación de alias.
- Campo de valor: selección de un campo o atributo de la capa o dato seleccionado anteriormente.
- Operación: operación matemática que se aplicará sobre el campo seleccionado. El resultado se reflejará en el eje Y del gráfico.
- Agrupar por: selección de un campo que permitirá agrupar los resultados de la operación en el eje X del gráfico.
- Ordenar por: selección de un campo que permitirá ordenar el eje X de izquierda a derecha.
- Cantidad de resultados: permite limitar los valores presentes en el eje X utilizando el campo seleccionado en el parámetro Ordenar por.
Colores
Existen tres alternativas de configuración de colores para el gráfico.
Único: todos los elementos comparten el mismo color.
(se abre a tamaño completo en una ventana nueva)
Imagen 15: Configuración de color Único, donde todos los elementos del gráfico comparten el mismo color.
Múltiple: cada elemento puede tener un color diferente. Como se ve en la imagen, al seleccionar la opción múltiple se asignan cuatro colores a las primeras cuatro barras del gráfico; luego esta configuración de colores se repite para el resto de las barras. A través del ícono con el signo más se pueden agregar más colores.
(se abre a tamaño completo en una ventana nueva)
Imagen 16: Configuración de color Múltiple, con la asignación de colores diferenciados por elemento.
Agrupar por: a partir del campo de Agrupar por (pestaña Datos) y la elección de una rampa de color, se genera automáticamente la degradación de colores para cada uno de los elementos
(se abre a tamaño completo en una ventana nueva)
Imagen 17: Configuración de color Agrupar por, con generación automática de una rampa de color.
General
La configuración General permite asignar un nombre al elemento; es un campo obligatorio y se utiliza para identificarlo cuando se configura un filtro en el elemento Encabezado. Además, permite agregar textos que aparecerán en el gráfico, como un título, una descripción y un texto que se mostrará cuando el gráfico no tenga datos disponibles.
(se abre a tamaño completo en una ventana nueva)
Imagen 18: Pestaña General del configurador de Gráfico, con el nombre del elemento y los textos asociados.
Un ejemplo de gráfico es el siguiente:
(se abre a tamaño completo en una ventana nueva)
Imagen 19: Ejemplo de un gráfico de columnas publicado en el Dashboard.
Lista
Permite generar un texto personalizado que combina texto fijo con valores provenientes de campos de una capa o tabla. Por cada registro se generará una fila en la lista.
Datos
Selección y configuración de los parámetros que permitirán presentar los datos en una lista.
(se abre a tamaño completo en una ventana nueva)
Imagen 20: Pestaña Datos del configurador de Lista, con los parámetros de capa, orden y texto del elemento.
- Capa: selección de una capa o dato presente en Geonodo.
- Ordenar por: selección de un campo que permitirá ordenar las filas de la lista de forma ascendente o descendente.
- Cantidad de resultados: permite limitar el número de filas presentes en la lista.
- Texto del elemento: permite escribir un texto fijo junto a texto variable, correspondiente a los campos que se pueden seleccionar de la lista “Campos de valores”. Además, admite etiquetas HTML para dar formato al texto de la fila.
- Filtros: permite seleccionar un campo, un operador lógico y un valor para filtrar los datos que aparecen en la lista.
General
La configuración General permite asignar un nombre al elemento; es un campo obligatorio y se utiliza para identificarlo cuando se configura un filtro en el elemento Encabezado. Además, permite agregar textos que aparecerán en la lista, como un título, una descripción y un texto que se mostrará cuando la lista no tenga datos disponibles.
(se abre a tamaño completo en una ventana nueva)
(se abre a tamaño completo en una ventana nueva)
Imagen 21: Pestaña General del configurador de Lista, con el nombre del elemento y los textos asociados.
Acciones
La habilitación de la acción permite que, al hacer clic sobre un elemento de la lista, se realice un acercamiento (zoom) en el mapa hacia el elemento correspondiente. Es posible seleccionar un visor presente en el Dashboard y elegir un color para resaltar el elemento de lista seleccionado.
Adicionalmente, se puede habilitar la opción resaltar en el mapa, que permite cambiar el color y el tamaño de un punto.
(se abre a tamaño completo en una ventana nueva)
Imagen 22: Pestaña Acciones del configurador de Lista, con las opciones de zoom y resaltado en el mapa.
Un ejemplo de lista es el siguiente:
(se abre a tamaño completo en una ventana nueva)
Imagen 23: Ejemplo de una lista publicada en el Dashboard.
Acelerómetro
Permite medir el porcentaje de avance de un indicador, definiendo un valor mínimo y un valor máximo.
Datos
Selección y configuración de los parámetros que permitirán presentar los datos en el acelerómetro.
(se abre a tamaño completo en una ventana nueva)
Imagen 24
- Capa: selección de una capa o dato presente en Geonodo.
- Campo de valor: selección de un campo o atributo de la capa o dato seleccionado anteriormente.
- Operación: permite aplicar una operación matemática sobre el campo seleccionado o seleccionar un valor de la entidad. El resultado se reflejará como un porcentaje, considerando los valores mínimo y máximo definidos.
- Ordenar por: selección de un campo que permitirá ordenar los resultados.
- Cantidad de resultados: permite limitar el número de resultados.
- Valor mínimo y máximo: permite definir los valores mínimo y máximo para calcular el porcentaje del campo o atributo seleccionado.
- Tipo de valor: cuenta con dos alternativas: Valor fijo, para indicar un número, y Estadística, para realizar una operación matemática sobre los valores de un atributo.
Un ejemplo del acelerómetro es el siguiente:
(se abre a tamaño completo en una ventana nueva)
Imagen 25
Acelerómetro
Permite seleccionar el tipo o forma del acelerómetro y el color de la barra.
(se abre a tamaño completo en una ventana nueva)
Imagen 26
Las formas del acelerómetro son radial o circular.
(se abre a tamaño completo en una ventana nueva)
Imagen 27: Forma radial del acelerómetro.
(se abre a tamaño completo en una ventana nueva)
Imagen 28: Forma circular del acelerómetro.
General
La configuración General permite asignar un nombre al elemento; es un campo obligatorio y se utiliza para identificarlo cuando se configura un filtro en el elemento Encabezado. Además, permite agregar textos que aparecerán en el acelerómetro, como un título, una descripción y un texto que se mostrará cuando no haya datos disponibles.
(se abre a tamaño completo en una ventana nueva)
Imagen 29: Pestaña General del configurador de Acelerómetro, con el nombre del elemento y los textos asociados.
Tarjeta
Elemento que permite mostrar datos numéricos y texto provenientes de una capa o dato. Cuenta con tres filas, denominadas superior, central e inferior, que permiten mostrar texto fijo y variable a partir de campos.
Datos
Selección y configuración de los parámetros que permitirán presentar los datos en una tarjeta.
(se abre a tamaño completo en una ventana nueva)
Imagen 30: Pestaña Datos del configurador de Tarjeta, con los parámetros de capa, operación y formato de los resultados.
- Capa: selección de una capa o dato presente en Geonodo.
- Campo de valor: selección de un campo o atributo de la capa o dato seleccionado anteriormente.
- Operación: operación matemática que se aplicará sobre el campo seleccionado. El resultado se reflejará al centro de la tarjeta.
- Agrupar por: selección de un campo que permitirá agrupar los resultados.
- Ordenar por: selección de un campo que permitirá ordenar los resultados de forma ascendente o descendente.
- Cantidad de resultados: permite limitar el número de resultados. Puede avanzar entre ellos utilizando las flechas presentes en la parte superior de la tarjeta.
- Cantidad de decimales: permite indicar cuántos decimales se mostrarán después de la coma.
- Separador de miles: muestra u oculta el punto separador de miles.
- Filtros: permite seleccionar un campo, un operador lógico y un valor para filtrar los datos que aparecen en la tarjeta.
Tarjeta
En esta sección se configura la apariencia de la tarjeta en sus niveles superior, central e inferior. Es posible agregar textos fijos, seleccionar campos de valores de una capa o tabla, y definir el tamaño y el color del texto.
(se abre a tamaño completo en una ventana nueva)
Imagen 31: Pestaña Tarjeta del configurador, con la apariencia de los niveles superior, central e inferior.
General
La configuración General permite asignar un nombre al elemento; es un campo obligatorio y se utiliza para identificarlo cuando se configura un filtro en el elemento Encabezado. Además, permite agregar textos que aparecerán en la tarjeta, como un título, una descripción y un texto que se mostrará cuando no haya datos disponibles.
(se abre a tamaño completo en una ventana nueva)
Imagen 32: Pestaña General del configurador de Tarjeta, con el nombre del elemento y los textos asociados.
Un ejemplo de tarjeta es el siguiente:
(se abre a tamaño completo en una ventana nueva)
Imagen 33
Texto
Este elemento permite agregar texto fijo y cuenta con herramientas para configurar su formato.
(se abre a tamaño completo en una ventana nueva)
Imagen 34: Configurador del elemento Texto, con las herramientas de formato disponibles.
Un ejemplo de un elemento de tipo texto es el siguiente:
(se abre a tamaño completo en una ventana nueva)
Imagen 35: Ejemplo de un elemento de tipo texto publicado en el Dashboard.
Visor
Permite agregar un mapa creado previamente en el Gestor de Visores. Es posible configurar los siguientes parámetros:
(se abre a tamaño completo en una ventana nueva)
Imagen 36: Configurador del elemento Visor, con los parámetros de título, visor y opciones de visualización.
- Nombre: campo obligatorio; se utiliza para identificar el elemento cuando se configura un filtro en el elemento Encabezado.
- Título: texto que aparecerá en la parte superior del mapa.
- Descripción: texto que aparecerá debajo del título.
- Visor: lista de visores disponibles para seleccionar y agregar a este elemento.
- Visor en pantalla completa: el elemento visor ocupará toda la pantalla del navegador, y los demás elementos o tarjetas quedarán por sobre el visor de mapas. Al habilitar esta configuración no será posible mover el mapa, hacer zoom ni hacer clic sobre los objetos del mapa para ver los valores de sus atributos.
- Opacidad de tarjetas sobre el visor: permite cambiar el porcentaje de opacidad del color de fondo de un elemento o tarjeta.
- Mostrar leyenda: activa o desactiva el botón que permite mostrar la leyenda de las capas presentes en el mapa.
- Posición de capas y leyenda: posición, sobre el mapa, de la ventana que se abre al hacer clic en el ícono de leyenda o de capas.
- Posición de íconos: posición, sobre el mapa, de los íconos de capas y leyenda.
- Color de texto: cambia el color del texto del título y la descripción.
- Color de fondo: color de fondo del elemento.
Un ejemplo de visor es el siguiente:
(se abre a tamaño completo en una ventana nueva)
Imagen 37: Ejemplo de un visor de mapa publicado en el Dashboard.
El visor cuenta con dos botones en la esquina superior izquierda.
Ver leyenda
(se abre a tamaño completo en una ventana nueva)
Imagen 38: Botón Ver leyenda del visor, que muestra la simbología de las capas del mapa.
Ver capas: permite encender o apagar las capas del mapa.
(se abre a tamaño completo en una ventana nueva)
Imagen 39: Botón Ver capas del visor, con la opción de encender o apagar cada capa.
Visor en pantalla completa
(se abre a tamaño completo en una ventana nueva)
Imagen 40: Visor configurado en modo pantalla completa, con las tarjetas sobrepuestas al mapa.
Leyenda
Permite seleccionar un mapa presente en el Dashboard y mostrar la leyenda de las capas que contiene.
(se abre a tamaño completo en una ventana nueva)
Imagen 41: Configurador del elemento Leyenda, con la selección del mapa del Dashboard.
Un ejemplo de leyenda es el siguiente:
(se abre a tamaño completo en una ventana nueva)
Imagen 42: Ejemplo de una leyenda publicada, con la simbología de las capas del mapa.
2.2 Abrir
Abre el Dashboard en el navegador. La URL de esta nueva ventana puede compartirse con otros usuarios.
2.3 Editar
Permite acceder a la vista de edición del Dashboard para realizar cambios o actualizaciones.
2.4 Duplicar
Permite duplicar un Dashboard junto con su configuración. La copia queda por defecto en estado despublicado y se identifica con la palabra Copia después del nombre.
2.5 Eliminar
Permite eliminar el Dashboard.
Advertencia: una vez eliminado el Dashboard, esta acción no se puede deshacer. Si el cuadro de mando estaba publicado, su URL de acceso dejará de estar disponible para los usuarios.