基于 Python 与 ECharts 的气象数据可视化系统

一个面向气象数据查询、分析和可视化展示的 Web 系统。项目使用 Flask 提供后端 API，Vue 3 构建前端交互，ECharts 完成趋势图、柱状图、散点图、热力图和全国天气地图展示，并接入和风天气 API 与大模型接口，用于实时天气、未来预报、历史分析和 AI 天气预警建议。

项目展示

首页实时天气与趋势

多图表数据看板

山西省天气地图聚焦

历史查询与统计分析

AI 天气预警助手

登录页

功能特性

• 用户注册、登录、会话鉴权与管理员入口
• 城市搜索、实时天气、未来多日预报查询
• 天气数据采集、清洗、入库与历史记录查询
• 折线图、柱状图、散点图、热力图等 ECharts 可视化
• 全国天气地图，支持温度/湿度模式与城市实时数据统计
• 历史天气趋势分析，支持 CSV、图表 PNG/PDF 导出
• 接入大模型接口，生成天气风险提示、出行建议并支持连续对话

技术栈

• 后端：Python 3、Flask、Flask-SQLAlchemy、Flask-CORS、requests、python-dotenv
• 前端：Vue 3、Vue Router、Axios、ECharts 5、Vite
• 数据库：SQLite，另提供 MySQL/ER 建模相关 SQL
• 数据源：和风天气 API
• AI 能力：通义千问或其他 OpenAI 兼容接口

快速开始

1. 后端

cd backend
python -m venv .venv
.venv\Scripts\activate
pip install -r requirements.txt
copy .env.example .env

编辑 backend/.env，填入和风天气 Key 以及可选的大模型 Key。

python app.py

后端默认运行在 http://127.0.0.1:5000。首次启动会自动创建 SQLite 数据表，并预置管理员账号：

username: admin
password: admin123

2. 前端

cd frontend
npm install
npm run dev

浏览器访问 http://127.0.0.1:5173。Vite 会将 /api 请求代理到 Flask 后端。

API 示例

• POST /api/auth/login 用户登录
• GET /api/auth/me 当前用户信息
• GET /api/weather/city/search?keyword=北京 城市搜索
• GET /api/weather/now/:locationId 实时天气
• GET /api/weather/daily/:locationId?days=7 未来天气预报
• GET /api/weather/chart/line?location_id=101010100 折线图数据
• GET /api/weather/chart/bar?location_id=101010100 柱状图数据
• GET /api/weather/chart/scatter?location_id=101010100 散点图数据
• GET /api/weather/chart/heatmap?location_id=101010100 热力图数据
• GET /api/weather/map-cities 全国天气地图数据
• POST /api/weather/alert/chat AI 天气预警与连续问答

项目结构

.
├── backend/
│   ├── app.py
│   ├── config.py
│   ├── models.py
│   ├── requirements.txt
│   ├── routes/
│   │   ├── auth.py
│   │   └── weather.py
│   └── services/
│       ├── ai_service.py
│       ├── data_service.py
│       └── hefeng_api.py
├── frontend/
│   ├── src/
│   │   ├── api/
│   │   ├── components/
│   │   ├── router/
│   │   └── views/
│   └── vite.config.js
├── docs/
│   └── screenshots/
└── README.md

安全说明

本仓库不会提交真实 API Key、论文文档、原始大 SQL 数据、虚拟环境或本地运行数据库。运行项目时请复制 backend/.env.example 为 backend/.env，并在本地填写自己的服务凭证。

声明

气象数据来源于和风天气，使用时请遵守对应服务条款。本项目主要用于课程设计、毕业设计和 Web 数据可视化学习展示。