Duplicar posibles:
Zoom in on a point (using scale and translate)zoom sobre un punto fijo, Javascript/lienzo
Quiero aplicar el zoom en el puntero del ratón con la rueda del ratón. Eso es escalar la imagen mientras el punto debajo del puntero del mouse permanece fijo.
Aquí está mi código, que no funciona muy bien
var scala = 1 + event.wheelDelta/1000;
canvas.context.translate(-canvas.mouse.x * (scala - 1)/canvas.scale,-canvas.mouse.y * (scala - 1)/canvas.scale);
canvas.context.scale(scala,scala);
canvas.scale *= scala;
//canvas.scale is my variable that is initially set to 1.
//canvas.mouse is my variable that represents the mouse position relative to the canvas
no hace nada, o no se comporta correctamente – Eric
no se comporta correctamente, mouse.x está en coordenadas de la ventana, mientras que traducir utiliza las coordenadas de escala, eso es donde creo que es el problema – csiz
también si uso escala (1.3,1.3); escala (0.7,0.7); el objeto vuelve a la posición original pero 1 * 1.3 * 0.7! = 1 – csiz