HTML5画布缩放鼠标坐标的位置

如何使用鼠标坐标所在的图形缩放背景图像

使用鼠标事件鼠标滚轮仅在中心缩放

me代码：

具有mousedown和mousemove事件的图形

---

我需要像谷歌地图一样缩放鼠标在图像上的位置。注释代码和演示：

---

很好，但是如果我想缩放和改变位置，这个例子只适用于开始改变位置

// clear the canvas

ctx.clearRect(0,0,canvas.width,canvas.height);

// save the context state

ctx.save();

// translate to the coordinate point you wish to zoom in on

ctx.translate(mouseX,mouseY);

// scale the canvas to the desired zoom level

ctx.scale(scale,scale);

// draw the image with an offset of -mouseX,-mouseY
// (offset to center image at the selected zoom point);

ctx.drawImage(img,-mouseX,-mouseY);

// restore the context to its untranslated/unrotated state

ctx.restore();