2 pièce(s) jointe(s)
Streetview dans un Div redimensionnable
Salut à tous.
J'essaie d'afficher streetview dans un div qui se redimensionne par un clic:
- A l'ouverture de la page streetview est affiché dans une petite fenêtre en bas à gauche de l'écran
Pièce jointe 153688
- Avec le clic sur un bouton streetview occupe toute la largeur de la page avec une hauteur donnée.
Le problème que quand la Div contenant streetview occupe toute la largeur, ce dernier ne se redimensionne pas automatiquement comme on peu le voir ici:
Pièce jointe 153689
Voila la fonction javascript pour redimensionner la div contenant l'objet streetview:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
| function fun() {
var div1 = document.getElementById("div_streetview");
if (div1.style.width != "400px") {
w = div1.style.width;
h = div1.style.height;
div1.style.width = "400px";
div1.style.height = "250px";
}
else
{
div1.style.width = w;
div1.style.height = h;
}
return false;
} |
Puis je fais appel à la fonction par un onclick sur mon bouton
J'ai vu qu'il existait l'évènement resize pour la classe StreetViewPanorama mais je trouve très peu d'exemple:
Code:
google.maps.event.trigger(panorama, 'resize')
Je l'ai donc intégré de cette facon mais sans résultat:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
| // On initialise StreetView et on l'affiche dans le div 'div_streetview'
var optionsPanoramiqueStreetView = {
position: centrePigman,
pov: {
heading: 300,
pitch: 0,
zoom: 1,
}
};
var panoramiqueStreetView = new google.maps.StreetViewPanorama(document.getElementById('div_streetview'), optionsPanoramiqueStreetView);
google.maps.event.addListener(panoramiqueStreetView, "position_changed", function() {
google.maps.event.trigger(panoramiqueStreetView, 'resize');
});
map.setStreetView(panoramiqueStreetView); |
Il est à noter que si je déplace pegman sur la carte ou que je clique sur les flèches de déplacement dans streetview, alors à ce moment là streetview occupe toute la largeur du div.
Merci de votre aide