Proyecto 3: Manipulación de los datos

Lo que vas a aprender en este TP

• Recuperar los datos en formato JSON
• Comprender la noción de parámetros por defecto
• Sobrescribir los parámetros por defecto
• Configurar una alineación según un criterio preciso
• Mostrar una imagen en lugar de su URL
• Mostrar un gauge en lugar de su valor
• Aplicar un 'Threshold'
• Aplicar un 'Value mapping'
• Añadir un enlace dinámico
• Modificar el nombre de las columnas
• Modificar el orden de las columnas
• Ocultar una columna
• Modificar el nombre de las columnas

Introducción #

Este proyecto tiene como objetivo enseñarle a manipular la visualización en forma de tabla y a aplicarle diferentes transformaciones: alineación, orden, imagen...

INFORMACIÓN: la visualización de tipo tabla funciona por defecto como las hojas de cálculo, por ejemplo siempre alineará los números a la derecha y los textos a la izquierda.

Para ello, trabajaremos con estos datos (Ver los datos) y mostrarlos así en Grafana (Ver el resultado esperado)

Consultas #

Lo que vas a aprender en esta sección

• Recuperar los datos en formato JSON

1. Recuperar los datos

   Debe usar la fuente de datos Infinity para recuperar los datos del repositorio en la dirección: https://github.com/RousselTM/grafana-formation/blob/main/tp/data/projet3.json.

   INFORMACIÓN: para poder usarlo en formato JSON, debe transformarse a RAW.

Visualizaciones #

Lo que vas a aprender en esta sección

• Comprender la noción de parámetros por defecto
• Sobrescribir los parámetros por defecto
• Configurar una alineación según un criterio preciso
• Mostrar una imagen en lugar de su URL
• Mostrar un gauge en lugar de su valor
• Aplicar un 'Threshold'
• Aplicar un 'Value mapping'
• Añadir un enlace dinámico
• Modificar el nombre de las columnas

1. Tipo de visualización

   Debe elegir una visualización que corresponda a una representación en forma de tabla

2. Título y descripción

   Debe definir, para la visualización, como título 'Mi primera tabla' y como descripción 'Descripción de mi primera tabla'

3. La alineación

   Debe modificar la alineación por defecto para que coincida con la imagen del resultado esperado. El contenido de todas las celdas está centrado excepto el campo 'category', que está alineado a la derecha.

4. El renombrado

   Debe usar la parte 'Visualization' para renombrar la columna 'category' a 'Categoría'.

   INFORMACIÓN: más abajo veremos que se puede hacer lo mismo con otro método: las transformaciones.

5. Los enlaces

   Grafana le permite crear interactividad en su tabla con enlaces. Debe añadir un enlace para que al hacer clic en una fila redirija a la página del curso. El enlace debe tener la forma https://elearning.rousseltm.fr/training_chapter?id=ID, sabiendo que 'ID' debe coincidir con el contenido del campo 'id'.

6. El 'Mapping'

   Grafana le permite transformar el contenido de su visualización. Debe crear un mapping para pedirle a Grafana que transforme el texto 'true' en 'Sí' y 'false' en 'No'. También debe indicar que los valores 'Sí' tienen el color 'violeta' y 'No' el color transparente. También combinaremos esto con un 'override' para pedirle a Grafana que muestre toda la fila según el color de la columna 'certification'.

7. El 'Threshold'

   Grafana le permite colorear números según su valor. Debe añadir 'Thresholds' para que coloree los números de esta forma: rojo: por defecto, naranja: > 50000, amarillo: > 700000, verde: > 800000.

8. Modo de coloración

   Grafana le permite colorear (texto o fondo) una celda o una fila según un valor. Debe pedirle a Grafana que coloree la fila según el contenido de 'certification' y que lo aplique a toda la fila. Recuerde que en el paso anterior ya definimos dos colores, así que no hace falta precisarlos de nuevo.

9. Modo gauge

   Grafana le permite mostrar un número en forma de gauge para comparar valores visualmente. Debe mostrar el número de vistas (columna vistas) en modo gauge

Transformations #

Lo que vas a aprender en esta sección

• Modificar el orden de las columnas
• Ocultar una columna
• Modificar el nombre de las columnas

1. El método HTTP

   Según la llamada que desee hacer, la documentación de la API le indicará el método a usar.

   INFORMACIÓN: por defecto Infinity envía sus peticiones con el método 'GET'. ¿Debe encontrar la opción para modificarlo?

2. La autenticación

3. La cabecera accept

   Grafana se basa en 'curl' para consultar sus URLs con el plugin infinity. Según el formato que desee obtener, debe solicitarlo a la API mediante una cabecera.

   INFORMACIÓN: le invitamos a informarse sobre los distintos valores, pero en nuestro caso la clave (key) es 'accept' y como valor (value):

   • JSON: application/json
   • CSV: text/csv

   ¿Cómo se configura este parámetro en Grafana para el plugin Infinity?

Nivel de dificultad : ●●●○○ (3/5)