152 lines
3.8 KiB
Markdown
152 lines
3.8 KiB
Markdown
|
# Cosmo 项目当前状态
|
|||
|
|
|
|||
|
|
## ✅ 已完成
|
|||
|
|
|
|||
|
|
### 后端 (100%)
|
|||
|
|
- ✅ FastAPI 服务器搭建
|
|||
|
|
- ✅ 从 NASA JPL Horizons 获取数据
|
|||
|
|
- ✅ 实现 API 端点
|
|||
|
|
- `/api/celestial/positions` - 获取天体位置
|
|||
|
|
- `/api/celestial/info/{id}` - 获取天体信息
|
|||
|
|
- `/api/celestial/list` - 列出所有天体
|
|||
|
|
- ✅ 数据缓存机制（3天TTL）
|
|||
|
|
- ✅ CORS 配置
|
|||
|
|
- ✅ 支持时间范围查询
|
|||
|
|
|
|||
|
|
**当前运行**: http://localhost:8000
|
|||
|
|
|
|||
|
|
### 前端 (75%)
|
|||
|
|
- ✅ React + TypeScript + Vite 项目
|
|||
|
|
- ✅ Three.js 3D 场景
|
|||
|
|
- ✅ 实时数据获取和显示
|
|||
|
|
- ✅ 基本天体渲染（球体）
|
|||
|
|
- ✅ OrbitControls 相机控制
|
|||
|
|
- ✅ 星空背景
|
|||
|
|
- ✅ Loading 状态
|
|||
|
|
- ✅ 错误处理
|
|||
|
|
- ✅ Tailwind CSS 样式
|
|||
|
|
|
|||
|
|
**当前运行**: http://localhost:5173
|
|||
|
|
|
|||
|
|
## 🚧 下一步 (Stage 3 剩余部分)
|
|||
|
|
|
|||
|
|
### 轨道线绘制
|
|||
|
|
**目标**: 显示探测器的历史轨迹和未来路径
|
|||
|
|
|
|||
|
|
**实现方法**:
|
|||
|
|
1. 修改 API 调用，获取时间序列数据（如过去1年到未来1年）
|
|||
|
|
2. 创建 `OrbitLine.tsx` 组件
|
|||
|
|
3. 使用 Three.js 的 `Line` 或 `TubeGeometry` 绘制轨道
|
|||
|
|
4. 添加到 Scene 组件
|
|||
|
|
|
|||
|
|
**代码位置**: `frontend/src/components/OrbitLine.tsx`
|
|||
|
|
|
|||
|
|
### 时间选择器
|
|||
|
|
**目标**: 允许用户选择起止时间查看不同时期的位置
|
|||
|
|
|
|||
|
|
**实现方法**:
|
|||
|
|
1. 创建 `TimeSelector.tsx` 组件
|
|||
|
|
2. 使用日期选择器（或简单的 input[type="date"]）
|
|||
|
|
3. 将选择的时间传递给 useSpaceData hook
|
|||
|
|
4. 重新获取数据并更新场景
|
|||
|
|
|
|||
|
|
**代码位置**: `frontend/src/components/TimeSelector.tsx`
|
|||
|
|
|
|||
|
|
## 🎯 Stage 4: 进阶交互
|
|||
|
|
|
|||
|
|
### 点击聚焦
|
|||
|
|
- 使用 Three.js Raycaster 检测点击
|
|||
|
|
- 相机平滑动画移动到目标
|
|||
|
|
- 使用 @react-three/drei 的 `CameraControls` 或手动实现
|
|||
|
|
|
|||
|
|
### 信息面板
|
|||
|
|
- 显示选中天体的详细信息
|
|||
|
|
- 距离、速度、最近的行星等
|
|||
|
|
- 使用 React Portal 或绝对定位的 div
|
|||
|
|
|
|||
|
|
### 天体列表侧边栏
|
|||
|
|
- 显示所有天体的列表
|
|||
|
|
- 点击可聚焦
|
|||
|
|
- 可筛选（行星/探测器）
|
|||
|
|
|
|||
|
|
## 🎨 Stage 5: 视觉优化
|
|||
|
|
|
|||
|
|
### 需要下载的资源
|
|||
|
|
|
|||
|
|
**行星纹理** (https://www.solarsystemscope.com/textures/):
|
|||
|
|
```
|
|||
|
|
frontend/public/textures/
|
|||
|
|
├── sun_diffuse.jpg
|
|||
|
|
├── earth_diffuse.jpg
|
|||
|
|
├── earth_normal.jpg
|
|||
|
|
├── earth_specular.jpg
|
|||
|
|
├── mars_diffuse.jpg
|
|||
|
|
├── jupiter_diffuse.jpg
|
|||
|
|
├── saturn_diffuse.jpg
|
|||
|
|
└── ...
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
**探测器 3D 模型** (https://nasa3d.arc.nasa.gov/models):
|
|||
|
|
```
|
|||
|
|
frontend/public/models/
|
|||
|
|
├── voyager.glb
|
|||
|
|
├── new_horizons.glb
|
|||
|
|
├── parker_solar_probe.glb
|
|||
|
|
└── ...
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 动态缩放
|
|||
|
|
- 根据相机距离调整物体大小
|
|||
|
|
- 确保远距离时仍能看到物体
|
|||
|
|
- 公式: `scale = Math.max(1, distance * MIN_VISIBLE_SCALE)`
|
|||
|
|
|
|||
|
|
## 📊 进度统计
|
|||
|
|
|
|||
|
|
| 阶段 | 进度 | 状态 |
|
|||
|
|
|------|------|------|
|
|||
|
|
| Stage 1: 后端基础 | 100% | ✅ 完成 |
|
|||
|
|
| Stage 2: 前端基础 | 100% | ✅ 完成 |
|
|||
|
|
| Stage 3: 数据集成 | 70% | 🚧 进行中 |
|
|||
|
|
| Stage 4: 交互功能 | 0% | ⏳ 待开始 |
|
|||
|
|
| Stage 5: 视觉优化 | 0% | ⏳ 待开始 |
|
|||
|
|
|
|||
|
|
**总体进度**: ~54% (2.7/5 阶段)
|
|||
|
|
|
|||
|
|
## 🔧 技术债务 & 改进
|
|||
|
|
|
|||
|
|
1. **类型安全**: 某些地方可以加强 TypeScript 类型定义
|
|||
|
|
2. **错误处理**: 前端可以添加更详细的错误信息
|
|||
|
|
3. **性能优化**: 大量天体时可考虑使用 InstancedMesh
|
|||
|
|
4. **测试**: 尚未添加单元测试和集成测试
|
|||
|
|
5. **文档**: API 文档可以更详细
|
|||
|
|
|
|||
|
|
## 📝 当前可用命令
|
|||
|
|
|
|||
|
|
### 后端
|
|||
|
|
```bash
|
|||
|
|
cd backend
|
|||
|
|
source venv/bin/activate
|
|||
|
|
python -m app.main
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 前端
|
|||
|
|
```bash
|
|||
|
|
cd frontend
|
|||
|
|
yarn dev
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 🎉 成果展示
|
|||
|
|
|
|||
|
|
目前可以：
|
|||
|
|
1. 访问 http://localhost:5173
|
|||
|
|
2. 看到太阳系的 3D 可视化
|
|||
|
|
3. 使用鼠标控制视角
|
|||
|
|
4. 看到基于 NASA 真实数据的天体位置
|
|||
|
|
5. 看到漂亮的星空背景
|
|||
|
|
|
|||
|
|
数据实时从 NASA JPL Horizons 获取，包括：
|
|||
|
|
- 7 个探测器（Voyager 1 & 2, New Horizons, Parker Solar Probe, Juno, Cassini, Perseverance）
|
|||
|
|
- 9 个天体（太阳 + 八大行星）
|
|||
|
|
|
|||
|
|
总共 16 个天体的精确位置！
|