如何在Bootstrap模板主题中更改Google Map API中的坐标?

时间:2014-04-18 14:40:58

标签: google-maps twitter-bootstrap

我试过了,但没有运气。 Bootstrap提供了一个名为Stylish Portfolio(http://startbootstrap.com/stylish-portfolio)的非常棒的主题,它带有一个很酷的Google地图位置。 这是一个相当标准的事情。但是,我需要更改地图的位置以匹配丹麦的哥本哈根。 我试图从模板创建者那里查找其他资源/帮助/支持,机器人似乎无法在地图坐标上找到任何东西 - 这就是我现在在这里的原因。

我一直在浏览html,这似乎是地图的代码?

<!-- Map -->
<div id="contact" class="map">
    <iframe width="100%" height="100%" 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=Twitter,+Inc.,+Market+Street,+San+Francisco,+CA&amp;aq=0&amp;oq=twitter&amp;sll=28.659344,-81.187888&amp;sspn=0.128789,0.264187&amp;ie=UTF8&amp;hq=Twitter,+Inc.,+Market+Street,+San+Francisco,+CA&amp;t=m&amp;z=15&amp;iwloc=A&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=Twitter,+Inc.,+Market+Street,+San+Francisco,+CA&amp;aq=0&amp;oq=twitter&amp;sll=28.659344,-81.187888&amp;sspn=0.128789,0.264187&amp;ie=UTF8&amp;hq=Twitter,+Inc.,+Market+Street,+San+Francisco,+CA&amp;t=m&amp;z=15&amp;iwloc=A"></a>
    </small>
    </iframe>
</div>
<!-- /Map -->

显然,它不仅仅是一个简单的谷歌地图链接/坐标 - 有人可以帮我解释一下,我实际上在这里看到了什么?

提前致谢

1 个答案:

答案 0 :(得分:1)

解决问题的方法非常简单......

请按照以下步骤操作:

  1. 转到https://developers.google.com/maps/documentation/embed/start
  2. 搜索商家或地点(其中显示&#34;突出显示地点或地址&#34;)然后点击&#34;看起来不错!&#34;。
  3. 输入您的API密钥,如果您没有API密钥,请按照下面的istractions创建一个(API密钥),如果您有API密钥跳过步骤3.1,3.1.1,3.1.2。,3.1.3。 ,3.1.4。,
  4. 3.1创建API密钥

    3.1.1。访问https://code.google.com/apis/console的API控制台,然后使用您的Google帐户登录。

    3.1.2。单击左侧菜单中的“服务”链接。

    3.1.3。激活Google Maps Embed API服务。

    3.1.4。单击左侧菜单中的API Access链接。您可以从“API访问”页面的“简单API访问”部分中获取API密钥。 Maps API应用程序使用Key for browser apps。

    您的API密钥如下所示:AIzaSyCwI3k7JC29_KzlX1S_bC8fARpocLX5bRY

    1. 点击您的API密钥后,点击&#34; DONE&#34;

    2. 复制并粘贴您要访问模板index.html的代码,然后就完成了。

    3. 将高度和宽度更改为100%(在哪里说

    4. 这就是全部!