2013-12-19 33 views
17

我使用新的Google地圖嵌入代碼(iFrame)向我的網站添加小地圖,但我無法隱藏左上角的新地址框(請參閱圖像下面)。谷歌地圖嵌入 - 取消位置卡

http://i.imgur.com/JOVXkra.jpg

我已經通過點擊「分享和嵌入地圖」選項(見下圖)生成的地圖代碼,但我想知道如果我需要使用完整的API來實現這一目標。

http://i.imgur.com/xxl25Ga.png

所有我發現到目前爲止僅僅討論了舊版本的嵌入和禁用的信息氣球這是不一樣的,我已經得到了唯一的線索資源的是,HTML類該箱子被稱爲「地方卡」,但搜索仍然沒有給我帶來任何東西。

任何幫助或點在正確的方向將不勝感激。

謝謝!

+0

這裏是一個更全面的討論: http://stackoverflow.com/questions/11334042/google-maps-removing-controls – harvest316

+0

超級晚,但這裏的另一種方式來刪除它。 http://stackoverflow.com/a/37083353/3130549 – rawnewdlz

+0

很好,謝謝。如果你在這裏添加相同的答案,我會接受它作爲正確的答案。 – Sintyche

回答

27

你可以用css隱藏所有的按鈕。在隱藏和您需要的尺寸上創建容器div寬度溢出。放置新的谷歌地圖iframe /內嵌大尺寸。要定位地圖iframe中使用負marges ..

例與100%的寬度:

<div style="width: 100%; overflow: hidden; height: 300px;"> 
    <iframe 
    src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d39797.07748547086!2d5.46683904751879!3d51.433965676849986!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c6d90575ca5e3d%3A0x55989f5f344b006!2sPrins+Hendrikstraat+5!5e0!3m2!1snl!2snl!4v1392716144537" 
    width="100%" 
    height="600" 
    frameborder="0" 
    style="border:0; margin-top: -150px;"> 
    </iframe> 
</div> 

讓比你的div容器的iframe 300像素高。 150px隱藏在下面,150px隱藏在上面。隱藏此150上的iframe使用的頂部:

邊距:-150px;

+6

看起來很哈克,但也很聰明。 +1 –

+2

您是否認爲這可能被視爲侵犯了谷歌的條款?我這樣問,因爲如果你做同樣的事情來隱藏底部的版權線路,你可能會遇到麻煩。 –

+0

@dooart你可以改變風格有點顯示在底部的版權.. –