Lista de documentos
En esta página

Gráficos de procesos

Gráficas

ProcessMind ofrece un conjunto robusto de opciones de gráficas para visualizar y analizar data. Estas gráficas te ayudan a obtener insights rápidamente, identificar tendencias y tomar decisiones informadas. A continuación, se describen los tipos de gráficas actualmente soportados y las opciones de personalización disponibles.


Cómo elegir el tipo de gráfica adecuada

image

  • Bar Charts
    Úsalas para comparar categorías o grupos en paralelo, como recuento de actividades, duraciones o tiempos de throughput. Son las mejores para comparar data discreta.

  • Column Charts
    Ideales para visualizar tendencias en el tiempo o comparar métricas verticalmente. Funcionan bien para data histórica o distribuciones de frecuencia.

  • Line Charts
    Usa estas gráficas para mostrar tendencias, progresos o cambios a lo largo del tiempo, por ejemplo, el throughput de cases por días o semanas. Ideales para data continua.

  • Area Charts
    Similares a las line charts pero rellenando el área bajo la línea. Útiles para enfatizar la magnitud del cambio en el tiempo o el efecto acumulativo de una tendencia.

  • Pie Charts
    Ideales para mostrar proporciones o porcentajes del total, como tipos de actividades en un proceso o distribución de cases.

  • Donut Charts
    Una variante de las pie charts, con espacio central para información adicional. Perfectas para resaltar proporciones y aportar contexto en el centro.

  • Radial Bar Charts
    Ideales para presentaciones atractivas y visuales de data agrupada o categorizada en formato circular. Útiles para comparar datasets ahorrando espacio.

  • Gauge Charts
    Perfectas para visualizar el avance hacia un objetivo o KPI. Ideales para mostrar métricas de rendimiento rápidamente o comparar el número de cases sobre el total.

  • Text Charts
    Útiles para mostrar estadísticas clave, métricas o highlights en formato de texto. Ideales para resumir números o KPIs junto a gráficas visuales. Las text charts también permiten añadir contexto o explicaciones para la data presentada, ya que soportan markdown notation para enriquecer el contenido con negritas, cursivas, tablas, imágenes y más. Para más detalles, revisa nuestra documentación sobre Markdown . También puedes mezclar texto con expressions  de métricas y cálculos para generar contenido dinámico.

  • HTML Frames
    Úsalos para insertar contenido externo o dinámico en tu dashboard, como gráficas personalizadas, reportes o visualizaciones adicionales no soportadas de forma nativa.

Gráficas predefinidas

Son gráficas a nivel data que ya vienen configuradas y están disponibles en ProcessMind:

  • Cases prefixed charts
  • Events prefixed charts
  • Sustainability metrics charts

Puedes vincular estas gráficas a atributos de un único dataset o de varios, siempre que compartan un elemento común.


Opciones de personalización de gráficas

Cada gráfica en ProcessMind se puede personalizar con las siguientes opciones:

General

  • Título de la gráfica:
    Define un título personalizado para la gráfica. Si no se indica, tomará el nombre del atributo vinculado.

  • Tipo de gráfica:
    Cambia fácilmente el tipo de gráfica a cualquier otro disponible.

  • Atributo de columna: (no disponible para: Gauge Charts, Text Charts, HTML Frames).
    Selecciona el atributo que se representa en la gráfica. Los atributos tienen colores según el dataset, facilitando identificar cada elemento.

  • Texto: (solo disponible para: Text Charts).
    Aquí puedes definir texto enriquecido usando markdown notation para dar formato al contenido: encabezados, listas, negritas o cursivas, etc. Más información en nuestra documentación sobre Markdown . También puedes mezclar texto con expressions  de métricas y cálculos para contenido dinámico.

  • HTML: (solo disponible para: HTML Charts).
    Inserta contenido HTML personalizado en el contenedor de la gráfica. Esto ofrece máxima flexibilidad para mostrar información e integrar contenido externo. Se incluye una plantilla HTML para gestionar los modos DARK y LIGHT dentro del HTML frame. Puedes emplear expressions y elementos del apartado Texto como ${metric} o ${total - metric}.


Métrica

La explicación de cada métrica está disponible en nuestra documentación de Métricas:

Guía de Métricas
Explora nuestra guía completa sobre métricas y aprende a implementarlas en tus gráficas de manera efectiva.
  • Configuración de Normas:

