Ir al contenido principal
Todas las coleccionesGuías de usuario
Plugins: Breakdown bar chart
Plugins: Breakdown bar chart

Organiza datos mensuales en barras utilizando la llave de "context".

David Sepúlveda avatar
Escrito por David Sepúlveda
Actualizado hace más de 5 meses

En el mundo actual impulsado por los datos, la capacidad de monitorear y analizar series temporales es fundamental para empresas y organizaciones en diversos ámbitos. A medida que el volumen de datos sigue creciendo, contar con herramientas efectivas para visualizar y comprender estos datos se vuelve cada vez más importante.

Este gráfico de barras ofrece una forma simple, pero poderosa, de organizar datos y obtener información rápidamente, proporcionando una representación clara e intuitiva de conjuntos de datos complejos.

Requisitos

  • Licencia paga de Ubidots aquí.

1. Entendiendo el widget

Este Widget Plugin es capaz de organizar series temporales basados en el contexto, resultando en un gráfico de barras que siempre se categoriza por mes dentro del rango de tiempo seleccionado en el tablero.
Pueden operar en 2 modos:

  1. Solo categorización por mes: Renderiza una barra por mes y usa una llave de context para organizar los datos.

  2. Categorización por mes y por llave de context: Puede renderizar múltiples barras por mes basado en una segunda llave de context numérica. Cada una de las barras se organizará por una llave de context.

1.1. Arquitectura de datos

Para lograr cualquiera de los resultados anteriores, los dots en la variable fuente deben cumplir con una arquitectura de datos para que el widget pueda leerlos y analizarlos correctamente.

  • Modo 1: Solo categorización por mes

Los dots disponibles en la variable fuente deben seguir el siguiente formato:

{
"value": 12,
"timestamp": 1713200780000,
"context": { "breakdownKey": "breakdownValue"
}
}

El widget usará el "timestamp" para extraer el mes (categoría del Eje X) y colocar el dot en la barra respectiva, y la "breakdownKey" dentro del "context" para asignar el valor a su segmento de barra (desglose).

  • Modo 2: Solo categorización por mes y por llave de context

Los dots disponibles en la variable fuente deben seguir el siguiente formato:

{
"value": 12,
"timestamp": 1713200780000,
"context": { "breakdownKey": "breakdownValue",
"categorizationKey": "numericalCategorizationValue"
}
}

El widget usará el "timestamp" para extraer el mes (categoría del Eje X) y la "categorizationKey" dentro del contexto para agregar una segunda categorización dentro del mes, lo que producirá una o más barras por mes.

La "breakdownKey" dentro del "context" asigna el valor a su segmento de barra (desglose).

NOTA: El valor en "categorizationKey" debe ser un número.

  • Modo 3 [OPCIONAL]: Llave de index diferente

Los dots pueden contener una llave de index dentro del contexto que se puede usar como fuente de tiempo para la categorización mensual del Eje X:

{
"value": 12,
"timestamp": 1713200780000,
"context": {
"breakdownKey": "breakdownValue",
"categorizationKey": "numericalCategorizationValue",
"indexKey": 1713452176000
}
}

En lugar de usar "timestamp" para extraer el mes al que pertenecen los dots, se puede usar una "indexKey" separada para ese propósito. El valor en esta llave debe ser un timestamp en milisegundos.

2. Configuración del widget

Hay un par de consideraciones al configurar el widget:

  • Solo puede extraer datos de una única variable. Cada dot debe estar formateado como se explica en la sección de Arquitectura de datos.

  • Algunas entradas son opcionales:

    • Llave de categoría

    • Prefijo de columna

    • Llave de index

2.2. Configurar el widget

Siga los siguientes pasos para configurar el widget:

  1. Seleccione "Bars breakdown" desde el menú de creación de widgets, en la sección Plugin:

  2. Seleccione una variable usando el botón "AÑADIR VARIABLE":

  3. Configure estos parámetros:​

    1. Llave de breakdown: Llave en el contexto utilizada para desglosar los datos

    2. Llave de categoría [OPCIONAL]: Llave en el contexto utilizada para categorizar los datos. Déjelo vacío para el modo 1 de operación.

    3. Prefijo de columna [OPCIONAL]: Se usa para etiquetar las barras, prefija el valor de la categoría.

    4. Llave de index [OPCIONAL]: Llave en el contexto utilizada como índice. Debe ser un timestamp en 'ms'. Déjelo vacío para usar el timestamp como índice.​

¿Ha quedado contestada tu pregunta?