2012-07-04 68 views
14

我正在嘗試創建我的公司位置的谷歌地圖。我使用了Google地圖頁面上的鏈接按鈕。一切都很好,但是當我將地圖縮小到200 x 200時,所有地圖控件都會接管地圖並阻止地圖中的視圖。有沒有辦法讓他們騎車?我想要的只是引腳和放大和縮小按鈕。謝謝。谷歌地圖刪除控件

<iframe width="200" height="200" 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=244+5th+Avenue,+New+York,+NY&amp;aq=t&amp;sll=37.0625,-95.677068&amp;sspn=48.956293,107.138672&amp;ie=UTF8&amp;hq=&amp;hnear=244+5th+Ave,+New+York,+10016&amp;ll=40.744556,-73.987378&amp;spn=0.005763,0.013078&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=244+5th+Avenue,+New+York,+NY&amp;aq=t&amp;sll=37.0625,-95.677068&amp;sspn=48.956293,107.138672&amp;ie=UTF8&amp;hq=&amp;hnear=244+5th+Ave,+New+York,+10016&amp;ll=40.744556,-73.987378&amp;spn=0.005763,0.013078&amp;t=m&amp;z=14" style="color:#0000FF;text-align:left">View Larger Map</a></small> 
+0

根據Google本身,這是不可能的:https://productforums.google.com/forum/#!topic/maps/YTW6zpVIIkQ – bromelio

回答

32

定製界面,相信你已經深入到了谷歌地圖API。

使用Google Maps API,您可以將disableDefaultUI設置爲true。

HTML文件:

<!DOCTYPE html> 
<head> 
    <meta charset="utf-8" /> 
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
    <script type="text/javascript" src="map.js"></script> 
</head> 
<body> 
    <div id="map" style="width:200px; height:200px;" /> 
</body> 
</html> 

JavaScript文件:

window.onload = function() { 
    var myOptions = { 
     center: new google.maps.LatLng(40.744556,-73.987378), 
     zoom: 18, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     disableDefaultUI: true 
    }; 

    var map = new google.maps.Map(document.getElementById("map"), myOptions); 
} 
+1

我一直在這一小時前工作,我可以證實這是隱藏完整的用戶界面。 +1 –

9

我不相信嵌入地圖時隱藏控件是可能的。您將需要使用Google Maps API使用JavaScript創建一個地圖 - 在以下範圍:

var mapContainer = document.getElementById('mapContainer'); 
var mapOptions = { 
    panControl: false, 
    zoomControl: false, 
    scaleControl: false, 
}; 
var map = new google.maps.Map(mapContainer, mapOptions); 
5

沒有隱瞞使用IFRAME的控制,看下面的鏈接,查看可能的參數一個參數:

http://moz.com/ugc/everything-you-never-wanted-to-know-about-google-maps-parameters

如果你不想使用該API,您可以使用CSS來隱藏地圖邊緣:

CSS:

.mapaThumb { position:relative; } 
.mapaThumb iframe{ width:200px; height:240px; margin-top:-40px; margin-left:-10px; } 
.mapaThumb .mapaItem{ overflow:hidden; height:150px; } 

HTML:

<div class="mapaThumb"> 
    <div class="mapaItem"> 
     <iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com.br/maps?f=q&amp;source=s_q&amp;hl=pt-BR&amp;geocode=&amp;q=brazil&amp;aq=&amp;sll=-21.086832,-42.409844&amp;sspn=0.895645,1.674042&amp;ie=UTF8&amp;hq=&amp;hnear=Rep%C3%BAblica+Federativa+do+Brasil&amp;t=m&amp;z=4&amp;ll=-14.235004,-51.92528&amp;output=embed"></iframe> 
    </div> 
</div> 

這是不是最正確的,但它的工作原理! 中國聖人教的老戲法。

+0

不適用於我。 –

-3

只需設置您的Google地圖here的樣式,點擊「生成代碼」並將其嵌入到您網站的<body>中。

+1

他們沒有在他們的網頁上的任何地方提及它 - 使用此生成器將此聯屬網絡垃圾鏈接添加到您的網站:'wordpress themes' – Nathron