Grafana 数据可视化

Grafana 数据可视化

概述

本节介绍如何将 Node-RED 数据在 Grafana 中可视化。学习完成后，您将能够：

• 配置 Grafana 连接 InfluxDB 数据源
• 创建 IoT 监控仪表板
• 使用 Flux 查询语言获取数据
• 设计面向客户的实时数据展示

Data Flow

Node-RED ──写入──→ InfluxDB ──查询──→ Grafana
   ↑                         ↑
   │                    [可视化仪表板]
[MQTT 数据源]

Configuring Data Source

在 Grafana 中添加 InfluxDB 数据源

{
    "name": "InfluxDB IoT",
    "type": "influxdb",
    "url": "http://influxdb:8086",
    "access": "proxy",
    "basicAuth": false,
    "jsonData": {
        "version": "Flux",
        "organization": "iot-demo",
        "defaultBucket": "nodered",
        "timeInterval": "5s"
    },
    "secureJsonData": {
        "token": "your-influxdb-token"
    }
}

通过 API 配置

curl -X POST http://admin:admin@localhost:3000/api/datasources \
    -H "Content-Type: application/json" \
    -d '{
        "name": "InfluxDB IoT",
        "type": "influxdb",
        "url": "http://influxdb:8086",
        "access": "proxy",
        "jsonData": {
            "version": "Flux",
            "organization": "iot-demo",
            "defaultBucket": "nodered"
        },
        "secureJsonData": {
            "token": "your-token"
        }
    }'

Creating Dashboards

Panel 1: 实时统计

-- Flux 查询: 最新温度值
from(bucket: "nodered")
    |> range(start: -5m)
    |> filter(fn: (r) => r._measurement == "sensor_data")
    |> filter(fn: (r) => r._field == "temperature")
    |> last()
    |> yield(name: "latest")

可视化配置:

• 类型: Stat
• 单位: Celsius (°C)
• 阈值: > 30°C 红色
• 刷新: 5s

Panel 2: 时间序列图

-- Flux 查询: 24 小时温度趋势
from(bucket: "nodered")
    |> range(start: -24h)
    |> filter(fn: (r) => r._measurement == "sensor_data")
    |> filter(fn: (r) => r._field == "temperature")
    |> aggregateWindow(every: 5m, fn: mean)
    |> yield(name: "mean")

可视化配置:

• 类型: Time Series
• 线条: Smooth
• 填充: 20%
• 时间范围: Last 24 hours

Panel 3: 多设备对比

-- Flux 查询: 多设备温度对比
from(bucket: "nodered")
    |> range(start: -1h)
    |> filter(fn: (r) => r._measurement == "sensor_data")
    |> filter(fn: (r) => r._field == "temperature")
    |> filter(fn: (r) => r.device == "SENSOR-01" or r.device == "SENSOR-02")
    |> aggregateWindow(every: 1m, fn: mean)

Panel 4: 设备状态表

-- Flux 查询: 各设备最新数据
from(bucket: "nodered")
    |> range(start: -5m)
    |> filter(fn: (r) => r._measurement == "sensor_data")
    |> last()
    |> group(columns: ["device"])
    |> yield(name: "latest_by_device")

Dashboard Variables

使用变量实现动态过滤仪表板：

创建 Device 变量

-- 变量查询
import "influxdata/influxdb/schema"
schema.tagValues(
    bucket: "nodered",
    tag: "device"
)

在面板中使用变量

-- 使用 $device 变量
from(bucket: "nodered")
    |> range(start: -1h)
    |> filter(fn: (r) => r._measurement == "sensor_data")
    |> filter(fn: (r) => r.device == "${device}")
    |> filter(fn: (r) => r._field == "temperature")

Dashboard Templates

IoT 监控仪表板模板

{
    "dashboard": {
        "title": "IoT Sensor Monitoring",
        "tags": ["iot", "sensors"],
        "timezone": "browser",
        "panels": [
            {
                "title": "Current Temperature",
                "type": "stat",
                "gridPos": {"h": 4, "w": 4, "x": 0, "y": 0}
            },
            {
                "title": "Temperature Trend",
                "type": "timeseries",
                "gridPos": {"h": 8, "w": 12, "x": 0, "y": 4}
            },
            {
                "title": "Device Status",
                "type": "table",
                "gridPos": {"h": 8, "w": 12, "x": 0, "y": 12}
            }
        ],
        "refresh": "5s"
    }
}

Auto-Refresh Configuration

# Grafana 配置文件 (grafana.ini)
[dashboards]
default_refresh = 5s

# 或在面板中设置
# Panel → General → Repeat
# Time range: Last 30 minutes
# Refresh: Every 5 seconds

Alerting

配置告警规则

-- 告警查询
from(bucket: "nodered")
    |> range(start: -5m)
    |> filter(fn: (r) => r._measurement == "sensor_data")
    |> filter(fn: (r) => r._field == "temperature")
    |> last()

告警条件:

• 当 temperature > 35°C 触发
• 评估频率: 每 1 分钟
• 持续时间: 超过 5 分钟

通知方式:

• Email
• Webhook
• Slack/Teams

Dashboard Sharing

导出仪表板

# 从 Grafana UI 导出
# Dashboard Settings → JSON Model → Copy JSON

# 通过 API 导出
curl -X GET http://admin:admin@localhost:3000/api/dashboards/uid/{uid} \
    -o dashboard.json

创建快照

# 创建可分享的仪表板快照
# Share Dashboard → Snapshot → Local Snapshot
# 生成可分享的链接

Kiosk Mode

# 全屏展示模式（适合客户演示）
# URL: http://localhost:3000/d/{uid}/iot-monitor?kiosk&refresh=5s

# 参数说明:
# kiosk: 隐藏 UI 元素
# refresh=5s: 5 秒自动刷新
# from=now-1h/to=now: 时间范围

Common Customer Questions

Q1: Grafana 仪表板可以导出吗？

A: 可以。导出为 JSON 文件，可导入到其他 Grafana 实例。通过 API 可以批量管理仪表板。

Q2: 数据刷新频率多少合适？

A: 传感器监控推荐 5-10 秒刷新。实时控制场景可缩短到 1-2 秒，但会增加服务器和数据库压力。

Q3: 如何处理大量传感器的展示？

A: 使用 Grafana 变量实现动态过滤，或使用 Repeat Panel 功能为每个传感器自动生成面板。

最佳实践

✅ 推荐做法:

• 设计面向客户的仪表板布局
• 使用变量实现动态过滤
• 设置合理的刷新间隔 (5-30s)
• 使用 Flux 查询优化性能
• 导出仪表板作为模板

❌ 避免做法:

• 在单个仪表板放过多面板
• 刷新间隔过短 (< 1s)
• 查询大量原始数据（使用聚合）
• 忽略阈值告警设置
• 不备份仪表板配置

Summary

1. Grafana 是 InfluxDB 数据的最佳可视化工具
2. Flux 查询语言支持丰富的数据分析
3. 变量功能实现动态仪表板过滤
4. 告警系统实现主动监控通知
5. Kiosk 模式适合客户演示场景

References

• Grafana InfluxDB 数据源
• Flux 查询文档
• Grafana Dashboards