面向轨道交通场景的多参数环境监测与可视化平台。
当前版本采用 Modbus 串口采集 + Python 本地后端 + Web 前端展示 的实现方式,可在本机完成实时数据接入、历史趋势分析和综合状态展示。
项目简介
本项目围绕轨道交通环境监测场景展开,重点关注多参数环境信息的统一接入、可视化展示与后续扩展能力。平台目前支持对以下指标进行展示与分析:
- 温度
- 湿度
- CO₂
- PM2.5
- PM10
- NH₃
- H₂S
- 人员状态
当前页面分为两部分:
1. 实时总览
用于展示设备当前状态与关键环境指标,包括:
- 设备状态
- 设备编号
- 更新时间
- 主要参数卡片
- CO₂ 趋势图
- 环境综合评分
- 气体指标
- 环境等级标准
- 原始寄存器与运行信息
2. 历史分析
用于展示一段时间内的变化趋势和统计结果,包括:
- CO₂ / PM2.5 / PM10 趋势图
- 温湿度变化图
- 均值、最大值、最小值、预警次数
- 指标统计表
- 评分说明
技术结构
当前版本的软件链路如下:
单片机 → Modbus 串口 → Python 后端 → 本地网页前端
其中:
- 单片机负责采集与寄存器输出
- Python 后端负责串口轮询、寄存器解析与接口提供
- 前端网页负责图表绘制和页面展示
这一结构的优点是实现路径清晰,便于调试,也保留了后续扩展为公网服务的可能。
项目结构
推荐目录结构如下:
railenv/├─ backend/│ └─ server.py├─ frontend/│ ├─ index.html│ ├─ style.css│ └─ app.js├─ data/│ ├─ live_data.json│ └─ history_data.json└─ README.md文件说明
backend/server.py
后端核心文件,负责:
- 启动本地 HTTP 服务
- 建立 Modbus 串口连接
- 周期性读取寄存器
- 将原始寄存器解析为结构化数据
- 维护 latest / history 数据
- 提供前端接口
当前前端主要依赖以下接口:
/api/latest/api/history/api/config
frontend/index.html
页面结构文件,定义整体布局与模块分区,包括实时总览页和历史分析页。
frontend/style.css
页面样式文件,负责布局、配色、玻璃质感、卡片样式、图表容器与响应式适配。
frontend/app.js
前端逻辑文件,负责:
- 获取后端接口数据
- 更新页面显示内容
- 渲染图表
- 计算统计摘要
- 控制页面切换与定时刷新
data/live_data.json
保存当前最新一帧数据,便于调试与查看。
data/history_data.json
保存最近一段时间的历史数据,供趋势图与统计模块使用。
数据映射
当前寄存器读取逻辑基于如下映射:
0 -> people1 -> co22 -> pm253 -> pm104 ~ 5 -> nh36 ~ 7 -> h2s8 ~ 9 -> temperature10 ~ 11 -> humidity其中:
people / co2 / pm25 / pm10为直接数值nh3 / h2s / temperature / humidity由双寄存器浮点解析得到
如果后续硬件映射调整,优先修改 backend/server.py 中的寄存器解析部分。
运行方式
依赖安装
建议使用:
pip install "pymodbus[serial]"如果环境中缺少串口依赖,也可以补充安装:
pip install pyserial启动示例
python backend/server.py --mode modbus --serial-port COM5 --baudrate 9600 --slave 35 --address 0 --quantity 12启动后,在浏览器中访问:
http://127.0.0.1:8000图表与展示设置
为了便于比赛展示与页面阅读,当前图表量程采用固定范围:
- 首页 CO₂ 趋势图:
0–3000 ppm - 历史分析页 CO₂:
0–3000 ppm - 历史分析页 PM2.5 / PM10:
0–150 μg/m³ - 历史分析页温度:
0–40 ℃ - 历史分析页湿度:
0–100 %RH
如果后续展示需求变化,可在 frontend/app.js 中调整对应图表的 yAxis 配置。
评分逻辑
当前页面中的综合评分采用 100 分制,主要由以下几部分构成:
- 空气质量:重点参考 CO₂、PM2.5、PM10
- 热湿舒适度:参考温度、湿度偏离程度
- 气体风险:参考 NH₃、H₂S 超阈值情况
当前建议等级划分为:
- 优:90 分及以上
- 良:75–89 分
- 一般:60–74 分
- 预警:60 分以下
评分与状态映射逻辑位于 backend/server.py 中,后续若有需要,可根据实验数据或展示需求继续调整。
页面修改建议
如果需要继续调整页面,通常可按以下分工定位:
改文字、模块结构
修改:
frontend/index.html
改布局、对齐、风格、颜色、玻璃效果
修改:
frontend/style.css
改图表、统计逻辑、页面刷新方式
修改:
frontend/app.js
改串口参数、寄存器映射、浮点解析、评分规则、接口
修改:
backend/server.py
扩展方向
当前代码结构已经具备继续扩展的基础,后续可以从以下方向延伸:
1. 数据分析与预测
如果需要增加回归模型、趋势预测或预警判断,最合适的入口是后端。
建议在 backend/server.py 中基于 history 数据新增预测函数,再通过接口返回给前端展示。
例如可扩展:
- CO₂ 变化趋势预测
- 环境状态预判
- 预警提前提示
当前最自然的扩展位置在评分与状态相关逻辑附近,例如:
compute_score(...)compute_status(...)infer_scene(...)
2. 多设备展示
如果后续需要支持多个监测节点,可以在后端增加设备编号维度,在前端增加设备切换或多设备对比页面。
3. 公网部署
如果后续需要将本地页面扩展为可公开访问的网站,最可行的路径是:
保留当前前端结构不变,将后端部署到服务器,并把本地采集结果同步到云端后端。
也就是说:
当前: Modbus → 本地 Python → 本地网页
后续: Modbus / 本地采集端 → 云端 Python 后端 → 公网网页
这样可以最大程度复用已有前端页面与接口设计,而不需要从头重做。
说明
当前版本的重点在于:
- 真实数据接入
- 本地稳定运行
- 页面展示完整
- 结构清晰,便于后续迭代
因此,这一版本更强调“可运行、可展示、可扩展”的平衡,而不是追求过重的系统架构。后续无论是继续优化前端,还是增加分析模块,均可以在现有基础上平滑推进。