Pinch to zoom


#1

Hey guys,

Just wondering if anyone had any success in using the ported Hammer.js like functionality in Ionic to build pinch to zoom functionality?


Images with pinch zoom
#2

Hey @coen_warmer, I’m not sure what the status is with this. @andytjoslin or @max probably has a good idea though…


#3

I’ve noticed the Zynga scroller that’s been ported to Ionic also has the functionality to zoom in and out.

Specifically I’m looking for a way to implement a zoomable map that has clickable hotspots on it. Looking for the right approach here: Hammer js+css or Zynga or a combination of the two. Would be super helpful if @andytjoslin or @max could weigh in on this?


#4

Hey @coen_warmer. The Zynga scroller definitely supports it. I made an issue for this and assigned it to myself, so I’ll take a look! https://github.com/driftyco/ionic/issues/679


#5

Awesome @max, thanks!


#6

Seems like efforts to expose pinch to zoom in the Zynga scroller have stalled a bit at the moment.

Anybody have any experience yet in using pinch to zoom to zoom in on an element in an Ionic project? By using CSS maybe?


#7

See : Slide box pinch and zoom images


#8

Hi,
I’d like to show you guys a little demo I’ve made : Slide box pinch and zoom images
Feel free to improve the code.


#9

So how is it supposed to work? I’ve got it on an iPad (wrapped in Cordova) and can’t get it d anything. It won’t zoom or move at all.


#10

Since our app features a facebook like card interface, I would be highly interested in a possibility to display images fullscreen supporting pinch to zoom. I can open the image in the webview, so this will be handled by the webview itself, but since iPhones don’t have a dedicated back button this is not feasible.

Any ideas?


#11

There is still an open issue to support pinch / zoom in Ionic but the devs are working on more core functionality right now.


#12

That’s fine. Since the event our app covered took place last weekend, I have no more time constraints and can start tickling with the code myself :wink:


#13

I saw some activity on this issue at GitHub. Is this feature ready to be used in production?


#14

If you don’t want to use zynga, you can also do it with everything Ionic offers!
I created a simple tutorial showing How To Create An Advanced Ionic Gallery with Image Zooming like seen in the Facebook app, maybe this can be an alternative for your problem.