pixi-viewport

pixi-viewport copied to clipboard

I would like to be able to do an animated zoom of the viewport, when I start moving around (dragging and two-finger scroll on a touch pad). I've concluded that I can use the event drag-start to initiate the zoom, and the event drag-end to zoom back to the original state, but how can I support two-finger scroll (there is only a moved-end event)?

Also, I would like to use something like GSAP to do the animation, however there are no zoom members that can be animated. I've tried using viewport.snapZoom, but it does not animate, even when configured to do so.

Thank you for a great product

The two-finger drag is part of the pinch plugin. You can listen for pinch-end if you're looking for when the user stops manipulating the viewport using pinch.

snapZoom is broken. Not sure what happened, but I'll fix it and add tests (I've been slowly adding tests for all the components). I'll let you know when that's done.

To help you animate, I added viewport.scaled to v4.1.1. This is a helper variable that calls viewport.setScale(value true). It should make it easier for you to animate the viewport. But snapZoom is probably what you're looking for, as it (used to) handle animating to a certain zoom. It also has built-in interrupt, so when the user is dragging/pinching the viewport, it would pause until the let go.

Try v4.1.2. I fixed snapZoom() (it had old code for the easing function). Try it and let me know if you have any questions.