我有一个可以拖动的 HTML 画布上绘制的地图的全屏视口。
我尝试了两种实现拖动动画的方法。
首先，我在画布上设置窗口的宽度和高度，在用户拖动地图时为每个 mousemove 事件重新绘制，平移绘制的元素。但尤其是 firefox 非常生涩，FPS 很低，即使使用 requestAnimationFrame 也是如此。
相反，我尝试在用户拖动时移动画布元素本身。换句话说，在画布上绘制窗口宽度和高度的 3 倍，居中，允许在任何方向上完全拖动，并在每次用户完成拖动时重新绘制。这适用于 chrome，但 IE 和 firefox 只绘制了画布的左上象限。（所以只有当画布被拖到右下角时才能看到任何绘图。）
任何人都可以提出一种检测何时无法使用第二种方法的好方法吗？使用第二种方法，IE 和 Firefox 都$('canvas').attr("width")将画布宽度返回为窗口高度的 3 倍，所以这不是一个选项。
我能想到的唯一选择是在每个浏览器上手动测试第二种方法，并创建一个查找数组，以便代码知道何时回退到第一种方法。
也许有人知道处理这一切的更好方法？
谢谢