Bridging Business Processes with Grafana: Visual Monitoring Using Diagram and FlowCharting

Background

Over many years the team has explored monitoring platform construction, moving from Nagios and Zabbix to Prometheus, from relational and NoSQL databases to time‑series stores, and from server health to application availability, ultimately aiming to serve business needs.

Problems

The platform faces three main challenges:

Alert overload

Alert data scattered across multiple subsystems

Separation between monitoring and business processes, which prolongs incident resolution and harms SLA.

Requirements

To address these problems the team needs:

Monitoring that aligns with business workflows and links them together.

Extraction of distinct business‑monitoring scenarios from unordered data.

Visualization that combines graphs, data, and business processes for intuitive problem location.

Solution Overview

Grafana’s multi‑data‑source capability and rich plugin ecosystem are leveraged. Two concrete approaches are proposed:

Grafana + Diagram

Grafana + FlowCharting

Both integrate various monitoring back‑ends (databases, Elasticsearch, Prometheus, Zabbix) and generate workflow‑driven diagrams via regular‑expression data extraction.

Diagram

The Diagram plugin uses the mermaid.js library to create flowcharts, sequence diagrams, and Gantt charts.

Define charts with Mermaid syntax.

Metric series can color shapes or backgrounds.

Series target specific node IDs (aliases).

Regular‑expression matching applies styles to matching nodes.

“Combination” aggregates multiple series per node, allowing custom thresholds.

Example Mermaid definition:

graph LR
      LB[Load Balancer] -- route1 --> web1
      LB[Load Balancer] --> web2
      web1 --> app1(fa:fa-check app1)
      web1 ==> app2
      web2 ==> app2(fa:fa-ban app2)
      web2 --> app1
      app1 --> D[(database)]

The resulting diagram highlights a combined node (app2) that aggregates three metrics; when one metric exceeds its threshold, the diagram instantly points to the problematic sub‑metric.

Limitations observed in practice:

Complex business processes produce diagrams that cannot be zoomed or expanded sufficiently.

Mermaid syntax is simple but becomes cumbersome to maintain after frequent business changes.

Thresholds are global; per‑metric thresholds are not supported.

FlowCharting

FlowCharting relies on the online diagram library draw.io to render complex charts such as architecture diagrams, network maps, industrial processes, UML plans, and CI/CD workflows.

Supports a wide range of diagram types (legacy, cloud, Kubernetes, Terraform, etc.).

Key capabilities include:

Real‑time monitoring status and performance display.

Interactive chart elements.

Dynamic object visibility based on data or state changes.

Clickable links attached to diagram objects.

Variable‑driven customization of shapes, colors, links, and download paths.

Regular‑expression based match‑and‑replace for data injection.

Compared with Diagram, FlowCharting offers finer‑grained metric threshold configuration and better handling of intricate business workflows.

Open Issues

Ensuring completeness of source data – continuous collection of multidimensional metrics remains a long‑term foundational task.

Grafana dashboards cannot currently merge multiple data sources into a single unified view, limiting centralized visualization.

Conclusion

Adopting the described solution shifts the focus to deep understanding of business processes, requiring close collaboration among operations, development, and testing teams. Visualizing workflows alongside metrics accelerates issue localization and helps new team members quickly grasp system behavior, ultimately strengthening operational efficiency.