Accueil > Créez votre site web > Ajouter un panoramique interactif avec PTViewer

Créez votre site web : Ajouter un panoramique interactif avec PTViewer

Créé le 9 novembre 2009. Dernière modification le 17 mars 2013
 

Chapitre précédent : Ajouter un diaporama avec FancyBox

PTViewer est un applet java qui permet de visualiser des panoramiques. Cet applet est intégré au squelette depuis la version 3.4 du squelette. Il permet de visualiser des panoramiques interactifs à l’intérieur d’une fenêtre Fancybox. L’album Le Jocou contient de tels panoramiques.

Les panoramiques, assemblage de plusieurs photos se recouvrant partiellement, peuvent être fait avec le logiciel libre Hugin qui est disponible pour Linux, Windows ou Mac. Un tutoriel en français peut être trouvé ici.

Quand on ouvre le panoramique il défile automatiquement. Plusieurs possibilités existent pour se déplacer à l’intérieur du panoramique.

  • Soit en déplaçant la souris avec le bouton de gauche appuyé,
  • soit avec les flèches du clavier,
  • soit avec les boutons présents en bas de l’image. Ces boutons permettent aussi de zoomer dans l’image.

Par rapport à la version précédente la version 4.0 du squelette intègre une fenêtre d’explication sur l’utilisation des panoramique interactif qui apparait au premier survol par la souris d’un panoramique. Cette fenêtre disparait automatiquement au bout de 15 secondes. Cette fenêtre utilise jquery-toastmessage. Elle est gérée par le fichier "inc-entete-toastmessage.html" du squelette qui peut être modifié si nécessaire.

En fonction de la largeur du champ de vision du panoramique l’intégration de celui-ci dans la page se fera de façon légèrement différente.

Pour ceux qui seraient intéressés par des détails techniques sur la manière dont est utilisé PTViewer et sur les différents types de projections ils pourront se reporter aux 2 pages suivantes (en anglais) PTViewer Documentation et Partial Panoramas and Flat Images.

Panoramique 360°

C’est le cas le plus simple. La projection utilisée pour créer le panoramique doit être une projection équirectangulaire. Ce paramètre est choisi dans l’onglet "Assembleur" de Hugin. Il faut ajouter le panoramique avec "Ajouter une image ou un document" :
Il suffit ensuite de l’appeler dans la texte de la page avec :

<imgxxx|pano_360>


L’angle vertical sera calculé automatiquement et peut ne pas être 180°.

Panoramique compris entre 100° et 360°

Dans ce cas il faudra, en plus indiquer l’angle du champ de vision horizontal. La projection devra être une projection équirectangulaire, comme pour le panoramique 360°. Le panoramique s’ajoute de la manière décrite précédemment et est appelé dans le texte de la page avec

<imgxxx|pano_sup_100|ViewAngle=yyy>


Dans ce qui précède yyy est l’angle horizontal du panoramique que l’on peut récupérer dans l’onglet "Assembleur" de Hugin :

Cette valeur sera éventuellement à ajuster de quelques degrés pour éviter de déborder lorsque l’on se déplace dans le panoramique.

Panoramique inférieur à 100°

Dans ce cas il faudra indiquer les angles de vue horizontal et vertical et la projection devra être une projection rectilinéaire. Le panoramique, ajouté de la manière habituelle, sera appelé dans le texte de la page avec

<imgxxx|pano_inf_100|ViewAngle=yyy|VertAngle=zzz>


Dans ce qui précède yyy et zzz sont l’angle de vue horizontal et vertical respectivement. L’angle vertical devra aussi être ajusté à la main pour éviter des effets visuel désagréables dans les coins, dus au fait que PTViewer déforme l’image pour tenir compte des déformations induites par la projection.



Retour en haut de la page