Un problème d'infobulles avec Api Google Map V3
Posté : 12 juin 2013, 15:47
Bonjour à tous,
Cette catégorie devrait convenir, je n'en vois pas de plus appropriée...
J'ai un souci avec l'API Google map V3 : trois points à placer, une carte qui s'adapte à ces trois points, l'affichage d'un marqueur, titre et infobulle.
Je suis parti du script d'un forum, tout fonctionne, sauf l'affichage des infobulles. Elles se placent toujours au même endroit, et leur contenu reprend toujours la même chose.
Le code :
Je pense que je ne place pas bien le passage avec "Infowindow" (partie un peu isolée) ... Quelqu'un verrait-il une solution ?
David.
Cette catégorie devrait convenir, je n'en vois pas de plus appropriée...
J'ai un souci avec l'API Google map V3 : trois points à placer, une carte qui s'adapte à ces trois points, l'affichage d'un marqueur, titre et infobulle.
Je suis parti du script d'un forum, tout fonctionne, sauf l'affichage des infobulles. Elles se placent toujours au même endroit, et leur contenu reprend toujours la même chose.
Le code :
Code : Tout sélectionner
<script type='text/javascript' src='http://maps.google.com/maps/api/js?sensor=false'></script>
<style type='text/css'>
#map {
width: 650px;
height: 300px;
margin-bottom:20px;
color:black;
}
</style>
<script type="text/javascript">
function initialisation() {
var tableauLieux = [
["Alfa",47.325371,1.044195,"contenu infobulle un"],
["Bravo",47.345627,0.894806,"contenu infobulle deux"],
["Charlie",47.334488,0.944717,"contenu infobulle trois"],
];
var optionsCarte = {
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var maCarte = new google.maps.Map(document.getElementById("map"), optionsCarte);
var bounds = new google.maps.LatLngBounds();
for (var i = 0; i < tableauLieux.length; i++) {
var Lieu = tableauLieux[i];
var pointLieu = new google.maps.LatLng(Lieu[1], Lieu[2]);
bounds.extend(pointLieu);
var marqueurLieu = new google.maps.Marker({
position: pointLieu,
map: maCarte,
title: Lieu[0]
});
var infoWindow = new google.maps.InfoWindow({
content : Lieu[3],
position : pointLieu
});
google.maps.event.addListener(marqueurLieu, 'click', function() {
infoWindow.open(maCarte,marqueurLieu);
});
}
maCarte.fitBounds(bounds);
}
google.maps.event.addDomListener(window, 'load', initialisation);
</script>
<div id='map'></div>
David.