在完成 LSTM 与 BP 多模型对比验证、修正时序预测核心逻辑后，项目正式进入全栈系统落地阶段。本次以燕山大学校园为测试范围模拟城市环境，基于 Django 框架完成从「数据闭环→自动训练→实时预测→可视化展示」的全流程 Web 系统搭建，修复了页面路由、UI 显示、地图交互等问题，同时规范 GitHub 代码管理。以下是系统实现、功能集成与优化的完整细节。
系统主页
目录
一、系统架构设计与技术栈选型
1. 系统架构整体设计
2. 核心技术栈选型与配置
3. 功能模块划分与自动化交互流程
二、核心功能模块实现
1. 数据管理模块：手动上传 + 自动采集 + 14 天滚动窗口
2. 模型预测模块：每日自动训练 + 每 30 分钟实时预测
3. 结果可视化模块：多维度数据展示与对比分析
4. 地图展示模块：校园停车点 + 需求热力图（限制缩放层级）
三、系统界面优化与 BUG 修复
1. 首页布局优化 + 自动化状态面板
2. 页面路由修复（解决 404 错误）
3. 菜单栏 UI 修复 + 地图缩放限制
4. 响应式设计与交互体验优化
四、系统部署与 GitHub 仓库规范
1. 本地服务器配置与启动
2. GitHub 代码管理
3. 系统稳定性与异常处理
五、项目总结与未来展望
1. 已完成功能清单（全流程验证）
2. 项目核心亮点
3. 未来优化方向
结语
一、系统架构设计与技术栈选型
1. 系统架构整体设计
采用MVC 架构 + 自动化时序预测闭环设计，兼顾校园测试实用性与城市级扩展能力：
- 模型层：数据自动采集、14 天滚动窗口预处理、LSTM 每日离线训练
- 视图层：数据管理、模型预测、结果对比、地图可视化四大页面
- 控制层：30 分钟自动预测、定时任务调度、页面请求响应
- 核心闭环：真实数据采集→每日模型迭代→30 分钟预测→数据回流训练
MVC架构图
自动化数据闭环示意图
2. 核心技术栈选型与配置
| 后端框架 | Django | 4.2.10 | Web 全栈应用 + 路由管理 |
| 深度学习框架 | TensorFlow | 2.15.0 | LSTM 模型训练与推理 |
| 地图渲染 | Leaflet.js | 1.9.4 | 燕大校园地图 + 停车点热力图 |
| 数据可视化 | ECharts | 5.4.3 | 预测对比、误差分析图表 |
| 前端框架 | Bootstrap | 5.3.0 | 响应式页面 + UI 修复 |
| 数据处理 | Pandas/NumPy | 最新稳定版 | 时序数据清洗 + 特征工程 |
| 可视化绘图 | Matplotlib | 3.8.2 | 模型训练损失曲线绘制 |
| 数据库 | SQLite 3 | 内置 | 系统配置 + 日志存储 |
3. 功能模块划分与自动化交互流程
系统四大模块完全适配城市级需求、校园级测试的定位，形成全自动工作流：
二、核心功能模块实现
1. 数据管理模块：手动上传 + 自动采集 + 14 天滚动窗口
抛弃纯手动上传逻辑，实现业务化数据闭环：
- 初始数据导入：仅用于项目初始化，支持 CSV 批量上传
- 数据闭环日志：自动记录每 30 分钟各停车点真实停车量
- 14 天滚动窗口：自动筛选近 14 天数据作为训练集，贴合周度时序规律
- 数据规范清理：删除冗余临时文件，统一数据存储结构
数据管理模块
2. 模型预测模块：每日自动训练 + 每 30 分钟实时预测
核心解决「模型迭代频率」与「预测粒度」问题：
- 训练策略：每日凌晨自动训练 1 次，生成按日期命名的模型文件
- 预测策略：每 30 分钟自动推理，输出各停车点未来 30 分钟需求量
- 训练日志：记录 MAE/RMSE、训练时长、模型版本，支持回溯
- 兼容原有手动训练，不破坏已稳定逻辑
模型训练日志
损失曲线展示
实时预测结果
预测结果地图展示
3. 结果可视化模块：多维度数据展示与对比分析
基于 ECharts 实现业务化可视化，而非纯理论图表：
- 预测对比曲线：真实停车量 vs 预测需求量（前 100 小时 / 指定时段）
- 误差指标可视化：MAE/RMSE 实时展示，直观体现预测精度
- 时段趋势分析：早高峰 / 晚高峰校园骑行规律可视化
4. 地图展示模块：校园停车点 + 需求热力图（限制缩放层级）
以燕山大学校园模拟城市区域，严格限制地图放大级别，避免界面异常：
- 停车点标记：精准标注校园停车点位置、名称、实时状态
- 需求热力图（待实现）：基于 30 分钟预测值生成，直观展示区域供需
- 地图约束：最大缩放级别 18，禁止过度放大导致渲染异常
- 交互优化：点击预测结果自动跳转地图并高亮对应停车点
地图展示
三、系统界面优化与 BUG 修复
1. 首页布局优化 + 自动化状态面板
修复原首页地图占满全屏、布局怪异问题：
- 布局调整：地图 70% 宽度 + 右侧数据概览 30% 宽度，不再全屏横行
- 新增自动化状态面板：展示最近训练时间、最近预测时间、数据采集状态
- 快速功能按钮：修复点击无响应问题，绑定正确跳转链接
首页布局
2. 页面路由修复（解决 404 错误）
彻底修复/data/manage/、/model/predict/等页面访问失败问题：
- 配置 Django 正确路由，绑定视图与模板
- 所有页面复用基础模板，保持 UI 风格统一
- 保留原有地图、停车点核心逻辑，仅新增路由
3. 菜单栏 UI 修复 + 地图缩放限制
解决视觉异常问题：
- 修复小菜单栏「白字 + 白背景」问题：浅灰背景 + 深色字体，紫色主题 hover 效果
- 限制地图最大缩放级别，禁止过度缩放导致界面错乱
- 统一全站字体、间距、按钮样式
4. 响应式设计与交互体验优化
- 新增加载动画、操作反馈，提升使用体验
- 表单验证、弹窗提示规范化，减少操作错误
四、系统部署与 GitHub 仓库规范
1. 本地服务器配置与启动
- 运行环境：Python 3.9 + 虚拟环境 bsdp_env
- 启动命令：python manage.py runserver
- 访问地址：http://127.0.0.1:8000/
- 模型加载：自动加载当日最新训练模型，缺失则提示手动训练
2. GitHub 代码管理
严格规范仓库提交，符合开源标准：
- 配置.gitignore
- 模块化提交，注释清晰，保留完整版本历史
- 仓库地址：https://github.com/Lyan-X/LSTM-based-BSDP
GitHub仓库展示
3. 系统稳定性与异常处理
- 模型文件缺失、数据异常自动捕获，不崩溃系统
- 训练 / 预测日志完整记录，便于问题排查
- 定时任务独立运行，不影响地图、前端核心功能
五、项目总结与未来展望
1. 已完成功能清单（全流程验证）
- 数据管理：手动上传 + 自动采集 + 14 天滚动窗口
- 模型模块：每日自动训练 + 每 30 分钟停车点预测
- 可视化模块：预测对比 + 误差分析 + 趋势展示
- 地图模块：燕大校园测试 + 停车点 + 热力图 + 缩放限制
- 界面优化：布局修复 + UI 修复 + 路由修复（无 404）
- 代码规范：GitHub 管理 + 冗余清理
2. 项目核心亮点
3. 未来优化方向
- 模型升级：引入 GRU、Transformer 提升预测精度
- 城市级适配：扩展到真实城市区域，接入实时物联网数据
- 智能调度：基于预测结果生成车辆调度建议
- 并发优化：支持多用户同时访问，提升系统承载能力
结语
本次迭代完成了从「时序预测模型」到「可落地 Web 系统」的基本升级，以燕山大学校园为测试载体验证了城市级共享单车需求预测方案的可行性。系统实现了每日自动训练、每 30 分钟预测、全流程数据闭环，同时完成界面优化、BUG 修复与代码规范化，兼顾学术性与工程实用性。
项目所有代码已开源至 GitHub：https://github.com/Lyan-X/LSTM-based-BSDP，欢迎交流测试与优化思路。
