最近,我决定深入研究HTML5和画布的世界,我遇到了一个我无法弄清楚如何解决的问题。
我正在使用 this question 中提到的缩放技术,因为我需要能够放大到特定点。
但是,我遇到的问题是当您放大某个区域,然后执行大鼠标移动,然后缩小。整个视点和对象都会出现偏斜。 (之前占据整个画布的对象现在部分或有时根本不可见。)
我假设朝向点功能的放大是在缩小时使用鼠标位置,这导致了这些问题。
这是一个了解问题的演示: (再次重现,只需放大鼠标移动合理距离并缩小)
答案 0 :(得分:3)
这是按设计工作的。当您根据鼠标位置应用上下文转换时,它将以该位置为中心缩放。
为了实现固定的缩小行为,我认为您需要在放大时仅设置mouseX和mouseY,然后使用最后一个mouseX / mouseY(或者可能是画布的中心或其间的某个点)缩小。