I try to zoom with mousewheel on a Raphael paper using viewBox. Here is the JSFiddle code.
it works but now i want to zoom in the center and i have no idea where to start. I guess i should change the viewBox x and y coordinates. I have tried this (in the function handle(delta)):
x = paper.width - viewBoxWidth;
y = paper.height - viewBoxHeight;
paper.setViewBox(x,y,viewBoxWidth,viewBoxHeight);
but didnt work. I would appreciate any help. Thank you!
For Zoom Out:
var tempViewBoxWidth = viewBoxWidth;
var tempViewBoxHeight = viewBoxHeight;
viewBoxWidth /= 1.10;
viewBoxHeight /=1.10;
viewBoxX -= (viewBoxWidth - tempViewBoxWidth) / 2;
viewBoxY -= (viewBoxHeight - tempViewBoxHeight) / 2;
paper.setViewBox(viewBoxX, viewBoxY, viewBoxWidth, viewBoxHeight, false);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With