| <!doctype html> |
| <html lang="zh"> |
| <head> |
| <meta charset="utf-8"/> |
| <meta name="viewport" content="width=device-width, initial-scale=1"/> |
| <title>Hydrologic Model Builder — 导航</title> |
| <link rel="stylesheet" href="style.css"/> |
| </head> |
| <body> |
| <div class="wrap"> |
| <h1>💧 Hydrologic Model Builder — 交互课程</h1> |
| <p class="sub">从零搭一个模块化、可插拔的水文模型，锚定 <b>CREST / EF5</b>，由集总(lumped)到分布式(distributed)。 |
| 每个模块一个独立页面：<b>可编辑的 Python 代码 + 参数滑块 + 实时曲线</b>（Pyodide 在浏览器里真跑 Python）。 |
| 多个经典 version 可切换对比，<span class="crest-tag">CREST</span> 标签标出 CREST/EF5 采用的那个。</p> |
|
|
| <h2>整体结构：一个水文模型的流水线</h2> |
| <div class="card"> |
| <div class="pipe">[forcing 驱动] → [PET 蒸发需求] → (snow 融雪) → (interception 截留) → [<b>soil water balance 产流</b>] → [response 快/慢水库] → [routing 汇流] → discharge 流量</div> |
| <p>核心理念：把模型拆成<b>可插拔 block</b>——只要输入/输出用同名通量(flux)+同单位(mm/dt)，任何一块都能换成另一种经典方法。 |
| 每个 block 是一个 Python 类（<code>init_state</code> + <code>step</code>），<code>Model</code> 组装器用共享 "flux 总线" 把它们串起来（EF5 <code>Simulator</code> 的极简教学版）。</p> |
| <p class="status">两阶段路线：<b>阶段A 集总</b>(把每个过程在单个流域单元上吃透) → <b>阶段B 分布式</b>(同样的 block 扩到网格 + cell-to-cell 汇流，对照 EF5 源码) → <b>阶段C 可微</b>(反向传播率定, 进阶)。</p> |
| </div> |
|
|
| <h2>模块导航</h2> |
| <div class="grid"> |
| <a class="mcard" href="m00_overview.html"> |
| <h3><span class="num done">0</span>水量平衡 & 骨架</h3> |
| <p>水文模型 = 一本水的账本：P − ET − Q = ΔS。线性水库 playground 验证引擎。</p> |
| <p class="st done">✓ 已完成 · 可交互</p> |
| </a> |
| <a class="mcard" href="m01_forcing.html"> |
| <h3><span class="num done">1</span>Forcing 驱动数据</h3> |
| <p>降水/PET 从哪来。空间聚合 3 法（mean/Thiessen/IDW）可改代码对比；CREST 走网格。</p> |
| <p class="st done">✓ 已完成 · 可交互</p> |
| </a> |
| <a class="mcard" href="m02_pet.html"> |
| <h3><span class="num done">2</span>PET 潜在蒸散发</h3> |
| <p>蒸发需求 3 版本：GivenPET×KE(CREST) / Hamon / Hargreaves，可切换、可改参数。</p> |
| <p class="st done">✓ 已完成 · 可交互</p> |
| </a> |
| <div class="mcard" style="opacity:.75"> |
| <h3><span class="num todo">3·4</span>Snow / Interception</h3> |
| <p>Hesperange 无雪、无温度列 → 跳过留位（接口已预留，之后有雪流域再学）。</p> |
| <p class="st skip">⏲ 跳过留位</p> |
| </div> |
| <a class="mcard" href="m05_runoff.html"> |
| <h3><span class="num done">5</span>产流 / 土壤水量平衡 <span class="badge">核心</span></h3> |
| <p>bucket / HBV-beta / VIC 可变入渗曲线(CREST) / SCS-CN 四版本可改代码对比。</p> |
| <p class="st done">✓ 已完成 · 可交互</p> |
| </a> |
| <a class="mcard" href="m06_response.html"> |
| <h3><span class="num done">6</span>Response 响应水库</h3> |
| <p>快/慢水库给产流加记忆：single/dual(CREST LEAKO-LEAKI)/nonlinear/Nash。首个端到端 NSE(手调 0.84)。</p> |
| <p class="st done">✓ 已完成 · 可交互</p> |
| </a> |
| <a class="mcard" href="m07_routing.html"> |
| <h3><span class="num done">7</span>Routing ①方法轴（集总）</h3> |
| <p>五方法三门派 FIR/IIR/PDE + Saint-Venant 谱系。<b>同一话题的"方法"维度</b>。NSE 0.885。</p> |
| <p class="st done">✓ 已完成 · 可交互</p> |
| </a> |
| <a class="mcard" href="m08_channel.html"> |
| <h3><span class="num done">8a</span>Routing ②空间轴（网络）</h3> |
| <p>同样的 KW 方程 + 拓扑网络；CREST 两套原生方案(lr/kw)解剖；逐步追踪面板。<b>"空间"维度</b>。</p> |
| <p class="st done">✓ 已完成 · 可交互</p> |
| </a> |
| <div class="mcard" style="opacity:.75"> |
| <h3><span class="num todo">8b</span>DEM & 空间结构</h3> |
| <p>D8 流向、汇流累积、真实 DEM 提河网；TOPMODEL 地形指数桥梁。</p> |
| <p class="st todo">待学 (阶段B)</p> |
| </div> |
| <div class="mcard" style="opacity:.75"> |
| <h3><span class="num todo">9-11</span>率定 / 不确定性 / 评估</h3> |
| <p>NSE/KGE、Monte Carlo、GLUE、DREAM(EF5)；之后 阶段C 可微梯度率定。</p> |
| <p class="st todo">待学</p> |
| </div> |
| </div> |
|
|
| <h2>Routing 是一个话题、两条轴（模块 7 与 8a 的关系）</h2> |
| <div class="card"> |
| <p>模块 7 和 8a <b>都是 routing</b>。它们不是两个话题，而是同一话题的<b>两个维度</b>： |
| <b>方法</b>（用什么物理）× <b>空间</b>（有没有拓扑）。KW 在两页里是<b>字面意义上同一个方程</b>。</p> |
| <table> |
| <tr><th>方法 \ 空间</th><th>集总（模块7）：一个河段，无空间</th><th>网络（模块8a）：逐格 + 拓扑</th></tr> |
| <tr><td>UH 卷积（FIR）</td><td>✓ 直接规定核（lag/三角/Gamma）</td><td>— 网络会自己"长出"核（GIUH）</td></tr> |
| <tr><td>Muskingum（IIR）</td><td>✓ 单河段</td><td>可逐河段串联</td></tr> |
| <tr><td><b>Kinematic wave（PDE）</b></td><td>✓ V5 单河段</td><td>✓ <b>同一方程</b> + 拓扑扫描</td></tr> |
| <tr><td>lr 水库+travel-time</td><td>—</td><td>✓ <b>原生 CREST</b> <span class="crest-tag">CREST</span></td></tr> |
| </table> |
| <p class="status"><b>为什么代码上仍要分开</b>：模块7 的方法都是 <code>Block</code>，能插进 <code>Model</code> 链（total_runoff→discharge）； |
| 8a 的网络路由<b>不是 Block</b>——它需要整个网格 + 拓扑，装不进集总链。这是接口层面的硬区别。</p> |
|
|
| <h3>那么"空间"到底买来了什么？（实验回答）</h3> |
| <img src="lumped_vs_network.png" alt="lumped vs network routing" style="width:100%;border:1px solid var(--line);border-radius:8px"/> |
| <div class="cap">左：网络自己长出的 UH ≈ 拟合的 Gamma UH · 中：同样 10mm 下"雨落在哪" · 右：同样均匀分布下"雨下多大"</div> |
| <ul> |
| <li><b>① 集总 UH 是"涌现"的</b>：给网络均匀单位雨，出口响应几乎完美等于一条 Gamma UH（n=1.85, k=0.07, SSE=3.3e-4）。这就是 <b>GIUH</b> 的思想——<b>地貌替你写好了单位线</b>。所以均匀降雨下，集总方法并不"更差"。</li> |
| <li><b>② 空间买来"雨落在哪"的敏感性</b>：同样 10mm，网络把峰现从 t=2（近出口）挪到 t=17（远支流）；而集总 UH <b>只能给同一个形状</b>（只按体积缩放），三条虚线完全重合。</li> |
| <li><b>③ 更狠的一点：KW 网络根本没有唯一的 UH</b>。同样均匀降雨，1/10/100 mm 的隐含 UH 峰现在 t=53/13/3——因为波速随流量涨。<b>UH 假设线性，而 KW 非线性</b>：集总 UH 只是某个流量区间上的线性化。</li> |
| </ul> |
| <p class="status"><b>结论</b>：均匀雨 + 单一流量区间 → 集总 UH 完全够用（且更快更稳）；<b>需要空间降雨（雷达/卫星）或跨量级洪水 → 必须上网络</b>。这正是 CREST/EF5 为山洪预报选择分布式的根本理由。</p> |
| </div> |
|
|
| <h2>本站怎么用</h2> |
| <div class="card"> |
| <ul> |
| <li>每个模块页有<b>版本切换标签</b>——不同经典方法可换着跑；<span class="crest-tag">CREST</span> 标签 = CREST/EF5 用的那个。</li> |
| <li><b>代码框里的 Python 是真的可编辑、可重跑</b>（浏览器里 Pyodide + numpy）：改公式、改参数、点「运行」看曲线变化。</li> |
| <li>参数滑块拖动松手即重算；每次运行报告<b>耗时</b>，方便比较方法差异。</li> |
| <li>页面底部有<b>中英双语术语表</b>；顶部导航随时回到本页。</li> |
| </ul> |
| </div> |
|
|
| <h2>案例流域 · Hesperange (Alzette, Luxembourg)</h2> |
| <div class="card"> |
| <p>卢森堡南部 Alzette 河上、卢森堡市上游，子流域约 292 km²（中尺度）。数据来自 TU Delft CIE4431 课程：日尺度 1127 天（1997-08 起），P≈1014、PET≈710、Q≈465 mm/yr，径流系数≈0.46。出口砂岩瓶颈 → 基流明显。</p> |
| <img src="hesperange_schematic.png" alt="Hesperange catchment schematic" style="width:100%;border:1px solid var(--line);border-radius:8px"/> |
| <div class="cap">Hesperange 区位与流域示意（schematic，非按比例）</div> |
| </div> |
|
|
| <div class="foot">Made with Claude Code · hydrologic-model-builder skill · data: TU Delft CIE4431 · anchor: <a href="https://github.com/HyDROSLab/EF5">CREST/EF5</a></div> |
| </div> |
| <script src="shared.js"></script> |
| <script>renderNav("index.html");</script> |
| </body> |
| </html> |
|
|
