PhotoSphere Support

Any plans on adding support for PhotoSphere images (Those 360 degree pics where you move the phone around like you are inside the sphere)?

Comments

  • Oh, and what about video?

  • acrylian Administrator

    No plans (and I never heard of photoSphere). But you can setup your theme or create plugins for everything. Just recently a user made a site using some panoramic photo display: https://clatique.fr.

    Video and audio is already supported via plugins.

  • Hello, what you want is so easy with zenphoto. No need for a new plugin.
    I do it like mentioned by acrylian :
    on your mobile, landscape mode, use the square for full screen and the compass for enabling smartphone movment.
    Use this link

    https://clatique.fr/multimedia/index.php?album=Villes/Cul-Du-Cerf&image=P-C-Cerf3.txt

    In zenphoto, in your album, for each 360° picture, simply use a txt file containing this kind of code :

    iframe width="800" height="530" allowfullscreen style="border-style:none;" src="path-to/pannellum.htm#panorama=Path-to/your-picture.jpg&autoLoad=true&hfov=100&maxHfov=100&minHfov=30&vaov=128&yaw=190&minPitch=-90&maxPitch=35&pitch=-40&autoRotate=-5">/iframe

    Note < and > are missing in my code, because otherwise, I cannot show you that code

    A better way is to use json files : more options with pannellum (free).
    https://pannellum.org/

    You add a jpg picture named like your txt file for the thumbnail.
    More examples here ... thank you Zenphoto ...
    https://clatique.fr/multimedia/index.php?album=Themes/theme-pano-aerien.alb

    Of course, all mobile do not have gyroscope function - maybe you call it movement detection. In that case, you have to use your finger to move around the picture.

  • acrylian Administrator

    Thanks for describing what you did, @ctdlg. To add no new plugin is needed but the included textobject plugin must be activated to be able to do it this general purpose way.

    Note < and > are missing in my code, because otherwise, I cannot show you that code

    Why do you need to do this? That must be specifitic to your usage. We use the same way on our site for some Youtube videos.

  • Concerning < and >, its because if I add them to the code above, nothing is displayed. In other words, the iframe code is between <>

  • acrylian Administrator
    edited October 2018

    Ah okay, now I get it, it is because of the forum only. Sorry ;-)

    You can use backticks to escape code to show up:

    <iframe> width="800" height="530" allowfullscreen style="border-style:none;" src="path-to/pannellum.htm#panorama=Path-to/your-picture.jpg&autoLoad=true&hfov=100&maxHfov=100&minHfov=30&vaov=128&yaw=190&minPitch=-90&maxPitch=35&pitch=-40&autoRotate=-5"></iframe>

    Somehow the normal Markdown code escaping by spaces or tabs does not work here

  • Thanks for the markdown tip (Alt gr 7) on my keyboard.

    <iframe> width="800" height="530" allowfullscreen style="border-style:none;" src="path-to/pannellum.htm#panorama=Path-to/your-picture.jpg&autoLoad=true&hfov=100&maxHfov=100&minHfov=30&vaov=128&yaw=190&minPitch=-90&maxPitch=35&pitch=-40&autoRotate=-5"></iframe>

    You get a bunch of extra parameters using a json file compared to the above html code. See pannelum help :
    https://pannellum.org/documentation/reference/
    You can add links, hotspots.
    This means you can use one single zenphoto page,
    add some music that will loop and play upon request, and without leaving your zenpage, you will be able to navigate inside all your panos. I'm starting this kind of page. It will be available in December ( many panos are missing right now in my gallery)

Sign In or Register to comment.