将HTML5画布缩放到鼠标光标
画布始终从其当前原点开始缩放。默认原点为[0,0]。如果要从另一个角度进行缩放,则可以先执行ctx.translate(desiredX,desiredY);。这会将画布的原点重置为[desiredX,desiredY]。
该translate()
方法重新映射画布上的(0,0)位置。该scale()
方法将当前图形放大或缩小。如果要translate()
通过偏移量到达画布上下文,则需要先将scale()
其放大或缩小,然后再translate()
返回与鼠标偏移量相反的位置。
下面的示例中给出了这些步骤
ctx.translate(pt.x,pt.y); ctx.scale(factor,factor); ctx.translate(-pt.x,-pt.y);