Marqueur Google Maps en tant que lien

J'utilise Google Maps pour mon site Web. Comment puis-je utiliser les marqueurs en tant que liens? Je veux dire quand je clique sur un marqueur pour ouvrir un lien particulier.Marqueur Google Maps en tant que lien

Merci d'avance!

Source

2010-06-16 Dimitar Vouldjeff

C'est en fait très facile à faire. Attachez simplement un gestionnaire d'événement à votre marqueur, puis lancez le lien en définissant window.location.href sur votre URL. Consultez les exemples suivants, qui je pense devrait être explicite:

Utilisation du v3 API:

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
    <title>Google Maps Marker as a Link</title> 
    <script src="http://maps.google.com/maps/api/js?sensor=false" 
      type="text/javascript"></script> 
</head> 
<body> 
    <div id="map" style="width: 500px; height: 400px;"></div> 

    <script type="text/javascript"> 
    var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 2, 
     center: new google.maps.LatLng(35.55, -25.75), 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }); 

    var marker = new google.maps.Marker({ 
     position: map.getCenter(), 
     url: 'http://www.google.com/', 
     map: map 
    }); 

    google.maps.event.addListener(marker, 'click', function() { 
     window.location.href = marker.url; 
    }); 

    </script> 
</body> 
</html>

En utilisant les V2 API:

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Google Maps Marker as a Link</title> 
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false" 
      type="text/javascript"></script> 
    </head> 
    <body onunload="GUnload()"> 
    <div id="map" style="width: 500px; height: 400px;"></div> 

    <script type="text/javascript"> 
     var map = new GMap2(document.getElementById("map")); 
     var centerPoint = new GLatLng(35.55, -25.75); 
     map.setCenter(centerPoint, 2); 

     var marker = new GMarker(map.getCenter()); 
     marker.url = 'http://www.google.com/'; 
     map.addOverlay(marker); 

     GEvent.addListener(marker, 'click', function() {  
     window.location.href = marker.url; 
     }); 
    </script> 
    </body> 
</html>

Les exemples ci-dessus ajoutera un marqueur quelque part dans le océan Atlantique. Lorsque vous cliquez dessus, vous serez redirigé vers un moteur de recherche populaire.

Source

2010-06-17 03:36:01

Merci mec! –

Hey +1 ajouté dûment, mais si vous voulez ouvrir ce lien dans une nouvelle fenêtre, j'ai essayé window.open = marker.url; puis un attribut comme url: "http://www.google.com", cible: "_blank" à l'objet marqueur mais en vain, – defau1t

Pour obtenir cette option pour ouvrir dans un nouvel onglet ajouter ce qui suit juste après la "window.location.href = marker.url;":

window.open(this.url, '_blank');

Alors vous auriez:

google.maps.event.addListener(marker, 'click', function() { 
     window.location.href = marker.url; 
     window.open(this.url, '_blank'); 
    });

Source

2016-12-15 23:40:54 moorewebx

Marqueur Google Maps en tant que lien

Répondre

Questions connexes