在 KineticJS 中放大鼠标位置答案

【问题标题】：Zoom in on mouse position in KineticJS在 KineticJS 中放大鼠标位置
【发布时间】：2012-10-02 23:15:57
【问题描述】：

问题：

如何在鼠标滚轮滚动时放大鼠标位置？

详情：

我正在尝试将 Stack Overflow 上的 this complete solution 与允许缩放舞台的 this incomplete solution 合并，后者允许在单击时围绕鼠标进行放大。我已经分叉了 jsfiddle 代码here。代码放大后就可以正常工作，但是在第一次滚动时，舞台会跳转到不同的位置，我不知道为什么。谁能告诉我为什么会这样，以及如何解决它。谢谢。

【问题讨论】：

标签： javascript html5-canvas kineticjs

【解决方案1】：

只是猜测，但您使用的是相对于页面而不是画布的鼠标位置

【讨论】：

【解决方案2】：

当您缩放时，鼠标位置下的位置会发生变化（跳跃的原因）。要将位置移回其原始位置，您需要平移偏移量（先前位置与新位置之间的差异（缩放后））。为了避免舞台跳转到不同的位置，您可以使用 KineticJS 的stage.setOffset 函数。

JSFiddle：http://jsfiddle.net/rpaul/ckwu7u86/3/

【讨论】：