交互与命中
GPU 表面没有 DOM 节点,也没有 isPointInPath。命中必须自己把指针从 CSS 换到 NDC / 世界,再走 CPU 空间索引或 ID 缓冲。相机、overlay、读屏全部共用 同一套矩阵,不要 CSS transform: scale 整张 canvas 冒充相机。
这一章覆盖什么
- 指针到 NDC
- GPU ID 拾取 vs CPU 索引
- 视图 / 投影与锚点缩放
- DOM overlay 对齐
- GL canvas 的无障碍
文档清单
| 文档 | 解决的问题 |
|---|---|
| 指针到 NDC | client → CSS → NDC;不要 offsetX |
| GPU 拾取与 ID 缓冲 | 1×1 读 ID vs 空间索引;热路径不要读整图 |
| 相机与锚点缩放 | view/proj、锚点缩放、禁止 CSS scale canvas |
| Overlay 与 HTML 叠加 | getBoundingClientRect + 同一套相机矩阵 |
| GPU 无障碍 | 没有对象树;DOM overlay / 隐藏列表;role=img 只够静态 |
约定
- 场景图留在 CPU。GPU 拾取只返回 id,不要从像素反推业务对象。
- 默认 drawing buffer 左下原点;读 ID 必须翻 Y,见 NDC 与 Y 轴。
- 2D 命中心智(逆矩阵、空间索引)仍适用,光栅器换成 GL 而已,见 Canvas 命中。
核对日期:2026-08-26