我的网站上的谷歌地图与手机兼容吗?

时间:2013-01-24 02:27:09

标签: google-maps twitter-bootstrap

我需要在我的引导程序中实现谷歌地图,但我不确定iframe是否适用于手机,是否有适用于手机和桌面的谷歌地图版本

我试过谷歌但没有出现

<iframe id="maps" width="325" height="208" 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=8207+Central+Ave+NE,+Albuquerque,+NM&amp;aq=0&amp;oq=8207+central+ave+ne+a&amp;sll=34.166233,-106.026069&amp;sspn=15.047206,19.753418&amp;ie=UTF8&amp;hq=&amp;hnear=8207+Central+Ave+NE,+Albuquerque,+Bernalillo,+New+Mexico+87108&amp;ll=35.074854,-106.555821&amp;spn=0.00364,0.004823&amp;t=m&amp;z=14&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=8207+Central+Ave+NE,+Albuquerque,+NM&amp;aq=0&amp;oq=8207+central+ave+ne+a&amp;sll=34.166233,-106.026069&amp;sspn=15.047206,19.753418&amp;ie=UTF8&amp;hq=&amp;hnear=8207+Central+Ave+NE,+Albuquerque,+Bernalillo,+New+Mexico+87108&amp;ll=35.074854,-106.555821&amp;spn=0.00364,0.004823&amp;t=m&amp;z=14" style=" color:#0000FF;text-align:left">View Larger Map</a></small>

1 个答案:

答案 0 :(得分:0)

Google Maps API v3是为移动和桌面设备开发的。只需确保设置视口元标记,并设置 html 正文地图div (id)的样式 map-canvas 下面):

<style type="text/css">
  html { height: 100% }
  body { height: 100%; margin: 0; padding: 0 }
  #map-canvas { height: 100% }
</style>

研究Hello world示例,了解如何使其全部正常运行。