mula
/
summit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
summit/ROADMAP.md

6.2 KiB
Raw Permalink Blame History

收到，明白了。您决定走**“硬核极客”**路线：全开源技术栈 + 自主处理 NASA 数据。

这意味着我们要放弃现成的商业瓦片服务，转而自己搭建一套“地形瓦片生产流水线”。虽然前期工作量稍大，但完全免费且自主可控，非常有成就感。

这份修正后的 ROADMAP.md 专注于 MapLibre GL JS 和 数据预处理 流程。

🏔️ Project 14 Peaks: Open Source Edition

本项目旨在构建一个完全免费、零商业依赖的 Web 3D 地球可视化项目，展示全球 14 座 8000 米级雪山。

核心理念是“数据自主”：直接从 NASA 获取原始地形数据，自行加工处理，并使用开源引擎 MapLibre 进行渲染。

🛠 技术栈 (Tech Stack)

模块 技术选型 说明 费用
核心引擎 MapLibre GL JS Mapbox 的开源分支，API 兼容，完全免费 $0
3D 渲染 Three.js 负责渲染攀登路线、营地、光效 $0
地形数据源 NASA SRTM / ASTER 30m 精度原始 GeoTIFF 数据 $0
卫星影像源 Esri World Imagery 免费且高质量的全球卫星图源 (无需 Key) $0
数据处理工具 GDAL / rio-rgbify Python/CLI 工具，用于将 TIFF 切割为 RGB 瓦片 开源
数据托管 GitHub Pages / Vercel 静态托管切好的地形瓦片 $0

📅 开发路线图 (Roadmap)

Phase 1: 数据生产流水线搭建 (Data Pipeline Setup)

这是本路线最核心、最硬核的部分。 目标是建立一套将 NASA 原始数据转化为 Web 可用瓦片的工作流。

  • 环境准备
    • 安装 Python 环境。
    • 安装 GDAL 库 (地理空间数据处理瑞士军刀)。
    • 安装 rio-rgbify (用于将高程编码为 RGB 颜色)。
    • 安装 gdal2tiles (用于将大图切割为金字塔瓦片)。
  • 数据获取 (以珠峰为例)
    • 注册 NASA Earthdata 或访问 USGS Earth Explorer。
    • 下载珠峰区域 (27.9N, 86.9E) 的 SRTM 1 Arc-Second Global GeoTIFF 文件。
  • 数据处理脚本编写
    • 步骤 1 (编码): 编写 Shell/Python 脚本，使用 rio-rgbify 将原始 DEM 转换为 RGB 编码的 TIFF (base_val=-10000, interval=0.1)。
    • 步骤 2 (切片): 使用 gdal2tiles 将编码后的 TIFF 切割为 Zoom Level 10-14 的瓦片文件夹结构。
    • 步骤 3 (托管): 将生成的瓦片文件夹 (/tiles/{z}/{x}/{y}.png) 上传到本地服务器或静态托管服务进行测试。

Phase 2: 前端引擎实现 (MapLibre Integration)

目标：使用开源引擎成功加载我们自己生产的地形瓦片。

  • MapLibre 初始化
    • 引入 maplibre-gl.js。
    • 配置 style 对象，使用 Esri World Imagery 作为底图源 (Tiles URL: https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}).
  • 加载自定义地形
    • 配置 raster-dem 源，指向 Phase 1 中生成的瓦片 URL。
    • 设置 encoding: "mapbox" (因为我们用 rio-rgbify 模仿了 Mapbox 的编码格式)。
    • 调试：确保珠峰看起来是立体的，而不是平面的。
  • Three.js 图层接入
    • 实现 MapLibre 的 CustomLayerInterface (与 Mapbox API 基本一致)。
    • 完成坐标同步：将经纬度转换为 MapLibre 的墨卡托坐标。

Phase 3: 14座山峰数据迭代 (Data Scaling)

目标：将单座山的流程复制到所有 14 座山峰。

  • 批量数据处理
    • 整理 14 座山峰的坐标列表。
    • 批量下载这 14 个区域的 SRTM 数据。
    • 运行自动化脚本，生成所有山峰的地形瓦片包 (注意控制文件体积，仅生成山峰核心区域)。
  • 路线数据 (GPX)
    • 从 OpenStreetMap/SummitPost 获取 14 条路线 GPX。
    • 编写解析器，利用 MapLibre 的 queryTerrainElevation (如果支持) 或在预处理阶段获取海拔，确保路线贴合地面。

Phase 4: 交互与视觉开发 (Visualization)

目标：在开源引擎上实现不输商业引擎的视觉效果。

  • 3D 场景构建
    • 绘制攀登路线 (TubeGeometry)。
    • 标记关键营地 (Camp 1, Camp 2, C3, C4, Summit)。
  • 视觉增强
    • 大气层模拟: 由于 MapLibre 原生天空层较简单，考虑编写 Custom Shader 或使用简单的 CSS 渐变背景模拟高空大气。
    • 光照: 在 Three.js 场景中添加模拟太阳的平行光，根据山峰朝向调整光影。
  • 漫游控制器
    • 实现点击列表切换山峰的功能 (Camera FlyTo)。

Phase 5: 优化与部署 (Optimization)

  • 瓦片加载优化: 确保只在视野内加载地形瓦片。
  • 资源压缩: 压缩 PNG 瓦片以减少带宽消耗。
  • 部署: 将前端代码 + 地形瓦片数据一同部署到 GitHub Pages (如果是小范围数据) 或 Cloudflare R2/AWS S3 (如果数据量较大)。

📂 数据与资源清单 (Resources)

1. 核心数据源 (Free Sources)

  • Elevation: NASA Earthdata Search (Collection: SRTM 1 Arc-Second Global)
  • Imagery: Esri World Imagery (通过 REST API 访问，无需 Token)
  • Routes: OpenStreetMap (Overpass API) / SummitPost

2. 关键工具 (Tools)

📝 开发者备注 (Notes for Developer)

  1. 数据体积警告: 地形瓦片非常占用空间。建议只切片 14 座山峰周围 50km 的区域，不要尝试切片整个地球，否则你的硬盘会爆，免费托管也会超限。
  2. 坐标系转换: GDAL 处理时主要使用 EPSG:4326 (WGS84)，但在切片 (gdal2tiles) 时通常需要转换为 EPSG:3857 (Web Mercator) 以适配 Web 地图标准。
  3. 接缝处理: 如果下载的 DEM 是分块的，在转 RGB 之前最好先用 gdal_merge.py 把它们拼成一张大图，避免地形出现裂缝。