17

我想在浏览器中写一些东西来记录触控板上的手势。

由于我希望能够跟踪所有运动而不必担心指针离开窗口,因此我首先研究了这个问题并使用MDN Pointer Lock API 演示作为起点。

但是我注意到在 MacBook 上使用此演示时,如果我抬起手指并在触控板上的其他位置开始新的拖动,它会忽略我的手指在空中移动的距离,它只计算我的手指触摸触控板时所做的动作. 这与一般操作系统中使用触控板移动鼠标指针的方式是一致的。

但对于我的具体应用,我希望我的手指在触控板上有绝对的x 和 y。是否可以构建上面链接的演示的变体,其中红点对应于您手指的绝对位置?例如,如果您抬起手指然后将其放在左上角,红点总是会跳到画布的左上角?

我知道 javascript Touch Events API,它在平板电脑上使用时提供绝对坐标,但是当在 MacBook 上运行 Firefox (v36) 或 Chrome (v41) 时,演示不会注册任何触控板输入。

我还读到可以在 Chrome 中启用触摸仿真,尽管我在我的版本下找不到执行此操作的复选框(也许只有特殊的开发人员版本才有此功能)并且通过阅读它,它似乎更像是鼠标-to-touch 翻译,所以我怀疑该仿真是否会对触控板提供特定支持。

有什么方法可以通过 HTML/Javascript 获取 MacBook 触控板上触摸事件的绝对 x,y 坐标?

4

1 回答 1

1

我真的不相信你能让触控板按照你想要的方式工作。请记住,触控板应该充当鼠标,就像一个扁平的轨迹球。可以将其想象为每次滑动手指时手指都会推动光标,然后每当您按下触控板时将光标置于手指下方。

除非您能够将触控板 1:1 映射到屏幕上,就像 Wacom 数位板那样,触控板与屏幕没有关联;它只知道鼠标。

Chrome(版本 46.0.2490.71 m)中,您可以通过在仿真模式下启用它来模拟触摸事件:

  1. 打开开发工具F12
  2. 单击左上角的电话图标或按打开更好的控制台Esc
  3. 单击仿真选项卡
  4. 转到Sensors面板
  5. 查看Emulate touch screen

在 Chrome 中启用仿真

于 2015-10-22T20:23:59.640 回答