Catégories:
Bonjour
est il possible de modifier les infos bulles (dans leur aspect) de gmap ?
merci pour votre aide
- Vous devez vous identifier ou créer un compte pour écrire des commentaires
Bonjour
est il possible de modifier les infos bulles (dans leur aspect) de gmap ?
merci pour votre aide
Oui, par contre il faut mettre les mains dans le camboui car ce n’est pas géré par le module de drupal.
Il existe une librairie qui permet de remplacer l’appel a InfoWindow par un extInfoWindow :
exemples ici http://gmaps-utility-library.googlecode.com/svn/trunk/extinfowindow/rele…
documentation ici http://gmaps-utility-library.googlecode.com/svn/trunk/extinfowindow/rele…
et source ici : http://gmaps-utility-library.googlecode.com/svn/trunk/extinfowindow/rele…
Bon courage !
SebCorbin
71
ok merci pour ta réponse, j’avais déja repéré ces docs. Ca va être chaud, quand j’aurai compris le système (si j’y arrive), je posterai la procédure, ça peut aider quelqu’un d’autre. Bon, j’y vais !
sergio634
9
Voici un petit début (il faut ajouter le js source) qui te fera sûrement avancer plus vite…
Le javascript qui permet d’override l’action d’un clic
/** Ajout de fonction à l'evenement click d'un marker
**/
Drupal.gmap.addHandler('gmap', function(elem) {
var obj = this;
obj.bind('clickmarker', function(marker) {
//affichage de la popup
if (marker.popup) { // marker.popup à définir/passer en php
var map = Drupal.gmap.getMap( 'auto2map'); //récupération de la map
marker.marker.openExtInfoWindow(
map.map,
"info_window", //classe CSS utilisée
marker.popup, //texte à insérer
{paddingY: 50} //décalage CSS
);
if( marker.dernier == "1") {
lastMarker = marker ;
var map = Drupal.gmap.getMap( 'auto2map');
ajax_getMeteo( marker, '#MeteoBateauContainer', map);
if( $('#sliding').css('display') == 'none')
$('#sliding').css('display', 'block') ;
}
}
return;
});
});
Le CSS qui va avec :
#info_window{width: 300px;
margin-left: 65px;
}
#info_window_contents{
background: url('./bg.png');
color: #FFF;
}
#Text #info_window_contents table{
color: #FFF;
background: transparent;
}
#Text #info_window_contents table td, #Text #info_window_contents table tr, #Text #info_window_contents table tbody{
border: none;
}
#info_window_beak{
width: 120px;
height: 48px;
background: url('./beak.png');
}
* html #info_window_beak{
/* Alpha transparencies hack for IE */
background-image:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='./beak.png', sizingMethod='crop');
}
#info_window_tl{
background: url('./tl.png');
width: 6px;
height: 7px;
}
#info_window_tr{
background: url('./tr.png');
width: 6px;
height: 7px;
}
#info_window_bl{
background: url('./bl.png');
width: 7px;
height: 8px;
}
#info_window_br{
background: url('./br.png');
width: 6px;
height: 8px;
}
#info_window_r, #info_window_l{
background: url('./bg.png');
width: 7px;
}
#info_window_t, #info_window_b{
background: url('./bg.png');
height: 8px;
}
#info_window_close{
background: url('./close.png');
width: 14px;
height: 14px;
margin-top: 5px;
margin-left: -5px;
cursor: pointer;
}
SebCorbin
71
Salut alkaaran, pourrais-tu donner plus d’infos sur les fichiers à modifier (où ajouter le code javascript, etc…)
Merci d’avance !
Guillaume
Guillaume78
26