基于Python的城市内涝积涝监测数据可视化分析系统 毕业论文毕业设计一、项目名称基于Python的城市内涝积涝监测数据可视化分析系统【摘要】城市内涝是汛期公共安全与市政排水管理的重要议题。积水深度、小时降雨、预警等级等指标相互关联但原始数据往往分散在气象接口、易涝点名录与水务监测平台中存在口径不一、难以横向对比、缺少趋势研判等问题。本文设计并实现了基于 Python 与 Django 的城市内涝积涝监测数据可视化分析系统面向教学与课题演示场景将多源数据汇聚、清洗入库后以交互式图表支撑汛情态势研判与结构分析。系统采用 B/S 架构后端基于 Django 3.1.14管理端集成 SimpleUI数据库使用 MySQL库名waterlog前台基于 Bootstrap 5 与 ECharts 5 完成可视化。业务数据以FloodRecord为核心覆盖深圳市 40 个易涝测站、2024 年 5—9 月汛期小时级记录总量约 2.4 万条字段包含测站编码/名称、行政区/街道、经纬度、监测时间、水位、预警水位、小时/日降雨、预警等级及是否积水等。小时降雨来自 Open-Meteo Archive API 真实数据积水水位基于真实降雨与点位排水敏感度估算论文正文已说明不代表水务局实测传感器读数。数据采集通过scripts/fetch_flood_data.py生成 CSV再经管理命令import_flood入库系统未提供 Web 数据采集页无独立大屏无Flask 组件。分析层以 pandas、NumPy 聚合采用 Spearman/Pearson 相关、IQR 异常检测以及线性外推与滑动平均对水位进行示意性预测。系统入口为manage.py默认运行端口8070前台登录路径为/app/login/后台为/admin/默认账号分别为 admin/123456前台app.User与 admin/admin123Django 后台。侧栏涵盖数据总览、水位分析、降雨分析、行政区对比、预警分析、时序分析、相关性分析、水位预测、异常检测、数据列表/导出及个人信息维护等模块。utils 层封装waterlog_core、waterlog_charts、waterlog_constants分析结果经 Bundle API 一次返回多图数据本地内存缓存WATERLOG_CACHE_TTL120秒。测试与运行结果表明系统能够完成登录鉴权、多维筛选分析、图表联动与 CSV 导出闭环界面清晰、响应稳定可为城市内涝监测课题研究与教学演示提供可用的可视化分析支撑。【关键词】Django城市内涝数据可视化EChartsSpearman 相关【Abstract】Urban waterlogging is a critical issue for public safety and municipal drainage during flood seasons. Indicators such as water depth, hourly rainfall and warning grades are interrelated, yet raw data are often scattered across weather APIs, flood-prone site catalogs and water-authority platforms, which makes cross-site comparison and trend analysis difficult. This thesis designs and implements a Python- and Django-based urban waterlogging monitoring data visualization and analysis system for teaching and demonstration. Multi-source data are collected, cleaned and stored, then explored through interactive charts for situational awareness and structural analysis.The system follows a B/S architecture. The backend is built with Django 3.1.14 and SimpleUI for administration; MySQL is used with database namewaterlog; the frontend adopts Bootstrap 5 and ECharts 5. The core entityFloodRecordcovers 40 monitoring stations in Shenzhen from May to September 2024 at hourly granularity (approximately 24,000 records), including station attributes, location, observation time, water level, warning threshold, rainfall, warning grade and flood flag. Hourly rainfall comes from the real Open-Meteo Archive API; water levels areestimatedfrom rainfall and site sensitivity (not official sensor readings). Data are produced byscripts/fetch_flood_data.pyand imported viaimport_flood; there is no web-based>登录页采用水利监测主题背景与居中表单用户输入账号密码后提交成功进入数据总览首页。4.2 数据总览模块的实现数据总览页面由home视图渲染模板并注入服务端 KPI前端再请求api_overview调用overview_bundle补全图表。overview_bundle对过滤后的查询集计算记录数、测站数、积水率、平均水位、最大小时降雨并生成行政区积水柱图、预警饼图与抽样后的水位时序。功能实现流程设计图4.2 数据总览模块实现流程图访问 /app/home/home 视图注入 stats请求 /app/api/overview/cached_analysis_dfoverview_bundle 聚合 KPI组装柱图/饼图/时序前端 ECharts 渲染结束核心代码实现# 来源app/utils/waterlog_charts.py — 总览汇总节选 def overview_bundle(request): def build(): df cached_analysis_df(request) if df.empty: return _empty_bundle() n len(df) station_n int(df[station_code].nunique()) flood_rate _num(df[is_flooded].mean() * 100, 1) # ... 行政区积水柱图、预警饼图、水位时序 ... return _cache_bundle(overview, request, build)# 来源app/api_views.py — 总览 API require_GET def api_overview(request): return json_ok(overview_bundle(request))实现效果展示访问路径http://127.0.0.1:8070/app/home/图4.8 数据总览界面首页展示 KPI 卡片、行政区积水次数柱图、预警等级饼图与全网平均水位时序支持月份/行政区/预警等级筛选联动。4.3 水位与降雨分析模块的实现水位分析通过water_level_bundle输出分布直方、Top 测站均水位与分行政区箱线降雨分析通过rain_bundle输出小时降雨与水位双轴时序及降雨—水位散点。页面路由分别为/app/water_level/与/app/rain/对应module_water_level与module_rain视图。功能实现流程设计图4.3 水位与降雨分析模块实现流程图水位降雨访问 water_level 或 rain请求对应 bundle APIcached_analysis_df模块分支_hist_bins / box_by_districthourly agg / scatter samplejson_ok 返回分布/箱线/时序/散点渲染核心代码实现# 来源app/views.py — 页面入口 def module_water_level(request): return _module_page(request, modules/water_level.html) def module_rain(request): return _module_page(request, modules/rain.html)# 来源app/urls.py — 水位/降雨路由与 API节选 path(water_level/, views.module_water_level, namemodule_water_level), path(rain/, views.module_rain, namemodule_rain), path(api/water-level-bundle/, api_views.api_water_level_bundle, nameapi_water_level_bundle), path(api/rain-bundle/, api_views.api_rain_bundle, nameapi_rain_bundle),实现效果展示访问路径水位分析http://127.0.0.1:8070/app/water_level/降雨分析http://127.0.0.1:8070/app/rain/图4.9 水位分析界面水位页展示积水深度频率分布、平均水位 Top 测站排行及分行政区箱线图便于对比区域差异。图4.10 降雨分析界面降雨页展示小时降雨与水位联动时序及降雨—水位散点用于观察雨峰与水位抬升关系。4.4 行政区与预警分析模块的实现行政区模块通过district_bundle按区分组聚合平均水位、降雨与积水率并以测站经纬度生成空间散点。预警模块通过warning_bundle统计预警等级占比与各等级积水率。页面路由分别为/app/district/与/app/warning/。功能实现流程设计图4.4 行政区与预警分析模块实现流程图行政区预警访问 district 或 warning请求 district/warning bundlecached_analysis_df模块分支groupby district map_scatterwarn_share flood_by_grade返回 JSON对比柱图/散点/饼图渲染核心代码实现# 来源app/api_views.py — 行政区/预警 Bundle require_GET def api_district_bundle(request): return _bundle(district_bundle, request) require_GET def api_warning_bundle(request): return _bundle(warning_bundle, request)# 来源app/utils/waterlog_constants.py — 预警等级顺序 WARN_GRADES [正常, 蓝色预警, 黄色预警, 橙色预警, 红色预警]实现效果展示访问路径行政区对比http://127.0.0.1:8070/app/district/预警分析http://127.0.0.1:8070/app/warning/图4.11 行政区对比界面行政区页展示各辖区平均水位、降雨与积水率对比柱图以及测站经纬度散点便于空间巡检。图4.12 预警分析界面预警页展示预警等级占比饼图与各等级积水率对比用于检验预警结构与实际积水关联。4.5 时序相关预测异常模块的实现时序模块输出日均水位与星期×小时热力相关模块优先 Spearman 矩阵预测模块对小时均水位线性外推 24 小时并叠加滑动平均异常模块以 IQR 标记离群水位。四页路由为/app/time_series/、/app/correlation/、/app/prediction/、/app/anomaly/。功能实现流程设计图4.5 时序相关预测异常模块实现流程图时序相关预测异常访问时序/相关/预测/异常页请求对应 bundlecached_analysis_df算法pivot_table 热力df.corr spearman/pearsonnp.polyfit 外推24h rolling MAiqr_outliers 标记json_ok折线/热力/矩阵/标注图核心代码实现# 来源app/utils/waterlog_core.py — IQR 异常检测 def iqr_outliers(values): arr np.asarray(values, dtypefloat) arr arr[~np.isnan(arr)] if len(arr) 4: return np.zeros(len(arr), dtypebool), {} q1, q3 np.percentile(arr, [25, 75]) iqr q3 - q1 low, high q1 - 1.5 * iqr, q3 1.5 * iqr mask (arr low) | (arr high) return mask, {q1: _num(q1), q3: _num(q3), iqr: _num(iqr), low: _num(low), high: _num(high)}# 来源app/utils/waterlog_charts.py — 相关与预测节选 method spearman try: corr sub.corr(methodspearman) except Exception: method pearson corr sub.corr(methodpearson) # 预测coef np.polyfit(x, y, 1)外推 horizon24 小时# 来源app/urls.py — 时序/相关/预测/异常路由节选 path(time_series/, views.module_time_series, namemodule_time_series), path(correlation/, views.module_correlation, namemodule_correlation), path(prediction/, views.module_prediction, namemodule_prediction), path(anomaly/, views.module_anomaly, namemodule_anomaly), path(api/correlation-bundle/, api_views.api_correlation_bundle, nameapi_correlation_bundle), path(api/prediction-bundle/, api_views.api_prediction_bundle, nameapi_prediction_bundle), path(api/anomaly-bundle/, api_views.api_anomaly_bundle, nameapi_anomaly_bundle),实现效果展示访问路径时序分析http://127.0.0.1:8070/app/time_series/相关性分析http://127.0.0.1:8070/app/correlation/水位预测http://127.0.0.1:8070/app/prediction/异常检测http://127.0.0.1:8070/app/anomaly/图4.13 时序分析界面时序页展示日均水位折线与星期×小时热力矩阵用于发现周内与日内易涝时段。图4.14 相关性分析界面相关页展示变量相关矩阵热力图及降雨—水位系数说明强调相关不等于因果。图4.15 水位预测界面预测页对比历史水位、线性拟合、滑动平均与未来 24 小时外推曲线并附算法说明卡片。图4.16 异常检测界面异常页在时序上标注 IQR 离群点并列出异常样本表测站、时间、水位、预警等级。4.6 列表导出与后台模块的实现数据列表页对FloodRecord分页展示并统计列表 KPI导出接口按筛选条件流式输出 CSV。后台通过 SimpleUI 管理监测记录增删改后调用invalidate_waterlog_cache。数据初始化由脚本与管理命令完成系统不提供 Web 数据采集页。功能实现流程设计图4.6 列表导出与后台模块实现流程图是否访问 /app/flood_list/filtered_queryset Paginator渲染分页表格与 list_stats导出?api_export iterator 写 CSV继续浏览/筛选访问 /admin/FloodRecordAdmin CRUDinvalidate_waterlog_cachefetch_flood_data.pyimport_flood --truncate约2.4万条入库核心代码实现# 来源app/views.py — CSV 导出节选 require_GET def api_export(request): if not request.session.get(username): return redirect(/app/login/) qs filtered_queryset(request) buf io.StringIO() buf.write(\ufeff) writer csv.writer(buf) writer.writerow([field_label(f, with_unitTrue) for f in EXPORT_FIELDS]) for row in qs.values_list(*EXPORT_FIELDS).iterator(chunk_size2000): writer.writerow(row) resp HttpResponse(buf.getvalue(), content_typetext/csv; charsetutf-8) resp[Content-Disposition] attachment; filenamewaterlog_export.csv return resp# 来源app/admin.py — 后台缓存失效 def save_model(self, request, obj, form, change): super().save_model(request, obj, form, change) invalidate_waterlog_cache()# 来源基于Django系统/settings.py — 数据库与缓存节选 DATABASES { default: { ENGINE: django.db.backends.mysql, NAME: os.environ.get(MYSQL_DATABASE, waterlog), ... } } WATERLOG_CACHE_TTL 120实现效果展示访问路径数据列表http://127.0.0.1:8070/app/flood_list/CSV 导出http://127.0.0.1:8070/app/api/export/后台管理http://127.0.0.1:8070/admin/admin / admin123图4.17 数据列表界面列表页分页展示监测记录支持月份/行政区/预警等级筛选并提供导出按钮与列表内统计摘要。图4.18 后台管理界面SimpleUI 后台提供内涝监测记录与前台用户的检索、筛选与维护菜单分组清晰。4.7 用户界面实现界面采用 Bootstrap 5 布局侧栏按“数据总览 / 水位与降雨 / 行政区与预警 / 时序相关预测异常 / 数据列表 / 个人信息”分组。主题样式由waterlog-theme.css统一登录背景使用waterlog-bg.jpg。各分析页复用chart_base.html骨架与waterlog_pages.js请求 Bundle API筛选条通过/app/api/options/获取行政区、月份与预警等级下拉。系统无独立大屏路由所有可视化均在常规页面内完成无 Flask 组件。4.8 系统集成与部署部署步骤概要如下安装requirements.txt依赖Django 3.1.14、django-simpleui、PyMySQL、pandas、numpy、scipy、pillow、requests 等。创建 MySQL 库waterlog配置连接账号。执行python manage.py migrate。执行python scripts/fetch_flood_data.py生成waterlog_data.csv。执行python manage.py import_flood --path waterlog_data.csv --truncate写入约 2.4 万条记录。python manage.py seed_admin初始化前台用户 admin/123456 与后台 admin/admin123。python manage.py runserver 8070。根 URL 将空路径重定向到/app/login/静态与媒体资源由 Django 开发服务器挂载。课题演示以8070端口本地运行为准。可选配置SZ_OPENDATA_APPKEY后重新拉取以尝试官方真实水位。5 系统测试5.1 系统功能测试测试环境Windows 10Python 3.11Django 3.1.14MySQL库waterlog浏览器访问http://127.0.0.1:8070。前台默认账号 admin/123456后台 admin/admin123。5.1.1 用户认证功能测试用例编号说明条件操作步骤预期结果实际结果TC-A01正确登录库中存在 admin打开/app/login/输入 admin/123456 提交跳转/app/home/侧栏可见通过TC-A02错误密码账号存在输入错误密码提交提示用户名或密码错误通过TC-A03注册新用户用户名未占用/app/register/填写一致密码注册成功并回到登录页通过TC-A04退出登录已登录执行/app/logOut/Session 清空回到登录页通过5.1.2 数据管理功能测试用例编号说明条件操作步骤预期结果实际结果TC-B01数据列表浏览已导入样本打开/app/flood_list/分页展示内涝监测记录通过TC-B02后台查看记录管理员可进 Admin登录/admin/打开内涝监测记录可检索测站/行政区/时间等字段通过TC-B03CSV 导出已登录且有数据在列表页点击导出或访问/app/api/export/下载 UTF-8 BOM 的 CSV 文件通过TC-B04脚本入库CSV 已生成执行import_flood --truncate约 2.4 万条写入 FloodRecord通过5.1.3 核心业务功能测试用例编号说明条件操作步骤预期结果实际结果TC-C01数据总览有监测数据打开/app/home/KPI 与图表正常通过TC-C02水位分析有水位字段打开/app/water_level/分布/Top/箱线图有数据通过TC-C03降雨分析有降雨字段打开/app/rain/时序与散点可见通过TC-C04行政区对比有多区数据打开/app/district/对比柱图与散点更新通过TC-C05预警分析有预警等级打开/app/warning/占比与积水率对比可见通过5.1.4 数据分析功能测试用例编号说明条件操作步骤预期结果实际结果TC-D01时序热力有时序数据/app/time_series/请求 bundle日均折线与热力矩阵返回通过TC-D02相关矩阵样本足够/app/correlation/Spearman/Pearson 矩阵可渲染通过TC-D03水位预测小时样本≥5/app/prediction/历史外推滑动平均曲线可见通过TC-D04异常检测水位样本≥4/app/anomaly/IQR 异常点标注与样本表可见通过5.1.5 系统集成功能测试用例编号说明条件操作步骤预期结果实际结果TC-E01根路径跳转服务已启动访问/重定向到/app/login/通过TC-E02API 前缀已登录请求/app/api/overview/等返回 JSON ok 结构通过TC-E03筛选选项库有数据请求/app/api/options/返回行政区/月份/预警等级通过TC-E04前后台共库库有数据前台总览记录数与后台对照数量级一致约2.4万通过TC-E05无 Web 采集页路由已配置访问/app/data_fetch/无此业务页404通过TC-E06无独立大屏系统部署完成访问/bigscreen无业务大屏页通过5.1.6 用户界面功能测试用例编号说明条件操作步骤预期结果实际结果TC-F01侧栏导航已登录点击各分析菜单对应页面激活高亮通过TC-F02修改信息已登录/app/changeSelfInfo/保存信息更新成功通过TC-F03修改密码已登录/app/changePassword/提交新密码可登录通过TC-F04筛选联动有数据切换月份/行政区/预警等级各页图表随筛选刷新通过5.2 系统性能测试5.2.1 响应时间性能分析在约 2.4 万条FloodRecord、40 个测站规模下普通页面首屏一般可在 13 秒内完成带聚合的 Bundle API 在缓存命中时响应更快。首次冷查询因聚合与 DataFrame 转换耗时相对更高之后 120 秒缓存窗口内重复筛选可明显降耗。时序热力与相关矩阵 Bundle 缓存倍数设为 2×TTL进一步减少重复计算。5.2.2 并发性能测试课题演示场景以单机少量并发为主。Session 认证与本地内存缓存在多用户同时筛选相近条件时能够复用结果若并发显著增大可考虑更换 Redis 等缓存后端。当前实现满足课程验收与本机演示需求。5.2.3 数据库性能测试针对observe_timedistrict、observe_timewarn_grade的组合索引对月份与行政区过滤的Count/Avg/Max查询有帮助。列表导出使用iterator(chunk_size2000)流式读库避免一次性装入全部行。建议定期ANALYZE并避免无索引字段上的高基数字符串模糊查询。5.2.4 性能优化措施使用cached_analysis_df与WATERLOG_CACHE_TTL120降低重复计算。Bundle API 合并多图数据减少 HTTP 往返。sample_series对过长时序等距抽样减轻前端渲染压力。后台增删改调用invalidate_waterlog_cache递增版本号避免脏读而非全库清缓存。导入阶段--truncate后批量写入缩短初始化时间。6 总结与展望6.1 总结本文完成了基于 Python 的城市内涝积涝监测数据可视化分析系统的设计与实现。系统以 Django 3.1.14 SimpleUI 为 Web 框架MySQL 库名waterlog服务端口8070入口manage.py前台/app/login/admin/123456后台/admin/admin/admin123。围绕User与FloodRecord两张核心表按六大模块组织了用户认证、数据总览、水位与降雨分析、行政区与预警分析、时序相关预测异常、列表导出与后台分析 API 提供 options/overview 及八个*-bundle接口。数据覆盖深圳市40个测站、2024 年 5—9 月汛期、约2.4 万条小时级记录小时降雨来自 Open-Meteo真实数据积水水位为基于降雨与点位敏感度的估算值论文与界面均已说明。数据采集通过scripts/fetch_flood_data.py与import_flood完成无Web 采集页、无Flask、无独立大屏。分析采用 pandas/NumPy 聚合Spearman/Pearson 相关、IQR 异常检测以及线性外推与滑动平均示意预测utils 层waterlog_core、waterlog_charts、waterlog_constants分层清晰本地缓存 TTL 为 120 秒。前端以 ECharts 5 与 Bootstrap 5 呈现。经功能测试主要模块运行符合预期能够支撑教学演示与课题分析。从模块规模看论文第 3、4 章按上述6个功能模块展开侧栏路由包括/app/home/、/app/water_level/、/app/rain/、/app/district/、/app/warning/、/app/time_series/、/app/correlation/、/app/prediction/、/app/anomaly/、/app/flood_list/等形成可复现的本地化内涝可视化分析方案。6.2 展望后续可从以下方向继续完善在深圳开放平台申请 appKey 后切换官方积涝水位并与估算序列对照展示引入更丰富的时间序列模型如 ARIMA 或季节性分解提升预测表达力增加角色权限细分与操作审计将脚本拉取接入定时任务或消息队列在保持无独立大屏的前提下优化移动端图表交互与地图底图集成扩展更多测站与近实时降水接入使分析更贴近业务巡检场景。参考文献[1] Django Software Foundation. Django documentation (3.1.x)[EB/OL]. Django documentation | Django documentation | Django, 2021.[2] 伊诺克森托娃. Python数据分析[M]. 北京: 人民邮电出版社, 2020.[3] 王珊, 萨师煊. 数据库系统概论[M]. 5版. 北京: 高等教育出版社, 2014.[4] Apache ECharts. ECharts 官方文档[EB/OL]. Apache ECharts.[5] McKinney W. Data Structures for Statistical Computing in Python[C]//Proceedings of the 9th Python in Science Conference, 2010.[6] Open-Meteo. Historical Weather API Documentation[EB/OL]. ️ Free Open-Source Weather API | Open-Meteo.com.[7] 深圳市人民政府. 深圳市政府数据开放平台市水务局积涝点水位接口[EB/OL]. 深圳市政府数据开放平台.[8] 李刚. 疯狂 Python 讲义[M]. 北京: 电子工业出版社, 2019.[9] 张浩. 基于 Web 的数据可视化系统设计与实现[J]. 计算机应用与软件, 2020.[10] Bootstrap Team. Bootstrap 5 Documentation[EB/OL]. https://getbootstrap.com/docs/5.0/getting-started/introduction/.[11] 周志华. 机器学习[M]. 北京: 清华大学出版社, 2016.[12] Spearman C. The Proof and Measurement of Association between Two Things[J]. American Journal of Psychology, 1904, 15(1): 72-101.致谢在毕业设计完成之际衷心感谢指导老师在选题、需求分析、系统设计与论文撰写过程中给予的耐心指导与严格要求。感谢同学在环境搭建、功能联调与界面体验反馈方面提供的帮助。感谢开源社区提供的 Django、ECharts、pandas、Open-Meteo 等相关技术与数据接口使本系统能够顺利落地。也感谢家人一直以来的理解与支持。由于水平与时间有限系统中水位估算与示意性预测仍有改进空间恳请各位老师批评指正。
基于Python的城市内涝积涝监测数据可视化分析系统 毕业论文毕业设计一、项目名称基于Python的城市内涝积涝监测数据可视化分析系统【摘要】城市内涝是汛期公共安全与市政排水管理的重要议题。积水深度、小时降雨、预警等级等指标相互关联但原始数据往往分散在气象接口、易涝点名录与水务监测平台中存在口径不一、难以横向对比、缺少趋势研判等问题。本文设计并实现了基于 Python 与 Django 的城市内涝积涝监测数据可视化分析系统面向教学与课题演示场景将多源数据汇聚、清洗入库后以交互式图表支撑汛情态势研判与结构分析。系统采用 B/S 架构后端基于 Django 3.1.14管理端集成 SimpleUI数据库使用 MySQL库名waterlog前台基于 Bootstrap 5 与 ECharts 5 完成可视化。业务数据以FloodRecord为核心覆盖深圳市 40 个易涝测站、2024 年 5—9 月汛期小时级记录总量约 2.4 万条字段包含测站编码/名称、行政区/街道、经纬度、监测时间、水位、预警水位、小时/日降雨、预警等级及是否积水等。小时降雨来自 Open-Meteo Archive API 真实数据积水水位基于真实降雨与点位排水敏感度估算论文正文已说明不代表水务局实测传感器读数。数据采集通过scripts/fetch_flood_data.py生成 CSV再经管理命令import_flood入库系统未提供 Web 数据采集页无独立大屏无Flask 组件。分析层以 pandas、NumPy 聚合采用 Spearman/Pearson 相关、IQR 异常检测以及线性外推与滑动平均对水位进行示意性预测。系统入口为manage.py默认运行端口8070前台登录路径为/app/login/后台为/admin/默认账号分别为 admin/123456前台app.User与 admin/admin123Django 后台。侧栏涵盖数据总览、水位分析、降雨分析、行政区对比、预警分析、时序分析、相关性分析、水位预测、异常检测、数据列表/导出及个人信息维护等模块。utils 层封装waterlog_core、waterlog_charts、waterlog_constants分析结果经 Bundle API 一次返回多图数据本地内存缓存WATERLOG_CACHE_TTL120秒。测试与运行结果表明系统能够完成登录鉴权、多维筛选分析、图表联动与 CSV 导出闭环界面清晰、响应稳定可为城市内涝监测课题研究与教学演示提供可用的可视化分析支撑。【关键词】Django城市内涝数据可视化EChartsSpearman 相关【Abstract】Urban waterlogging is a critical issue for public safety and municipal drainage during flood seasons. Indicators such as water depth, hourly rainfall and warning grades are interrelated, yet raw data are often scattered across weather APIs, flood-prone site catalogs and water-authority platforms, which makes cross-site comparison and trend analysis difficult. This thesis designs and implements a Python- and Django-based urban waterlogging monitoring data visualization and analysis system for teaching and demonstration. Multi-source data are collected, cleaned and stored, then explored through interactive charts for situational awareness and structural analysis.The system follows a B/S architecture. The backend is built with Django 3.1.14 and SimpleUI for administration; MySQL is used with database namewaterlog; the frontend adopts Bootstrap 5 and ECharts 5. The core entityFloodRecordcovers 40 monitoring stations in Shenzhen from May to September 2024 at hourly granularity (approximately 24,000 records), including station attributes, location, observation time, water level, warning threshold, rainfall, warning grade and flood flag. Hourly rainfall comes from the real Open-Meteo Archive API; water levels areestimatedfrom rainfall and site sensitivity (not official sensor readings). Data are produced byscripts/fetch_flood_data.pyand imported viaimport_flood; there is no web-based>登录页采用水利监测主题背景与居中表单用户输入账号密码后提交成功进入数据总览首页。4.2 数据总览模块的实现数据总览页面由home视图渲染模板并注入服务端 KPI前端再请求api_overview调用overview_bundle补全图表。overview_bundle对过滤后的查询集计算记录数、测站数、积水率、平均水位、最大小时降雨并生成行政区积水柱图、预警饼图与抽样后的水位时序。功能实现流程设计图4.2 数据总览模块实现流程图访问 /app/home/home 视图注入 stats请求 /app/api/overview/cached_analysis_dfoverview_bundle 聚合 KPI组装柱图/饼图/时序前端 ECharts 渲染结束核心代码实现# 来源app/utils/waterlog_charts.py — 总览汇总节选 def overview_bundle(request): def build(): df cached_analysis_df(request) if df.empty: return _empty_bundle() n len(df) station_n int(df[station_code].nunique()) flood_rate _num(df[is_flooded].mean() * 100, 1) # ... 行政区积水柱图、预警饼图、水位时序 ... return _cache_bundle(overview, request, build)# 来源app/api_views.py — 总览 API require_GET def api_overview(request): return json_ok(overview_bundle(request))实现效果展示访问路径http://127.0.0.1:8070/app/home/图4.8 数据总览界面首页展示 KPI 卡片、行政区积水次数柱图、预警等级饼图与全网平均水位时序支持月份/行政区/预警等级筛选联动。4.3 水位与降雨分析模块的实现水位分析通过water_level_bundle输出分布直方、Top 测站均水位与分行政区箱线降雨分析通过rain_bundle输出小时降雨与水位双轴时序及降雨—水位散点。页面路由分别为/app/water_level/与/app/rain/对应module_water_level与module_rain视图。功能实现流程设计图4.3 水位与降雨分析模块实现流程图水位降雨访问 water_level 或 rain请求对应 bundle APIcached_analysis_df模块分支_hist_bins / box_by_districthourly agg / scatter samplejson_ok 返回分布/箱线/时序/散点渲染核心代码实现# 来源app/views.py — 页面入口 def module_water_level(request): return _module_page(request, modules/water_level.html) def module_rain(request): return _module_page(request, modules/rain.html)# 来源app/urls.py — 水位/降雨路由与 API节选 path(water_level/, views.module_water_level, namemodule_water_level), path(rain/, views.module_rain, namemodule_rain), path(api/water-level-bundle/, api_views.api_water_level_bundle, nameapi_water_level_bundle), path(api/rain-bundle/, api_views.api_rain_bundle, nameapi_rain_bundle),实现效果展示访问路径水位分析http://127.0.0.1:8070/app/water_level/降雨分析http://127.0.0.1:8070/app/rain/图4.9 水位分析界面水位页展示积水深度频率分布、平均水位 Top 测站排行及分行政区箱线图便于对比区域差异。图4.10 降雨分析界面降雨页展示小时降雨与水位联动时序及降雨—水位散点用于观察雨峰与水位抬升关系。4.4 行政区与预警分析模块的实现行政区模块通过district_bundle按区分组聚合平均水位、降雨与积水率并以测站经纬度生成空间散点。预警模块通过warning_bundle统计预警等级占比与各等级积水率。页面路由分别为/app/district/与/app/warning/。功能实现流程设计图4.4 行政区与预警分析模块实现流程图行政区预警访问 district 或 warning请求 district/warning bundlecached_analysis_df模块分支groupby district map_scatterwarn_share flood_by_grade返回 JSON对比柱图/散点/饼图渲染核心代码实现# 来源app/api_views.py — 行政区/预警 Bundle require_GET def api_district_bundle(request): return _bundle(district_bundle, request) require_GET def api_warning_bundle(request): return _bundle(warning_bundle, request)# 来源app/utils/waterlog_constants.py — 预警等级顺序 WARN_GRADES [正常, 蓝色预警, 黄色预警, 橙色预警, 红色预警]实现效果展示访问路径行政区对比http://127.0.0.1:8070/app/district/预警分析http://127.0.0.1:8070/app/warning/图4.11 行政区对比界面行政区页展示各辖区平均水位、降雨与积水率对比柱图以及测站经纬度散点便于空间巡检。图4.12 预警分析界面预警页展示预警等级占比饼图与各等级积水率对比用于检验预警结构与实际积水关联。4.5 时序相关预测异常模块的实现时序模块输出日均水位与星期×小时热力相关模块优先 Spearman 矩阵预测模块对小时均水位线性外推 24 小时并叠加滑动平均异常模块以 IQR 标记离群水位。四页路由为/app/time_series/、/app/correlation/、/app/prediction/、/app/anomaly/。功能实现流程设计图4.5 时序相关预测异常模块实现流程图时序相关预测异常访问时序/相关/预测/异常页请求对应 bundlecached_analysis_df算法pivot_table 热力df.corr spearman/pearsonnp.polyfit 外推24h rolling MAiqr_outliers 标记json_ok折线/热力/矩阵/标注图核心代码实现# 来源app/utils/waterlog_core.py — IQR 异常检测 def iqr_outliers(values): arr np.asarray(values, dtypefloat) arr arr[~np.isnan(arr)] if len(arr) 4: return np.zeros(len(arr), dtypebool), {} q1, q3 np.percentile(arr, [25, 75]) iqr q3 - q1 low, high q1 - 1.5 * iqr, q3 1.5 * iqr mask (arr low) | (arr high) return mask, {q1: _num(q1), q3: _num(q3), iqr: _num(iqr), low: _num(low), high: _num(high)}# 来源app/utils/waterlog_charts.py — 相关与预测节选 method spearman try: corr sub.corr(methodspearman) except Exception: method pearson corr sub.corr(methodpearson) # 预测coef np.polyfit(x, y, 1)外推 horizon24 小时# 来源app/urls.py — 时序/相关/预测/异常路由节选 path(time_series/, views.module_time_series, namemodule_time_series), path(correlation/, views.module_correlation, namemodule_correlation), path(prediction/, views.module_prediction, namemodule_prediction), path(anomaly/, views.module_anomaly, namemodule_anomaly), path(api/correlation-bundle/, api_views.api_correlation_bundle, nameapi_correlation_bundle), path(api/prediction-bundle/, api_views.api_prediction_bundle, nameapi_prediction_bundle), path(api/anomaly-bundle/, api_views.api_anomaly_bundle, nameapi_anomaly_bundle),实现效果展示访问路径时序分析http://127.0.0.1:8070/app/time_series/相关性分析http://127.0.0.1:8070/app/correlation/水位预测http://127.0.0.1:8070/app/prediction/异常检测http://127.0.0.1:8070/app/anomaly/图4.13 时序分析界面时序页展示日均水位折线与星期×小时热力矩阵用于发现周内与日内易涝时段。图4.14 相关性分析界面相关页展示变量相关矩阵热力图及降雨—水位系数说明强调相关不等于因果。图4.15 水位预测界面预测页对比历史水位、线性拟合、滑动平均与未来 24 小时外推曲线并附算法说明卡片。图4.16 异常检测界面异常页在时序上标注 IQR 离群点并列出异常样本表测站、时间、水位、预警等级。4.6 列表导出与后台模块的实现数据列表页对FloodRecord分页展示并统计列表 KPI导出接口按筛选条件流式输出 CSV。后台通过 SimpleUI 管理监测记录增删改后调用invalidate_waterlog_cache。数据初始化由脚本与管理命令完成系统不提供 Web 数据采集页。功能实现流程设计图4.6 列表导出与后台模块实现流程图是否访问 /app/flood_list/filtered_queryset Paginator渲染分页表格与 list_stats导出?api_export iterator 写 CSV继续浏览/筛选访问 /admin/FloodRecordAdmin CRUDinvalidate_waterlog_cachefetch_flood_data.pyimport_flood --truncate约2.4万条入库核心代码实现# 来源app/views.py — CSV 导出节选 require_GET def api_export(request): if not request.session.get(username): return redirect(/app/login/) qs filtered_queryset(request) buf io.StringIO() buf.write(\ufeff) writer csv.writer(buf) writer.writerow([field_label(f, with_unitTrue) for f in EXPORT_FIELDS]) for row in qs.values_list(*EXPORT_FIELDS).iterator(chunk_size2000): writer.writerow(row) resp HttpResponse(buf.getvalue(), content_typetext/csv; charsetutf-8) resp[Content-Disposition] attachment; filenamewaterlog_export.csv return resp# 来源app/admin.py — 后台缓存失效 def save_model(self, request, obj, form, change): super().save_model(request, obj, form, change) invalidate_waterlog_cache()# 来源基于Django系统/settings.py — 数据库与缓存节选 DATABASES { default: { ENGINE: django.db.backends.mysql, NAME: os.environ.get(MYSQL_DATABASE, waterlog), ... } } WATERLOG_CACHE_TTL 120实现效果展示访问路径数据列表http://127.0.0.1:8070/app/flood_list/CSV 导出http://127.0.0.1:8070/app/api/export/后台管理http://127.0.0.1:8070/admin/admin / admin123图4.17 数据列表界面列表页分页展示监测记录支持月份/行政区/预警等级筛选并提供导出按钮与列表内统计摘要。图4.18 后台管理界面SimpleUI 后台提供内涝监测记录与前台用户的检索、筛选与维护菜单分组清晰。4.7 用户界面实现界面采用 Bootstrap 5 布局侧栏按“数据总览 / 水位与降雨 / 行政区与预警 / 时序相关预测异常 / 数据列表 / 个人信息”分组。主题样式由waterlog-theme.css统一登录背景使用waterlog-bg.jpg。各分析页复用chart_base.html骨架与waterlog_pages.js请求 Bundle API筛选条通过/app/api/options/获取行政区、月份与预警等级下拉。系统无独立大屏路由所有可视化均在常规页面内完成无 Flask 组件。4.8 系统集成与部署部署步骤概要如下安装requirements.txt依赖Django 3.1.14、django-simpleui、PyMySQL、pandas、numpy、scipy、pillow、requests 等。创建 MySQL 库waterlog配置连接账号。执行python manage.py migrate。执行python scripts/fetch_flood_data.py生成waterlog_data.csv。执行python manage.py import_flood --path waterlog_data.csv --truncate写入约 2.4 万条记录。python manage.py seed_admin初始化前台用户 admin/123456 与后台 admin/admin123。python manage.py runserver 8070。根 URL 将空路径重定向到/app/login/静态与媒体资源由 Django 开发服务器挂载。课题演示以8070端口本地运行为准。可选配置SZ_OPENDATA_APPKEY后重新拉取以尝试官方真实水位。5 系统测试5.1 系统功能测试测试环境Windows 10Python 3.11Django 3.1.14MySQL库waterlog浏览器访问http://127.0.0.1:8070。前台默认账号 admin/123456后台 admin/admin123。5.1.1 用户认证功能测试用例编号说明条件操作步骤预期结果实际结果TC-A01正确登录库中存在 admin打开/app/login/输入 admin/123456 提交跳转/app/home/侧栏可见通过TC-A02错误密码账号存在输入错误密码提交提示用户名或密码错误通过TC-A03注册新用户用户名未占用/app/register/填写一致密码注册成功并回到登录页通过TC-A04退出登录已登录执行/app/logOut/Session 清空回到登录页通过5.1.2 数据管理功能测试用例编号说明条件操作步骤预期结果实际结果TC-B01数据列表浏览已导入样本打开/app/flood_list/分页展示内涝监测记录通过TC-B02后台查看记录管理员可进 Admin登录/admin/打开内涝监测记录可检索测站/行政区/时间等字段通过TC-B03CSV 导出已登录且有数据在列表页点击导出或访问/app/api/export/下载 UTF-8 BOM 的 CSV 文件通过TC-B04脚本入库CSV 已生成执行import_flood --truncate约 2.4 万条写入 FloodRecord通过5.1.3 核心业务功能测试用例编号说明条件操作步骤预期结果实际结果TC-C01数据总览有监测数据打开/app/home/KPI 与图表正常通过TC-C02水位分析有水位字段打开/app/water_level/分布/Top/箱线图有数据通过TC-C03降雨分析有降雨字段打开/app/rain/时序与散点可见通过TC-C04行政区对比有多区数据打开/app/district/对比柱图与散点更新通过TC-C05预警分析有预警等级打开/app/warning/占比与积水率对比可见通过5.1.4 数据分析功能测试用例编号说明条件操作步骤预期结果实际结果TC-D01时序热力有时序数据/app/time_series/请求 bundle日均折线与热力矩阵返回通过TC-D02相关矩阵样本足够/app/correlation/Spearman/Pearson 矩阵可渲染通过TC-D03水位预测小时样本≥5/app/prediction/历史外推滑动平均曲线可见通过TC-D04异常检测水位样本≥4/app/anomaly/IQR 异常点标注与样本表可见通过5.1.5 系统集成功能测试用例编号说明条件操作步骤预期结果实际结果TC-E01根路径跳转服务已启动访问/重定向到/app/login/通过TC-E02API 前缀已登录请求/app/api/overview/等返回 JSON ok 结构通过TC-E03筛选选项库有数据请求/app/api/options/返回行政区/月份/预警等级通过TC-E04前后台共库库有数据前台总览记录数与后台对照数量级一致约2.4万通过TC-E05无 Web 采集页路由已配置访问/app/data_fetch/无此业务页404通过TC-E06无独立大屏系统部署完成访问/bigscreen无业务大屏页通过5.1.6 用户界面功能测试用例编号说明条件操作步骤预期结果实际结果TC-F01侧栏导航已登录点击各分析菜单对应页面激活高亮通过TC-F02修改信息已登录/app/changeSelfInfo/保存信息更新成功通过TC-F03修改密码已登录/app/changePassword/提交新密码可登录通过TC-F04筛选联动有数据切换月份/行政区/预警等级各页图表随筛选刷新通过5.2 系统性能测试5.2.1 响应时间性能分析在约 2.4 万条FloodRecord、40 个测站规模下普通页面首屏一般可在 13 秒内完成带聚合的 Bundle API 在缓存命中时响应更快。首次冷查询因聚合与 DataFrame 转换耗时相对更高之后 120 秒缓存窗口内重复筛选可明显降耗。时序热力与相关矩阵 Bundle 缓存倍数设为 2×TTL进一步减少重复计算。5.2.2 并发性能测试课题演示场景以单机少量并发为主。Session 认证与本地内存缓存在多用户同时筛选相近条件时能够复用结果若并发显著增大可考虑更换 Redis 等缓存后端。当前实现满足课程验收与本机演示需求。5.2.3 数据库性能测试针对observe_timedistrict、observe_timewarn_grade的组合索引对月份与行政区过滤的Count/Avg/Max查询有帮助。列表导出使用iterator(chunk_size2000)流式读库避免一次性装入全部行。建议定期ANALYZE并避免无索引字段上的高基数字符串模糊查询。5.2.4 性能优化措施使用cached_analysis_df与WATERLOG_CACHE_TTL120降低重复计算。Bundle API 合并多图数据减少 HTTP 往返。sample_series对过长时序等距抽样减轻前端渲染压力。后台增删改调用invalidate_waterlog_cache递增版本号避免脏读而非全库清缓存。导入阶段--truncate后批量写入缩短初始化时间。6 总结与展望6.1 总结本文完成了基于 Python 的城市内涝积涝监测数据可视化分析系统的设计与实现。系统以 Django 3.1.14 SimpleUI 为 Web 框架MySQL 库名waterlog服务端口8070入口manage.py前台/app/login/admin/123456后台/admin/admin/admin123。围绕User与FloodRecord两张核心表按六大模块组织了用户认证、数据总览、水位与降雨分析、行政区与预警分析、时序相关预测异常、列表导出与后台分析 API 提供 options/overview 及八个*-bundle接口。数据覆盖深圳市40个测站、2024 年 5—9 月汛期、约2.4 万条小时级记录小时降雨来自 Open-Meteo真实数据积水水位为基于降雨与点位敏感度的估算值论文与界面均已说明。数据采集通过scripts/fetch_flood_data.py与import_flood完成无Web 采集页、无Flask、无独立大屏。分析采用 pandas/NumPy 聚合Spearman/Pearson 相关、IQR 异常检测以及线性外推与滑动平均示意预测utils 层waterlog_core、waterlog_charts、waterlog_constants分层清晰本地缓存 TTL 为 120 秒。前端以 ECharts 5 与 Bootstrap 5 呈现。经功能测试主要模块运行符合预期能够支撑教学演示与课题分析。从模块规模看论文第 3、4 章按上述6个功能模块展开侧栏路由包括/app/home/、/app/water_level/、/app/rain/、/app/district/、/app/warning/、/app/time_series/、/app/correlation/、/app/prediction/、/app/anomaly/、/app/flood_list/等形成可复现的本地化内涝可视化分析方案。6.2 展望后续可从以下方向继续完善在深圳开放平台申请 appKey 后切换官方积涝水位并与估算序列对照展示引入更丰富的时间序列模型如 ARIMA 或季节性分解提升预测表达力增加角色权限细分与操作审计将脚本拉取接入定时任务或消息队列在保持无独立大屏的前提下优化移动端图表交互与地图底图集成扩展更多测站与近实时降水接入使分析更贴近业务巡检场景。参考文献[1] Django Software Foundation. Django documentation (3.1.x)[EB/OL]. Django documentation | Django documentation | Django, 2021.[2] 伊诺克森托娃. Python数据分析[M]. 北京: 人民邮电出版社, 2020.[3] 王珊, 萨师煊. 数据库系统概论[M]. 5版. 北京: 高等教育出版社, 2014.[4] Apache ECharts. ECharts 官方文档[EB/OL]. Apache ECharts.[5] McKinney W. Data Structures for Statistical Computing in Python[C]//Proceedings of the 9th Python in Science Conference, 2010.[6] Open-Meteo. Historical Weather API Documentation[EB/OL]. ️ Free Open-Source Weather API | Open-Meteo.com.[7] 深圳市人民政府. 深圳市政府数据开放平台市水务局积涝点水位接口[EB/OL]. 深圳市政府数据开放平台.[8] 李刚. 疯狂 Python 讲义[M]. 北京: 电子工业出版社, 2019.[9] 张浩. 基于 Web 的数据可视化系统设计与实现[J]. 计算机应用与软件, 2020.[10] Bootstrap Team. Bootstrap 5 Documentation[EB/OL]. https://getbootstrap.com/docs/5.0/getting-started/introduction/.[11] 周志华. 机器学习[M]. 北京: 清华大学出版社, 2016.[12] Spearman C. The Proof and Measurement of Association between Two Things[J]. American Journal of Psychology, 1904, 15(1): 72-101.致谢在毕业设计完成之际衷心感谢指导老师在选题、需求分析、系统设计与论文撰写过程中给予的耐心指导与严格要求。感谢同学在环境搭建、功能联调与界面体验反馈方面提供的帮助。感谢开源社区提供的 Django、ECharts、pandas、Open-Meteo 等相关技术与数据接口使本系统能够顺利落地。也感谢家人一直以来的理解与支持。由于水平与时间有限系统中水位估算与示意性预测仍有改进空间恳请各位老师批评指正。
 write read)
