Ajout de Hotspots (bouton plein écran)

Transcription

1 Ajout de Hotspots (bouton plein écran) Nous allons tout d'abord ajouter un bouton permettant de passer en mode plein écran. Pour cela il faut modifier le fichier pano.xml de la manière suivante : par rapport au fichier précédent les lignes suivantes ont été ajoutés : <hotspots> début de la définition des hotspots <global> début des définitions globales à appliquer aux hotspots (voir plus loin) <spot Définition d'un hotspot id="btn_plein_ecran" id ou nom du hotspot (chaque id doit être unique)

2 url="common/black_f.png" lien vers l'image du hotspot alt="mode Plein Ecran (on/off)" info bulle affichée lorsque la souris passe sur le hotspot (vient du plugins tooltips) static="1" le hotspot sera fixe sur la fenêtre (il ne tournera pas avec la rotation du panoramique) salignx="0.45" saligny="0.45" coordonnées du hotspot suivant le schéma suivant : staticx staticy (-0,5-0,5) (0,5-0,5) (0 0) (-0,5 0,5) il sera donc placé en bas à droite sur le panoramique (0,5 0,5) onclick="fullscreen()" action exécutée lors du clic sur le hotspot ici passage en plein écran /> fin de la déclaration du hotspot </global> </hotspots> fin des déclaration des hotspots

3 si le passage en plein écran ne fonctionne pas il convient en premier lieu de vérifier si la variable allowfullscreen dans le fichier HTML est bien fixée à true sinon la modifier.

4 Ajout de Hotspots (passage d'un panoramique à un autre) Nous allons voir maintenant comment passer d'un panoramique à un second et retour. Voici tout d'abord le code :

5 <spot id="hs_base_0" définition de l'id ou du nom (unique dans le fichier.xml) url="common/hs.gif" définition de l'image du hotspot ici un cercle linked="jacques" le hotspot est lié au panoramique «jacques» il n'apparaîtra donc que dans celui ci pan="-121" tilt="-4" positionnement du hotspot (pan=gauche/droite de (-180 à 180 ) tilt=haut/bas (de -90 nadir à 90 zénith),ces paramètres sont à définir à tâtons ou en utilisant le plugins editor (voir plus loin) taille du hotspot scale="1.7" tintcolor="#ff8800" couleur du hotspot au format hexadécimal RRGGBB chacun des trois termes (RR, GG ou BB) variant de 00 à FF alpha="0.3" transparence du hotspot de 0 à 1 alt="entrez dans le 'Canadair'" info-bulle (du plugins tooltips.swf)

6 onover="change:-,alpha,1,200;change:-,scale,3.5,100;" comportement lors du passage de la souris sur le hotspot ici : changement de la transparence de 0,3 -> 1 en 200ms et de la taille de 1,7 -> 3,5 en 200 ms onout="change:-,alpha,0.3,200;change:-,scale,1.7,100;" comportement lorsque la souris quitte le hotspot ici : retour de la transparence à 0,3 et de la taille à 1,7 onclick="loadpano(panoname=canadair&pan=0.0;)" affichage du nouveau panoramique dans le même format que le précédent (six fichiers «canadair_0.jpg» à «canadair_5.jpg» avec placement de la vue avec le paramètre pan à 0, /> fin de la description du hotspot

7 Définition des paramètres pan et tilt : utilisation du plugins editor.swf Cet éditeur s'affiche en rajoutant une clause layer_n=plugins/editor.swf (N étant un nombre non existant dans la liste des layer) :

8 il permet de manipuler les objets présents dans le fichier pano.xml : 1) choisir l'élément à modifier dans la liste déroulante 2) a l'aide des flêches devant pan et tilt déplacer le hotspot jusqu'à l'emplacement désiré 3) définir la taille de l'image à l'aide scalex et scaley il fonctionnent ensemble si la case est cochée et indépendamment (déformation de l'image) sinon 4) copier les paramètres à l'aide du bouton copy XML : 5) coller tout ceci dans votre éditeur favori. (ne pas oublier de recopier les paramètres linked, onover onout, onclick, alt car ceux-ci disparaîssent dans cette version de l'éditeur) en jaune le code créé par editor et en dessous le code initial

9 l'autre solution est de noter les paramètres modifiés est de les introduire manuellement dans la définition du hotspot (lorsque je modifie juste des paramètres span tilt et scale c'est la solution que j'emploie) 6) effacez l'ancienne définition de l'objet (sinon définition en double et le pano ne fonctionne plus) si vous avez fait un coller dans le fichier. cet éditeur permet d'éditer de très nombreux paramètre il est encore en développement et présente encore des imperfections (notamment pour l'affichage des paramètres effect des spot il est impossible de voir la liste complète. Personnellement j'utilise pspad (il est gratuit mais uniquement pour PC) comme éditeur pour les fichiers xml, mais bien d'autres existent.