Javascript（jQuery）限制元素内的鼠标移动速度

Question

任务是画一条曲线ob画布。问题是如果鼠标移动太快，则跳过坐标并且不捕获坐标。 （Html5/Js canvas capturing mouse coords when it moves fast - 我以前的帖子..）

是否有跨浏览器方式限制元素（div，canvas等）内的鼠标速度？

Answer 1

我认为通过“限制鼠标速度”实际上意味着启用捕获大量鼠标事件，以便您获得鼠标路径的更详细信息或分辨率。

在鼠标事件方面，浏览器通常会处于高级别。系统将捕获鼠标事件，但浏览器将执行许多其他任务，例如推送事件，冒泡等等，并且只捕获当前鼠标位置。

为了弥补这一点，你需要使用各种技巧，例如样条线。

可能的解决方法

我不打算对此作出广泛的回答，因为它很快就会超出范围，无法完成样条方法所需的步骤和场景（插值，需要相对角度跟踪，平滑的膝盖断裂）等）。

但是，有一个名为 Pointer Lock API 的新API（请参阅该链接中的演示和来源），它允许浏览器在更靠近系统的较低级别工作，因此它可以比其他方式更快地产生鼠标事件并且音量更高。

与所有低级方法一样，它确实有一些缺点：

• 您需要渲染自己的光标
• 鼠标移动不仅限于边缘，因此您需要提供包装或限制自己
• 它将请求用户许可
• 并非所有浏览器都支持
• 它比游戏应用程序更适合游戏和3D

但是这是最接近大量鼠标事件而没有插值等的。