如何使用谷歌地图从您的网站显示地图位置

时间:2013-08-05 04:57:48

标签: html google-maps iframe onload

如何使用谷歌地图从我的数据库加载显示地图位置?

假设我的数据库中有3个地址:

1685 Centennial Way Corona California Riverside County 92882
25492 Centennial Way Corona California Riverside County 92882
1596 Centennial Way Corona California Riverside County 92882

他们都有不同的页面,但我希望他们在用户点击页面时在谷歌地图的iframe中加载位置。是否有任何代码可以帮助我实现这一目标而无需手动嵌入谷歌地图网站的iframe代码?

  <iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=1685+Centennial+Way+Corona+California+Riverside+County+92882&amp;aq=&amp;sll=37.0625,-95.677068&amp;sspn=42.089199,86.044922&amp;ie=UTF8&amp;hq=&amp;hnear=1685+Centennial+Way,+Corona,+Riverside,+California+92882&amp;t=m&amp;z=14&amp;ll=33.858119,-117.598538&amp;output=embed"></iframe><br /><small><a href="https://maps.google.com/maps?f=q&amp;source=embed&amp;hl=en&amp;geocode=&amp;q=1685+Centennial+Way+Corona+California+Riverside+County+92882&amp;aq=&amp;sll=37.0625,-95.677068&amp;sspn=42.089199,86.044922&amp;ie=UTF8&amp;hq=&amp;hnear=1685+Centennial+Way,+Corona,+Riverside,+California+92882&amp;t=m&amp;z=14&amp;ll=33.858119,-117.598538" style="color:#0000FF;text-align:left">View Larger Map</a></small>

从我的网站生成所有这些值,以消除从谷歌地图手动获取代码的需要。

1 个答案:

答案 0 :(得分:2)

在Google地图中,有一个链接按钮(看起来像一个链条),它为您提供了搜索位置的iframe的HTML。

例如,对于您的第一个示例,它如下所示(为了便于阅读而插入换行符):

<iframe width="425" height="350" frameborder="0"
scrolling="no" marginheight="0" marginwidth="0"
src="https://maps.google.com/maps?
f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;
q=1685+Centennial+Way+Corona+California+Riverside+County+92882&amp;
aq=&amp;sll=37.0625,-95.677068&amp;sspn=53.87374,114.082031&amp;
ie=UTF8&amp;hq=&amp;hnear=1685+Centennial+Way,+Corona,+Riverside,+California+92882&amp;
t=m&amp;z=14&amp;ll=33.858119,-117.598538&amp;output=embed">
</iframe>

这里不需要GPS数据,所以你可以做到:

<iframe width="425" height="350" frameborder="0"
scrolling="no" marginheight="0" marginwidth="0"
src="https://maps.google.com/maps?
f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;
q=1685+Centennial+Way+Corona+California+Riverside+County+92882&amp;
ie=UTF8&amp;hnear=1685+Centennial+Way,+Corona,+Riverside,+California+92882&amp;
t=m&amp;output=embed">
</iframe>

如果有必要,链接版本是相同的,除非没有转义&amp; s(&amp; s):

https://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=1685+Centennial+Way+Corona+California+Riverside+County+92882&aq=&ie=UTF8&hq=&hnear=1685+Centennial+Way,+Corona,+Riverside,+California+92882

然后,您可以使用您选择的脚本语言将地址组件替换为相应的地址组件(并对其进行正确的URL编码)。