跳到主要内容

交互与命中

GPU 表面没有 DOM 节点,也没有 isPointInPath。命中必须自己把指针从 CSS 换到 NDC / 世界,再走 CPU 空间索引或 ID 缓冲。相机、overlay、读屏全部共用 同一套矩阵,不要 CSS transform: scale 整张 canvas 冒充相机。

这一章覆盖什么

  • 指针到 NDC
  • GPU ID 拾取 vs CPU 索引
  • 视图 / 投影与锚点缩放
  • DOM overlay 对齐
  • GL canvas 的无障碍

文档清单

文档解决的问题
指针到 NDCclient → 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