L'API Google Maps: ouvrir l'url en cliquant sur le marqueur
Je veux ouvrir une nouvelle fenêtre en cliquant sur un marqueur à l'aide de l'API Google Maps 3.
Malheureusement, il n'y a pas beaucoup d'exemples pour l'API Google Maps et j'ai trouvé ce code:
google.maps.event.addListener(marker, 'click', function() {
window.location.href = marker.url;
});
Comment l'utiliser, quand je créer des marqueurs avec une boucle? J'ai essayé de plusieurs façons sans se le permettre.
C'est mon code, j'ai fait simple et court:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map_canvas { height: 100% }
</style>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var points = [
['name1', 59.9362384705039, 30.19232525792222, 12],
['name2', 59.941412822085645, 30.263564729357767, 11],
['name3', 59.939177197629455, 30.273554411974955, 10]
];
function setMarkers(map, locations) {
var shape = {
coord: [1, 1, 1, 20, 18, 20, 18 , 1],
type: 'poly'
};
for (var i = 0; i < locations.length; i++) {
var flag = new google.maps.MarkerImage('markers/' + (i + 1) + '.png',
new google.maps.Size(17, 19),
new google.maps.Point(0,0),
new google.maps.Point(0, 19));
var place = locations[i];
var myLatLng = new google.maps.LatLng(place[1], place[2]);
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: flag,
shape: shape,
title: place[0],
zIndex: place[3]
});
}
}
function initialize() {
var myOptions = {
center: new google.maps.LatLng(59.91823239768787, 30.243222856188822),
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);
setMarkers(map, points);
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width:50%; height:50%"></div>
</body>
</html>
Comment ouvrir l'url en cliquant sur le marqueur avec le code ci-dessus?
Vous devez vous connecter pour publier un commentaire.
Vous pouvez ajouter une url spécifique à chaque point, par exemple:
Ajouter l'url du marqueur de valeurs dans la boucle for:
Ensuite, vous pouvez l'ajouter juste avant la fin de votre boucle for:
Aussi voir ce exemple.
marker.url
et c'était la redirection vers la dernière url, mais quand j'ai utiliséthis.url
cela a fonctionné merciurl
n'est pas un objet sur le Marqueur de classe. Mais il n'y a rien qui vous empêche d'ajouter que, comme une propriété de la classe. Je devine quel exemple vous avez été à la recherche à n'a que trop. Voulez-vous une URL différente pour chaque marqueur? Ce qui se passe quand vous n':les réponses précédentes n'ont pas fonctionné pour moi bien. J'ai eu la persistance de problèmes par la mise en au marqueur. J'ai donc modifié le code légèrement.
De cette façon fonctionné pour moi!
Vous pouvez créer des Cartes Google maps de routage des liens à partir de votre Datebase pour l'utiliser comme un routage interactif carte.