Image Zoom In / Out

Q&A about the latest versions
Post Reply
Ink8455
Posts: 43
Joined: Tue Nov 29, 2016 10:34 am

Image Zoom In / Out

Post by Ink8455 » Tue Jun 12, 2018 7:50 am

My pano allows the user to view 360, with a limited zoom in/out function.
I have numerous still images scattered around each Pano. Each image has an associated text box and a preview thumbnail.
Once selected, the image enlarges and fills the screen.
The still images are static, fixed size on the screen.
I would like to allow the user to be able to zoom in and out of a selected image.


My question is, is it possible to zoom in and out of the selected image once filling the screen?
I accept that there may be limitations on the size and quality of the original still image but the function would help alot.


Many thanks
Last edited by Ink8455 on Wed Jun 13, 2018 6:08 am, edited 1 time in total.

User avatar
Tony
Posts: 487
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Re: Image Zoom In / Out

Post by Tony » Tue Jun 12, 2018 3:44 pm

Hi,

It's possible, here's a quick example of a small popup window but it would certainly work with a fullscreen image. There are a couple of issue with it that I have to work out.

https://s3-ap-southeast-2.amazonaws.com ... index.html

I'm a bit flat out for the coming day but I'll put something together you can use asap.

cheers,

Tony
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: http://tonyredhead.com - http://redsquare.com | roundme: http://round.me/@tonyredhead | instagram: https://www.instagram.com/tonyredhead/

Ink8455
Posts: 43
Joined: Tue Nov 29, 2016 10:34 am

Re: Image Zoom In / Out

Post by Ink8455 » Wed Jun 13, 2018 2:21 am

Perfect!!!!!!

That's exactly what I was trying to acheive.

User avatar
Tony
Posts: 487
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Re: Image Zoom In / Out

Post by Tony » Wed Jun 13, 2018 7:29 am

Hi Ink,

I've just updated the sample project with a fullscreen responsive version. Same URL

https://s3-ap-southeast-2.amazonaws.com ... index.html

The image size is 2,500px x 1568 px

cheers,

Tony
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: http://tonyredhead.com - http://redsquare.com | roundme: http://round.me/@tonyredhead | instagram: https://www.instagram.com/tonyredhead/

Ink8455
Posts: 43
Joined: Tue Nov 29, 2016 10:34 am

Re: Image Zoom In / Out

Post by Ink8455 » Wed Jun 13, 2018 7:38 am

Perfect, THANK YOU!!!!!


How is it done?

User avatar
Tony
Posts: 487
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Re: Image Zoom In / Out

Post by Tony » Wed Jun 13, 2018 7:49 am

Hi,

I will write up a tutorial on how to do it and post it on my website. I'll post here when it's up.

https://tonyredhead.com/tipsandtutorials

Tony
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: http://tonyredhead.com - http://redsquare.com | roundme: http://round.me/@tonyredhead | instagram: https://www.instagram.com/tonyredhead/

User avatar
soulbrother
Posts: 293
Joined: Tue Apr 08, 2008 7:01 pm
Location: München
Contact:

Re: Image Zoom In / Out

Post by soulbrother » Wed Jun 13, 2018 2:26 pm

Tony,

this really looks like the work of a genius, so it´s hard to wait for your tutorial.

This time I will say big THANKS, before I will see your tutorial!

User avatar
Tony
Posts: 487
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Re: Image Zoom In / Out

Post by Tony » Wed Jun 13, 2018 2:30 pm

Hi Soulbrother,

:D Actually it's pretty simple to implement only takes a minute or two.

Tony
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: http://tonyredhead.com - http://redsquare.com | roundme: http://round.me/@tonyredhead | instagram: https://www.instagram.com/tonyredhead/

User avatar
Tony
Posts: 487
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Re: Image Zoom In / Out

Post by Tony » Mon Jul 02, 2018 2:13 pm

Hi,

Quick update to let you know that I've created and published the tutorial on how to implement the zoom/pan fullscreen image.

https://tonyredhead.com/pano2vr/hotspot ... reen-image

This tutorial show you how to create a point hotspot and integrate a third party image viewer application that opens an image that fills the current screen. Once the image has opened the user can then zoom in and out of the image and pan around it using a mouse or by touch on a mobile device.

There is a downloadable zip file with all of the files needed to complete the tutorial.

cheers,

Tony
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: http://tonyredhead.com - http://redsquare.com | roundme: http://round.me/@tonyredhead | instagram: https://www.instagram.com/tonyredhead/

Ink8455
Posts: 43
Joined: Tue Nov 29, 2016 10:34 am

Re: Image Zoom In / Out

Post by Ink8455 » Mon Jul 02, 2018 3:32 pm

Many thanks

User avatar
Tony
Posts: 487
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Re: Image Zoom In / Out

Post by Tony » Tue Jul 03, 2018 4:43 am

Hi,

A comment by Jaroslav Pindora in the Pano2VR User Group on Facebook https://www.facebook.com/groups/Pano2VR ... 216434516/, to my post re the tutorial, made me take another look at how his all Pano2VR solution could be implemented.

I've created a new output and personally I think it works as well, if not better, than the JQuery solution and at no cost.

Here's the new output, I'll be posting a new tutorial shortly.

https://s3-ap-southeast-2.amazonaws.com ... index.html

Tony
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: http://tonyredhead.com - http://redsquare.com | roundme: http://round.me/@tonyredhead | instagram: https://www.instagram.com/tonyredhead/

Ink8455
Posts: 43
Joined: Tue Nov 29, 2016 10:34 am

Re: Image Zoom In / Out

Post by Ink8455 » Fri Jul 13, 2018 8:37 am

Perfect

User avatar
Tony
Posts: 487
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Re: Image Zoom In / Out

Post by Tony » Fri Jul 13, 2018 1:07 pm

Ink8455 wrote:
Fri Jul 13, 2018 8:37 am
Perfect
:D
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: http://tonyredhead.com - http://redsquare.com | roundme: http://round.me/@tonyredhead | instagram: https://www.instagram.com/tonyredhead/

Post Reply

Who is online

Users browsing this forum: No registered users and 12 guests