Zabbix Graphics Hosts

Read this in other languages:

Zabbix Graphics Hosts is a modern and intuitive module for the Zabbix Web Interface that simplifies and centralizes the visualization of monitoring graphs. It provides a tree-structured resource browsing sidebar and real-time graph visualization with dynamic tag filtering.

Developed by George Filho.

🎯 Main Features

Tree-structured Resource Browsing: Easily browse through Host Groups and Hosts in an expandable/collapsible tree sidebar.
Dynamic Category Filtering: Categories are automatically generated based on the item tags of the selected host (similar to the old Zabbix Applications concept).
Ad-Hoc Graphs: Items without pre-configured graphs are dynamically grouped by their units and rendered on the fly as ad-hoc charts (up to 8 items per graph).
Time Range & Auto-Refresh: Built-in toolbar to adjust time range (from 10 minutes to 30 days), modify grid columns, and set auto-refresh intervals.
Graph Zoom Modal: Click on any graph to open a high-resolution, full-screen version in a modal view.
Native Zabbix Integration: Securely implemented using native Zabbix UI classes (CHtmlPage, CController, CDiv), fully compliant with Zabbix 7.0+ Content Security Policy (CSP).

📋 Prerequisites

Before installing and using this module, ensure that:

You are running Zabbix Frontend 7.0 LTS or higher. (This module is specifically optimized for Zabbix 7.0+ architecture and does not support Zabbix 6.0).
The web server user (e.g., www-data or apache) has read permissions for the module directory.

🚀 Installation

Installing modules in the Zabbix frontend is simple and fast.

Download or clone this repository: Download the module files to your server.
Copy to the Zabbix modules directory: Move the module folder to the modules directory of your Zabbix web interface. CRITICAL: The folder name must be exactly ZabbixGraphicsHosts to match the module namespace.

The default path is usually:
```
/usr/share/zabbix/ui/modules/ZabbixGraphicsHosts
# or
/usr/share/zabbix/modules/ZabbixGraphicsHosts
```
Register the Module in the Frontend:
- Log into the Zabbix web interface as a Super Admin.
- Navigate to Administration → Modules.
- Click the "Scan directory" button in the top right corner.
- The "Zabbix Graphics Hosts" module should appear in the list.
- Click Enable to activate it.

💻 How to Use

After activation, a new menu will be available to facilitate your daily operations.

Navigate to SuporTI → Graphics Hosts in the main menu.
On the left sidebar, select the host you want to monitor from the hierarchical tree.
The module will automatically load all graphs (both pre-configured and ad-hoc) for that host.
Use the categories (tags) under the selected host to filter the graphs.
In the top toolbar, you can:
- Adjust the Time Range to view historical data.
- Change the number of Columns (1 to 4) for better layout control.
- Set an Auto Refresh interval (e.g., every 30 seconds) for real-time NOC dashboards.

🛠️ Technical Details & Development References

This module is built strictly following the official Zabbix Module Development Guidelines for version 7.0+:

MVC Architecture:
- Controllers: Located in actions/. Handles routing, CSRF validation (disableCsrfValidation), and JSON data endpoints (ZabbixGraphicsHostsData).
- Views: Located in views/. Renders the UI structure using Zabbix's internal UI classes.
UI Components: Utilizes Zabbix 7.0 native CHtmlPage and CTag components for DOM manipulation, ensuring compatibility with future Zabbix updates.
Security (CSP): Stylesheets are loaded via the assets property in manifest.json, completely bypassing inline-style Content Security Policy (CSP) blocks introduced in Zabbix 7.0.
Routing: Registered action ZabbixGraphicsHosts maps directly to zabbix.php?action=ZabbixGraphicsHosts.

📂 Directory Structure

This is the standard file structure of the Zabbix Graphics Hosts module:

ZabbixGraphicsHosts/
├── manifest.json                  # Module configuration and asset registration
├── Module.php                     # Core module class and menu registration
├── README.md                      # English documentation
├── README_pt.md                   # Portuguese documentation
├── actions/
│   ├── ZabbixGraphicsHosts.php    # Main page controller
│   └── ZabbixGraphicsHostsData.php # AJAX data endpoint controller
├── assets/
│   ├── css/
│   │   └── style.css              # Main flexbox styles
│   └── images/
│       ├── Image-01.png           # Screenshots
│       ├── Image-02.png
│       ├── Image-03.png
│       └── Image-04.png
├── lib/
│   └── ViewRenderer.php           # Zabbix CHtmlPage view renderer
└── views/
    └── zabbixgraphicshosts.php    # UI structure and components

🖼️ Screenshots

This section demonstrates the visual capabilities of the module.

1. Main Dashboard View

The primary interface showing the hierarchical tree on the left and the grid of graphs on the right. You can see how the layout efficiently displays multiple metrics at once.

2. Hierarchical Tree of Groups and Hosts

Hierarchical tree of Groups and Hosts registered in Zabbix. It is possible to expand and collapse the groups and hosts to facilitate navigation.

3. Dynamic Tag Filtering

This image highlights the category filters automatically generated from the host's item tags, allowing you to quickly isolate specific types of data with a single click.

4. Advanced Visualizations

Demonstration of the zoom mode when clicking on a graph that needs to be analyzed.

Navigation Menu