How to zoom in and zoom out in the canvas?

■ Summary
- The following code snippet demonstrates how to zoom in/out in the canvas.

■ Reference Sites
- http://phrogz.net/tmp/canvas_zoom_to_cursor.html
- http://www.w3schools.com/tags/canvas_scale.asp
var zoom = function(clicks){
   var pt = ctx.transformedPoint(lastX,lastY);
   ctx.translate(pt.x,pt.y);
   
   var factor = Math.pow(scaleFactor,clicks);
   
   ctx.scale(factor,factor);
   ctx.translate(-pt.x,-pt.y);
}

Responses

0 Replies