【发布时间】：2010-11-21 00:18:02
【问题描述】：
在网上（谷歌搜索）一段时间后，我找不到任何类似地址的东西：
宾夕法尼亚大道东南 1200 号， 华盛顿哥伦比亚特区，20003 年
并将其转换为可点击的链接：
首选 jQuery 或 PHP，或者任何有用的信息。
【问题讨论】：
标签： google-maps hyperlink google-maps-urls
【发布时间】：2010-11-21 00:18:02
【问题描述】：
这个怎么样？
https://maps.google.com/?q=1200 Pennsylvania Ave SE, Washington, District of Columbia, 20003
https://maps.google.com/?q=term
如果您有经纬度，请使用以下网址
https://maps.google.com/?ll=latitude,longitude
示例：maps.google.com/?ll=38.882147,-76.99017
更新
截至 2017 年，Google 现在有了一种创建跨平台 Google 地图 URL 的官方方式：
https://developers.google.com/maps/documentation/urls/guide
你可以使用像
这样的链接https://www.google.com/maps/search/?api=1&query=1200%20Pennsylvania%20Ave%20SE%2C%20Washington%2C%20District%20of%20Columbia%2C%2020003
【讨论】：
-
如何使用纬度和经度进行创作？
-
如果用户使用的是新的谷歌地图，这个方法似乎有点古怪。要创建强制结果页面以经典模式显示的链接，只需将
&output=classic附加到您的链接。所以整个事情看起来像这样：http://maps.google.com/?q=1200%20Pennsylvania%20Ave%20SE,%20Washington,%20District%20of%20Columbia,%2020003&output=classic -
@Matt 怎么样？此外，output=classic 不会永远存在，如果用户更喜欢新地图怎么办？
-
有什么方法可以通过 URL 获取地图上的放置图钉？
-
这仍然很好用（感谢@ChrisB！）但看起来谷歌地图自己的格式现在是
https://www.google.com/maps/place/1200 Pennsylvania Ave SE, Washington, District of Columbia, 20003¶ 对于某些位置，您可以只使用名称......但@987654330 @ 和www.google.com/maps/place/不一定会返回相同的结果：https://www.google.com/maps/place/White House扩展为https://www.google.com/maps/place/The+White+House,+1600+Pennsylvania+Ave+NW,+Washington,+DC+20500但https://maps.google.com/?q=White House给了我在 NC 的古董店
我知道我已经很晚了，但我想我会为后代做出贡献。
我编写了一个简短的 jQuery 函数，它会自动将任何 <address> 标记转换为 Google 地图链接。
$(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);
});
});
奖金：
我还遇到了需要从链接生成嵌入式地图的情况，尽管我会与未来的旅行者分享：
$(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);
});
});
【讨论】：
-
@Michael Jasper thanx 获取您的代码...它让我获得了 div 中的地图...但我的问题是 pin 信息被弹出...我不想要。所以你能指导我如何不提前打开 pin 信息框吗？？？？？？？。thnx ...
-
请注意，HTML5
<address>标签并非用于提供邮政地址，而是提供与内容相关的联系信息（通常是作者）。 developer.mozilla.org/en-US/docs/Web/HTML/Element/address -
很好的答案！感谢分享。我不确定它的后果，但即使没有
encodeURIComponent()，它也能正常工作。
2016 年 2 月：
我需要根据客户输入的数据库值来执行此操作，并且没有纬度/经度生成器。这些天谷歌真的很喜欢纬度/经度。这是我学到的：
1 链接的开头如下所示： https://www.google.com/maps/place/
2 然后你输入你的地址：
- 使用 + 代替任何空格。
- 城市前后各加一个逗号。
- 包括邮政/邮编和省/州。
- 将任何# 替换为空。
- 将任何 ++ 或 ++++ 替换为单个 +
3 把地址放在地点后面/
4 然后在最后加上一个斜线。
注意：最后的斜线很重要。用户点击链接后，Google 会继续向 URL 附加更多内容，并在此斜杠之后执行此操作。
此问题的工作示例：
https://www.google.ca/maps/place/1200+Pennsylvania+Ave+SE,+Washington,+DC+20003/
我希望这会有所帮助。
【讨论】：
-
虽然示例有效，但我无法为德国地址重新创建它。我最终实现了 Chris B 的答案 (.../?q=term)。
-
谢天谢地，这现在也适用于德国地址。见：google.com/maps/place/…
【讨论】：
-
感谢您，这是嵌入自定义地图的好方法
我有一个类似的问题，我需要为网站上的每个地址（每个地址都包含在地址标签中）完成此操作。这一点 jQuery 对我有用。它将抓取每个<address> 标签并将其包装在带有标签包含的地址的谷歌地图链接中！
$("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>');
});
工作示例 --> https://jsfiddle.net/f3kx6mzz/1/
【讨论】：
-
您可以使用
encodeURIComponent代替手动尝试对字符串进行URL 转义。
最好的方法是使用这条线：
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"
必要时记得替换第一个和第二个地址。
【讨论】：
借鉴 Michael Jasper 和 Jon Hendershot 的解决方案，我提供以下解决方案：
$('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);
});
与之前提供的解决方案相比，此解决方案具有以下优势：
- 它不会删除
<address>中的HTML标签（例如<br>标签），所以格式会被保留 - 它正确地编码了 URL
- 它压缩了多余的空格，使生成的 URL 在编码后更短、更清晰且易于阅读
- 它会产生有效的标记（Mr.Hendershot 的解决方案会创建无效的
<a><address></address></a>，因为<address>等块级元素不允许在<a>等内联元素中使用。
警告：如果您的<address> 标记包含块级元素，如<p> 或<div>，那么此JavaScript 代码将产生无效标记（因为<a> 标记将包含那些块级元素）。但如果你只是在做这样的事情：
<address>
The White House
<br>
1600 Pennsylvania Ave NW
<br>
Washington, D.C. 20500
</address>
然后它会工作得很好。
【讨论】：
-
我在我的项目中使用了你的解决方案，只需根据我的需要调整你的代码。它现在有效。
这是我从一篇 Google 地图文章中发现的：
- 打开Google Maps。
- 确保您要嵌入的地图或街景图片显示在地图上。
- 在左上角，点击主菜单☰。
- 点击分享或嵌入地图。
- 在出现的框顶部，选择嵌入地图标签。
- 选择所需大小，然后复制代码并将其粘贴到您网站或博客的源代码中。
注意：如果您在Lite mode 中使用地图，您将无法嵌入地图。 请注意，嵌入式地图中可能不提供路况信息和其他一些地图信息。
【讨论】：
-
它对我有用。复制此嵌入代码并粘贴到您的网站。
如果你有纬度和经度，你可以使用下面网址的任何部分或全部
https://www.google.com/maps/@LATITUDE,LONGITUDE,ZOOMNUMBERz?hl=LANGUAGE
例如： https://www.google.com/maps/@31.839472,54.361167,18z?hl=en
【讨论】：
在http://www.labnol.org/internet/tools/short-urls-for-google-maps/6604/ 上，他们显示了一个运行良好的短 URL
Google 地图 URL 非常笨拙，尤其是在通过 IM、推文或电子邮件发送时。 MapOf.it 为您提供了一种快速链接到 Google 地图的方法，只需将位置地址指定为搜索参数。
我将它用于我设计的一些应用程序中，它就像一个魅力。
【讨论】：
http://maps.google.com/maps?q=<?php echo urlencode($address); ?>
编码你的转换器并添加所有额外的元素，如空格和所有。这样您就可以轻松地从数据库中获取平面文本代码并使用它，而无需担心要添加的特殊字符
【讨论】：
-
encodeURIComponent 是 javascript，你应该使用 urlencode($address);
此外，任何想要手动对地址进行 URLENCODE 的人：http://code.google.com/apis/maps/documentation/webservices/index.html#BuildingURLs
您可以使用它来创建符合 GM 标准的特定规则。
【讨论】：
-
不幸的是，这会导致 404。
-
对不起。这个评论很老了......我怀疑这个问题中使用的 API 版本仍然存在，但这里是链接用来引用的内容：web.archive.org/web/20110420023220/https://code.google.com/apis/…
C# Replace 方法通常对我有用：
foo = "http://maps.google.com/?q=" + address.Text.Replace(" ","+");
【讨论】：
我刚找到这个并喜欢分享..
- 在 maps.google.com 上搜索您的地址
- 点击右下角的齿轮图标
- 点击“共享或嵌入地图”
- 点击短网址复选框并将结果粘贴到href..
【讨论】：