Puedes definir rangos personalizados para tus gauge charts y señalar zonas como “bueno”, “precaución” y “alerta”. Abre el panel de Norm Settings para añadir o editar estos rangos. (Puedes agregar tantas normas como necesites)

image Pasos para configurar normas:

  • Agregar nueva norma Haz clic en el botón + Add para crear una nueva fila para una banda de norma.
  • Nombre Introduce un nombre descriptivo para la norma (ej. Bajo, Medio, Alto). Los nombres permiten identificar las bandas en el editor.

Inicio / Fin

  • Inicio: Define el límite inferior. Déjalo vacío y selecciona Minimum si debe empezar desde el valor más bajo.
  • Fin: Define el límite superior. Déjalo vacío y selecciona Maximum si la banda debe llegar hasta el máximo. Opciones

Junto a cada límite tienes un menú (Option) que define cómo se trata el límite. Por ejemplo:

  • Minimum/Maximum — asocia la banda al mínimo/máximo de toda la gráfica.
  • Normal — usa el valor que introdujiste y lo incluye en la banda.

Color Haz clic en la muestra de color para elegir el color de la banda. Usa colores contrastantes para diferentes rangos (ej. verde para bajo, naranja para medio, rojo para alto). Si los colores no se ajustan, puedes cambiarlos en la configuración de tema, sección Chart colors.

  • Relleno Activa o desactiva Fill para mostrar la banda como fondo o solo como línea. Aplica solo a bar charts y column charts.
  • Borrar Usa el icono de papelera para eliminar una banda de norma.

Cómo se ven las normas en las gráficas (ejemplo: el gauge) image

Cuando aplicas normas, el gauge, por ejemplo, se segmenta en arcos por color. El valor actual aparece con un puntero y de forma numérica en el centro. En el ejemplo, el gauge tiene tres normas:

  • Bajo: mínimo hasta 100 (verde)
  • Medio: 100–110 (naranja)
  • Alto: 110 hasta el máximo (rojo)

Con un valor de 87 sobre 120, el puntero cae en la banda verde, señalando que está en el rango “bajo”. Esto también colorea la barra indicadora según el rango en el que esté.

Configurar normas así aporta feedback visual inmediato sobre si una métrica está dentro de límites aceptables, cerca de un umbral o fuera del rango seguro.


Filtros y ordenamiento

  • Chart Filters:
    Aplica filtros a la data de la gráfica para enfocarte en subconjuntos específicos de información. image Todos los filtros disponibles en la sección de filtros del dashboard se pueden aplicar a la gráfica. Estos filtros se suman a los ya definidos, salvo que desactives “Apply Filters”. En ese caso, los filtros quedan fijos solo en esa gráfica.

  • Filter Data:
    Aplica filtros para Cases Abiertos, Cerrados o Todos.

  • Sorting By:
    Elige el orden (Auto, Ascendente, Descendente, etc.).

  • Show Top X Items:
    Limita la cantidad de elementos mostrados en la gráfica al máximo especificado.

  • Apply General Filters:
    Decide si los filtros globales aplican a esta gráfica.

  • App Time Filters:
    Indica si los filtros de tiempo se aplican o no a la gráfica.


Etiquetas
  • Mostrar Etiquetas de Data:
    Activa o desactiva la vista de etiquetas en los puntos del gráfico.
  • Mostrar Etiquetas del Eje X:
    Activa, desactiva y personaliza las etiquetas del eje X.
  • Mostrar Etiquetas del Eje Y:
    Activa, desactiva y personaliza las etiquetas del eje Y.
  • Ubicación de la Leyenda:
    Elige la posición de la leyenda (arriba, abajo, izquierda, derecha).

Estilo

  • Colores de Estilo de Relleno:
    Personaliza el look del gráfico usando diferentes estilos de relleno:
    • Gradiente: Aplica un efecto de gradiente al gráfico.
    • Sólido: Usa un color plano según el dataset.
    • Monocromo: Usa un solo color del dataset.
    • Gradiente Monocromo: Utiliza un solo color del dataset aplicando un gradiente.
Rayos X

Al utilizar estos tipos de gráficas y opciones de personalización, ProcessMind te permite crear visualizaciones adaptadas a tus necesidades de análisis y obtener insights claros y accionables.