357 votes

Comment convertir une adresse en un lien Google Maps (PAS MAP)

Après avoir cherché (Googlé) sur le web pendant un certain temps, je n'ai rien trouvé qui prenne une adresse de ce type :

1200 Pennsylvania Ave SE, Washington, District de Columbia, 20003

et le convertit en un lien cliquable :

http://maps.google.com/maps?f=q&source=s_q&hl=en&q=1200+Pennsylvania+Ave+SE,+Washington,+District+de+Columbia,+20003&sll=37.0625,-95. 677068&sspn=44.118686,114.169922&ie=UTF8&cd=1&geocode=FT5MUQIdIDlp-w&split=0&ll=38.882147,-76.99017&spn=0.01064,0.027874&z=16&iwloc=A

jQuery ou PHP de préférence ou simplement toute information utile à ce sujet.

801voto

Chris B Points 7476

Que pensez-vous de ça ?

https://maps.google.com/?q=1200 Pennsylvania Ave SE, Washington, District of Columbia, 20003

https://maps.google.com/?q=term

Si vous avez lat-long, utilisez l'URL ci-dessous.

https://maps.google.com/?ll=latitude,longitude

Exemple : maps.google.com/?ll=38.882147,-76.99017

UPDATE

Depuis l'année 2017, Google dispose désormais d'un moyen officiel de créer des URL Google Maps multiplateformes :

https://developers.google.com/maps/documentation/urls/guide

Vous pouvez utiliser des liens comme

https://www.google.com/maps/search/?api=1&query=1200%20Pennsylvania%20Ave%20SE%2C%20Washington%2C%20District%20of%20Columbia%2C%2020003

1 votes

Je voulais juste le flécher vers le haut.

8 votes

Comment créer avec Latitude et Longitude ?

4 votes

Il semble que cette méthode soit un peu floue si l'utilisateur utilise le nouveau Google Maps. Pour créer un lien qui force la page résultante à s'afficher en mode classique, il suffit d'ajouter &output=classic à votre lien. Donc l'ensemble ressemblerait à ça : http://maps.google.com/?q=1200%20Pennsylvania%20Ave%20SE,%20‌​Washington,%20Distri‌​ct%20of%20Columbia,%‌​2020003&output=class‌​ic

74voto

Michael Jasper Points 4089

Je sais que je suis très en retard, mais j'ai pensé que je pourrais contribuer pour la postérité.

J'ai écrit une courte fonction jQuery qui transformera automatiquement toute <address> en liens Google Maps.

Voir une démo ici.

$(document).ready(function () {
   //Convert address tags to google map links - Michael Jasper 2012
   $('address').each(function () {
      var link = "<a href='http://maps.google.com/maps?q=" + encodeURIComponent( $(this).text() ) + "' target='_blank'>" + $(this).text() + "</a>";
      $(this).html(link);
   });
});

Bonus :

J'ai également rencontré une situation qui nécessitait de générer des cartes intégrées à partir des liens, et j'ai pensé que je pourrais en faire part aux futurs voyageurs :

Voir une démo complète

$(document).ready(function(){
    $("address").each(function(){                         
        var embed ="<iframe width='425' height='350' frameborder='0' scrolling='no'  marginheight='0' marginwidth='0' src='https://maps.google.com/maps?&amp;q="+ encodeURIComponent( $(this).text() ) +"&amp;output=embed'></iframe>";
        $(this).html(embed);             
    });
});

0 votes

@Michael Jasper merci pour votre code...il m'a permis d'avoir la carte dans le div...mais mon problème est que l'information sur l'épingle devient popup...ce que je ne veux pas. donc pouvez-vous me guider comment ne pas ouvrir la boîte d'information sur l'épingle. ?????.merci d'avance....

3 votes

Veuillez noter que le HTML5 <address> n'est pas destiné à fournir une adresse postale, mais à fournir des informations de contact liées au contenu (généralement l'auteur). developer.mozilla.org/fr/US/docs/Web/HTML/Element/address

0 votes

Excellente réponse ! Merci de partager. Je ne suis pas sûr des conséquences à ce sujet mais cela a fonctionné même sans l'option encodeURIComponent() .

4voto

0 votes

Merci pour cette solution, un moyen simple et efficace d'intégrer une carte personnalisée.

1voto

Custom Web Points 21

Sur http://www.labnol.org/internet/tools/short-urls-for-google-maps/6604/ ils montrent une URL courte qui fonctionne assez bien

Les URL de Google Maps sont assez difficiles à manier, surtout lorsqu'elles sont envoyées par messagerie instantanée, tweet ou e-mail. MapOf.it vous offre un moyen rapide de créer un lien vers Google Maps en spécifiant simplement l'adresse du lieu comme paramètre de recherche.

http://mapof.it/

Je l'ai utilisé pour quelques applications que j'ai conçues et il a fonctionné à merveille.

0voto

Ed Meacham Points 106

Aussi, si quelqu'un veut manuellement URLENCODE l'adresse : http://code.google.com/apis/maps/documentation/webservices/index.html#BuildingURLs

Vous pouvez l'utiliser pour créer des règles spécifiques qui répondent aux normes de GM.

0 votes

Cela conduit maintenant à un 404, malheureusement.

1 votes

Désolé. Ce commentaire est très ancien... Je doute que la version de l'API utilisée dans cette question existe toujours, mais voici ce à quoi le lien faisait référence : web.archive.org/web/20110420023220/https://code.google.com/apis/

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X