排水法测体积 · 交互演示
用途
生成一个单文件 HTML 交互演示页，用于课堂讲解「排水法测体积」：
- 长方体容器里有部分水（蓝色）。
- 乒乓球（或其他轻物体）漂浮在水面。
- 用一根吸管把球刚好浸没，水面上升。
- 上升的那层水用红色标出，并配公式说明「红色水体积 = 乒乓球体积」。
页面纯前端、无外部依赖，双击即可在 Windows / Mac 的任意浏览器打开，适合投屏或发给学生。
何时使用
- 用户要求做「排水法」「浸没法」「物体体积 = 排开水的体积」相关可视化。
- 用户是小学/初中老师，需要课堂可逐步播放、可拖动演示的动画。
- 用户要求把这类演示「封存成 skill / 做成可复用模板」。
使用方法
- 将打包好的模板页复制到工作区并重命名：
assets/pingpong-displacement.html→ 工作区排水法测体积.html。 - 若需改尺寸/配色，直接编辑复制后的 HTML（见下「可定制项」），不要改 assets 里的原始模板。
- 用
present_files把成品 HTML 交给用户预览/下载。
默认交互控件（已在模板中实现，无需重写）：
- ▶ 自动演示：自动把球压下去、水面升起。
- 上一步 / 下一步：定格在「漂浮 → 下压中 → 刚好浸没」三帧。
- 手动滑块：自由拖动，看红色区域随下压变厚。
- ↺ 重置：回到初始漂浮状态。
可定制项（在复制后 HTML 的 <script> 顶部常量区修改）
| 常量 | 含义 | 默认值 |
|---|---|---|
C.wCm / C.hCm |
容器长 / 高（cm） | 8 / 15 |
depthCm |
容器宽/深（cm，仅用于底面积公式） | 4 |
rCm |
乒乓球半径（cm） | 2.5 |
h0Cm |
初始水深（cm） | 9 |
SCALE |
每 cm 对应像素 | 20 |
修改后无需改公式：Vball、dHcm（上升高度）、右侧读数都由这些常量自动算出。
颜色常量在 draw() 内：#4aa8ff(蓝水)、#e53935(红水)、#ff8f3c(球)、#cfd8e3(吸管)。
教学提示（务必向学生说明）
乒乓球密度约 0.08 g/cm³，漂浮时只排开约 2.7 cm³ 的水（占自身体积很小），
因此把「上升的水体积」近似看作小球体积即可。模板右下角已注明此简化，
若要做严谨版，可把红色区域高度按 Vball - 漂浮排开水 修正（差值很小）。
资源
assets/pingpong-displacement.html：可直接复制使用的演示页模板（已含完整 Canvas 动画与控件）。
