◈ Weather Agent ◈

AI 驱动的智能天气预报助手 · 霓虹黑色电影美学

_{基于 LLM Function Calling 架构 | Cyberpunk × Film Noir 视觉风格 | 多层降级保障}

---

📖 项目简介

Weather Agent 是一个基于 AI Agent 架构的智能天气预报系统。用户可以用自然语言查询全球任意城市的实时天气和未来预报，Agent 会理解意图、调用工具、整理回复——就像和一个真正的天气助手对话。

✨ 核心特性

• 🧠 LLM Agent 架构 —— 基于 Function Calling，AI 自动理解用户意图并选择合适的工具
• 🎨 霓虹黑色电影 UI —— Cyberpunk × Film Noir 美学，Canvas 雨滴粒子、扫描线、暗角、发光边框
• 🛡️ 三层降级保障 —— LLM 不可用时自动回退规则引擎，天气 API 不可用时使用 Mock 数据
• 🌍 多城市支持 —— 中英文城市名均可识别，覆盖全球城市
• 🔌 多 LLM 兼容 —— 支持 DeepSeek、OpenAI 及所有兼容接口

---

🎬 效果预览

用户: 深圳今天天气怎么样？

Agent: 深圳今天（当前）的天气情况如下：

🌧️ 天气状况：小雨
🌡️ 当前温度：28°C（体感温度 26°C）
💧 湿度：43%
💨 风速：2.5 米/秒
☁️ 云量：53%

今天深圳有小雨，出门记得带伞哦～

---

🏗️ 项目结构

Tianqi agent/
├── backend/
│   ├── main.py           # FastAPI 入口，路由 & CORS
│   ├── agent.py          # Agent 核心：LLM 工具调用 + 规则降级
│   ├── weather_api.py    # OpenWeatherMap API 封装
│   ├── config.py         # 环境变量加载
│   ├── requirements.txt  # Python 依赖
│   ├── .env              # 实际配置（不提交 Git）
│   └── .env.example      # 配置模板
├── frontend/
│   ├── index.html        # 主页面
│   ├── style.css         # 霓虹黑色电影样式
│   └── app.js            # 交互逻辑 & Canvas 雨滴
└── README.md

---

🚀 快速开始

1. 克隆项目

git clone https://github.com/your-username/weather-agent.git
cd weather-agent

2. 安装依赖

cd backend
pip install -r requirements.txt

3. 配置 API 密钥

cp .env.example .env

编辑 backend/.env：

# 天气数据（可选，不填则用 Mock 数据）
OPENWEATHER_API_KEY=your_openweathermap_api_key

# LLM 配置（可选，不填则用规则引擎）
LLM_API_KEY=your_deepseek_api_key
LLM_BASE_URL=https://api.deepseek.com
LLM_MODEL=deepseek-chat

# 没有 API Key 也能跑！
USE_MOCK=true

💡 零配置也能体验：不填任何 API Key，设置 USE_MOCK=true 即可在浏览器中看到完整效果。

4. 启动服务

python -m uvicorn main:app --host 0.0.0.0 --port 8000

5. 打开浏览器

访问 http://localhost:8000 开始使用。

---

⚙️ 工作模式

条件	模式	说明
LLM + 真实数据	完整 AI Agent	LLM 理解意图 → Function Calling → 获取真实天气 → 整理回复
无 LLM + 真实数据	规则引擎	规则匹配城市名 → 调用天气 API
无 LLM + 无 API Key	Mock 演示	生成仿真天气数据，零配置可运行

---

🎨 视觉设计

元素	说明
Canvas 雨滴	140 个粒子的雨夜模拟动画
扫描线	CSS 渐变模拟 CRT 终端质感
暗角效果	radial-gradient 营造神秘氛围
霓虹发光	青/品红/电光蓝三色发光体系
菱角边框	四角差异化霓虹装饰
终端字体	JetBrains Mono + Noto Sans SC

配色方案

霓虹青色  #00f0ff  —  系统消息、标题、雨滴
霓虹品红  #ff00ff  —  用户消息、发送按钮
电光蓝    #0a7cff  —  快捷按钮
深邃黑    #0a0a0c  —  背景

---

🔧 技术栈

层级	技术
后端框架	FastAPI (异步)
AI/LLM	OpenAI SDK → DeepSeek / 任意兼容服务
天气数据	OpenWeatherMap API (2.5)
前端	Vanilla HTML/CSS/JS + Canvas
字体	JetBrains Mono + Noto Sans SC

---

📝 API 文档

POST /api/chat

请求体：

{
  "message": "北京今天天气怎么样？"
}

响应体：

{
  "reply": "🌤️ 北京 实时天气\n\n🌡 温度：29°C（体感 27°C）\n..."
}

GET /api/health

{ "status": "ok" }

---

🤝 贡献

欢迎提交 Issue 和 Pull Request！

---

📄 许可证

MIT License

---

_{Crafted with ⚡ by AI Agent × Human}