¿Cómo crear un dashboard paso a paso?

¿Cómo crear un dashboard paso a paso?

ES | EN

Acceder a una instancia de Plataforma

Primero accede al Control Panel de mi instancia, por ejemplo el Entorno CloudLab: https://lab.onesaitplatform.com/controlpanel/login

Si no tienes usuario con rol Developer, debes crear uno:

Ir a Opción Dashboards


Ve a VISUALIZATION -> a My Dashboards.


Te aparecerá un listado de los dashboards disponibles y una serie de información asociada que explicaremos a continuación.


En la columna Options, puedes ver diferentes opciones. Estas opciones varían en función del rol del usuario y los permisos sobre los distintos dashboards :

  • Permite acceder al dashboard para trabajar con él, en modo presentación.

  • Acceder al dashboard en modo edición.

  • Configuración del dashboard, cambiar imagen, permisos.

  • Permite clonar el dashboard.

  • Da la URL para acceder al dashboard en modo presentación.

  • Exporta una imagen del dashboard.

  • Exporta un pdf del dashboard.

  • Si se pulsa y confirma, se elimina el dashboard.

Crear un nuevo Dashboard

Haz clic en el botón Nuevo Dashboard para acceder al formulario de creación.

Asigna al dashboard un identificador único (1) y una breve descripción (2) para poder diferenciarlo del resto de dashboards que se creen. Existe la opción de hacer el dashboard publico marcando (3) o podemos dejarlo como privado y asignar permisos más específicos. Se puede seleccionar un estilo inicial (4), dejar la imagen por defecto que se mostrará para los usuarios con rol DataViewer, o seleccionar una para que sea más claro diferenciar tu dashboard del resto (5), a su vez se le puede asignar una Categoría (6) y una subcategoría (7).

Se pueden crear Scripts, añadir librerias o estilos al dashboard en el editor html (8). Adicionalemente se pueden asignar permisos a otros usuarios (9), para lo cual debes elegir el usuario y el tipo de acceso, y pulsar en insert authorization. Se pasará el permiso al listado de la derecha, donde podrás modificarlo o eliminarlo.

Los tipos de permisos disponibles son :

  • EDIT permite edición y vista.

  • VIEW solo permite al usuario la visualización.

Pulsa en NEW para terminar la creación de tu dashboard.

Edición del Dashboard

Tras la creación del dashboard, accede a la pantalla de edición con el botón Editar. Allí podrás diseñar tu dashboard, dándole los estilos que se adecuen a tus necesidades, y creando o añadiendo los gadgets que te mostrarán la información que se haga falta.

Botones de la cabecera del dashboard:

  1. Move Toolbar Buttons.

  2. Add Element: este botón nos permite añadir gadgets al dashboard.

  3. DataLink: nos da la opción para configurar los filtros y Drill-down entre gadgets.

  4. URL Parameters.

  5. Nos abre un desplegable con las opciones Pages, Configure Dashboard y Dashboard Style.

  6. Save Dashboard.

  7. Delete Dashboard.

  8. Close Dashboard Editor.

Para comenzar añadiendo gadgets, pulsa en el icono (2) y aparecerán unos charts con los distintos tipos de gadgets que puedes pasar al dashboard.

Actualmente tenemos los siguientes tipos:

  • Line Chart, gráfico de líneas.

  • Bar Chart, gráfico de barras.

  • Mixed Chart, gráfico mixto.

  • Pie Chart, gráfico de tarta.

  • Wordcloud, nube de palabras.

  • Map, mapa, para usarlo es preciso que la ontología contenga coordenadas.

  • Radar, gráfico tipo radar, también se conoce como gráfico de web, gráfico de araña , tabla de estrellas.

  • Template, nos permite crear gadgets escribiendo directamente el código html.

  • Filter, permite limpiar los filtros.

  • HTML5, permite crear un gadgets editando en html5.

  • Table, tabla con datos.

Arrastra los iconos del fondo al dashboard, suéltalos allí, y aparecerá una ventana modal con las siguientes opciones


ADD GADGET: Si seleccionas un gadget creado previamente y pulsas este botón, ese gadget se cargará en el dashboard.

NEW GADGET: Aún no existe el gadget que necesitas, así que lo crearás ahora. Pulsa el botón y aparecerá esta venta modal.

Asígnale un nombre y selecciona un DataSource existente, o trabaja a partir de la ontología cuya información quieras mostrar. En este caso, selecciona la Ontología Restaurants.


Tras elegir la ontología, parece un wizard para ayudarte a montar la consulta con la que traerás los datos. Para el ejemplo con un simple select * from Restaurants será suficiente.

Si pulsas en Execute Query, aparecen los resultados de la query, y puedes validar que es lo que necesitas. Cuando se adecue a tus requisitos, pulsa Continue.

En este caso vas a crear un gadget tipo Line Chart, por lo que tendrás que rellenar y elegir al menos los siguientes valores: X Axis e Y Axis que son los valores de los distintos ejes del gráfico (para este ejemplo se ha elegido como eje X el tipo de cocina y como eje Y la valoración); y un Color para la línea. Después pulsa en NEW. Puedes crear más de una línea añadiendo más measures o más de un eje con ADD AXIS y rellenando los valores para otro eje.

Puedes ver en tiempo real cómo se va representando tu grafo con los valores marcados. Cuando esté como desees, pulsa NEW y el gadget se pasará a la página del dashboard. Éste sería tu primer gadget. Ahora crearás dos más para ver las funciones de Drill-down y filtros.

Crearemos un gadget tipo Pie o tarta. Para éste, tras elegir la fuente de datos, tan solo tienes que elegir los valores para los ejes X e Y.


Por último, crearás un gadget Tipo Tabla para ver al detalle la información de cada restaurante. Para, esto igual que en los dos casos anteriores, selecciona una fuente de datos y rellena los campos que necesites.

Puedes ver una sección Table config, con la configuración de la tabla; Mostrar u ocultar el header; filas seleccionables; número de elementos por página… En este ejemplo, yo solo he hecho seleccionables las filas y cambiado los colores del header y del footer a blanco. Luego he añadido las medidas y los nombres que se verán en la cabecera, y les he dado un orden.