Comment convertir une adresse en lien Google Maps (NOT MAP)
Après avoir regardé (googler) sur le Web pendant un moment, je ne trouve rien qui prenne une adresse telle que:
1200 Pennsylvania Ave SE, Washington, District de Columbia, 20003
et le convertit en un lien cliquable:
jQuery ou PHP préféré ou simplement des informations utiles à ce sujet.
Que dis-tu de ça?
https://maps.google.com/?q=1200 Pennsylvania Ave SE, Washington, District de Columbia, 200
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
À compter de l'année 2017, Google dispose désormais d'un moyen officiel de créer des URL multi-plateformes pour Google Maps:
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
Je sais que je suis très en retard pour le jeu, mais je pensais contribuer pour le bien de la postérité.
J'ai écrit une courte fonction jQuery qui transformera automatiquement les balises <address> en liens Google Maps.
$(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);
});
});
Prime:
Je suis également tombé sur une situation qui nécessitait de générer des cartes intégrées à partir des liens, et que je partagerais avec les futurs voyageurs:
$(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?&q="+ encodeURIComponent( $(this).text() ) +"&output=embed'></iframe>";
$(this).html(embed);
});
});
Février 2016:
J'avais besoin de faire cela en fonction des valeurs de base de données entrées par le client et sans générateur lat/long. Google aime vraiment lat/long ces jours-ci. Voici ce que j'ai appris:
1 Le début du lien ressemble à ceci: https://www.google.com/maps/place/
2 Ensuite, vous mettez votre adresse:
- Utilisez un + au lieu de n'importe quel espace.
- Mettez une virgule devant et derrière la ville.
- Incluez le code postal/code postal et la province/état.
- Remplacez n'importe quel # par rien.
- Remplacez tout ++ ou ++++ par un +
3 Mettez l'adresse après le lieu /
4 Ensuite, mettez une barre oblique à la fin.
NOTE: La barre oblique à la fin était importante. Une fois que l'utilisateur a cliqué sur le lien, Google poursuit son travail et ajoute davantage à l'URL, après la barre oblique.
Exemple de travail pour cette question:
https://www.google.ca/maps/place/1200+Pennsylvania+Ave+SE,+Washington,+DC+20003/
J'espère que ça aide.
Qu'en est-il de ceci: http://support.google.com/maps/bin/answer.py?hl=fr&answer=72644
Voici ce que j'ai trouvé dans l'un des articles de Google Maps:
- Ouvrir Google Maps .
- Assurez-vous que la carte ou l'image Street View que vous souhaitez intégrer apparaît sur la carte.
- Dans le coin supérieur gauche, cliquez sur le menu principal.
- Cliquez sur pour partager ou intégrer une carte .
- En haut de la boîte de dialogue qui apparaît, choisissez l'onglet Carte intégrée .
- Choisissez la taille souhaitée, puis copiez le code et collez-le dans le code source de votre site Web ou de votre blog.
Remarque : Si vous utilisez Google Maps en mode Lite , vous ne pourrez pas incorporer de carte. N'oubliez pas que les informations sur la circulation et d'autres informations sur Cartes peuvent ne pas être disponibles dans la carte intégrée.
http://maps.google.com/maps?q=<?php echo urlencode($address); ?>
le code ur converge et ajoute tous les éléments supplémentaires comme pour les espaces et tous. vous pouvez donc récupérer facilement le code texte de l’avion à partir de la base de données et l’utiliser sans vous préoccuper des caractères spéciaux à ajouter
J'ai eu un problème similaire où je devais le faire pour chaque adresse sur le site (chacune enveloppée dans une balise d'adresse). Ce morceau de jQuery a fonctionné pour moi. Il va prendre chaque balise <address> et l'envelopper dans un lien Google Maps avec l'adresse que contient la balise!
$("address").each(function(){
var address = $(this).text().replace(/\,/g, '');
var url = address.replace(/\ /g, '%20');
$(this).wrap('<a href="http://maps.google.com/maps?q=' + url +'"></a>');
});
Exemple de travail -> https://jsfiddle.net/f3kx6mzz/1/
Le meilleur moyen est d'utiliser cette ligne:
var mapUrl = "http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=16900+North+Bay+Road,+Sunny+Isles+Beach,+FL+33160&aq=0&sll=37.0625,-95.677068&sspn=61.282355,146.513672&ie=UTF8&hq=&hnear=16900+North+Bay+Road,+Sunny+Isles+Beach,+FL+33160&spn=0.01628,0.025663&z=14&iwloc=A&output=embed"
N'oubliez pas de remplacer les première et deuxième adresses si nécessaire.
Empruntant aux solutions de Michael Jasper et Jon Hendershot, je propose ce qui suit:
$('address').each(function() {
var text = $(this).text();
var q = $.trim(text).replace(/\r?\n/, ',').replace(/\s+/g, ' ');
var link = '<a href="http://maps.google.com/maps?q=' + encodeURIComponent(q) + '" target="_blank"></a>';
return $(this).wrapInner(link);
});
Cette solution offre les avantages suivants par rapport aux solutions précédemment proposées:
- Les balises HTML (par exemple
<br>) ne seront pas supprimées de<address>, la mise en forme est donc préservée. - Il code correctement l'URL
- Il réduit les espaces supplémentaires afin que l'URL générée soit plus courte, plus propre et plus lisible par les humains après le codage.
- Il produit un balisage valide (la solution de Mr.Hendershot crée
<a><address></address></a>qui n'est pas valide car les éléments de niveau bloc tels que<address>ne sont pas autorisés dans les éléments en ligne tels que<a>.
Caveat: Si votre balise <address> contient des éléments de niveau bloc tels que <p> ou <div>, alors ce code JavaScript produira un balisage invalide (car le <a> tag contiendra ces éléments de niveau bloc). Mais si vous ne faites que des choses comme ça:
<address>
The White House
<br>
1600 Pennsylvania Ave NW
<br>
Washington, D.C. 20500
</address>
Ensuite, ça va marcher.
Sur http://www.labnol.org/internet/tools/short-urls-for-google-maps/6604/ ils affichent une courte URL qui fonctionne assez bien
Les URL de Google Maps sont plutôt difficiles à manipuler, notamment lors de l'envoi d'un message instantané, d'un tweet ou d'un courrier électronique. MapOf.it vous permet de vous connecter rapidement à Google Maps en spécifiant simplement l'adresse de l'emplacement en tant que paramètre de recherche.
Je l'ai utilisé pour quelques applications que j'ai conçues et cela a fonctionné à merveille.
Si vous avez la latitude et la longitude, vous pouvez utiliser n'importe quelle partie ou la totalité de l'URL ci-dessous.
https://www.google.com/maps/@LATITUDE,LONGITUDE,ZOOMNUMBERz?hl=LANGUAGE
Par exemple: https://www.google.com/maps/@31.839472,54.361167,18z?hl=fr
Aussi, toute personne souhaitant 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 conformes aux normes GM.
Je viens de trouver cela et aime partager ..
- recherchez votre adresse sur maps.google.com.
- cliquez sur l'icône d'engrenage en bas à droite
- cliquez sur "carte partagée ou intégrée"
- cliquez sur la case à cocher URL courte et collez le résultat dans href.
La méthode C # Replace fonctionne généralement pour moi:
foo = "http://maps.google.com/?q=" + address.Text.Replace(" ","+");