禁用谷歌地圖上的可點擊地標

Question

我正在使用谷歌地圖API v3。我想在默認的Google地標/ poi上停用點擊操作。例如，當我縮放到UCLA時，學校圖標顯示（這很好），但我不希望用戶單擊並查看該位置的詳細信息。我應該使用哪個API函數？

Answer 1

我遇到了同樣的問題。 Google似乎最近更改了自己的api，使底圖標籤「可點擊」，並且還沒有簡單的API調用來禁用它們的可點擊性。 http://groups.google.com/group/google-maps-js-api-v3/browse_thread/thread/f1ac9ad4da3606fe

我希望看到谷歌添加一個簡單的地圖選項這個樣子，但可惜它還不存在

var opts = { clickableLabels:false }; 
var map = new maps.google.com.map(div,opts); 

以下解決方案的工作，但因爲它依賴於定製風格的地圖圖塊，免費地圖僅限於（每天2,500張地圖加載） - See Google Maps FAQ。

function initialize() { 

    // For more details see 
// http://code.google.com/apis/maps/documentation/javascript/styling.html 
    var noPOILabels = [ 
    { 
     featureType: "poi", 
     elementType: "labels", 
     stylers: [ { visibility: "off" } ] 

    } 
    ]; 

    // Create a new StyledMapType object, passing it the array of styles, 
    // as well as the name to be displayed on the map type control. 
    var noPOIMapType = new google.maps.StyledMapType(noPOILabels, 
    {name: "NO POI"}); 

    // Create a map object, and include the MapTypeId to add 
    // to the map type control. 
    var mapOptions = { 
    zoom: 11, 
    center: new google.maps.LatLng(55.6468, 37.581), 
    mapTypeControlOptions: { 
     mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'no_poi'] 
    } 
    }; 
    var map = new google.maps.Map(document.getElementById('map_canvas'), 
    mapOptions); 

    //Associate the styled map with the MapTypeId and set it to display. 
    map.mapTypes.set('no_poi', noPOIMapType); 
    map.setMapTypeId('no_poi'); 
} 

Answer 2

此問題已被記錄與谷歌在：

http://code.google.com/p/gmaps-api-issues/issues/detail?id=3866

請明星，在這個問題上發表評論，您的需求在那裏。

Answer 3

我明白，這個問題是舊的，但也許這個答案將幫助別人：

我不知道這是否是合法的，但我最終探索代碼，並作出這樣的：

$("#google-map").on("mousedown",function(){ 
    setTimeout(function(){ 
     disableInfoWindows(); 
    },500); 
}); 

function disableInfoWindows() 
{ 
    $(".gm-iw.gm-sm").parent().parent().remove(); 
    $("[style='position: absolute; left: -2px; top: -336px; width: 59px; height: 492px; -webkit-user-select: none; border: 0px; padding: 0px; margin: 0px;']") 
    .parent() 
    .parent() 
    .remove(); 
} 

它爲我工作，沒有infoWindow顯示，同時保留所有的圖標。任何有想法加強代碼的人都會受到歡迎，infoWindow在第一次打開時顯示出來，在第一次打開之後，它完全消失了。

Answer 4

據我所知，OP希望有一個解決方案能夠保留標籤/圖標，但會暫停點擊事件。我不確定這是可能的;請star this issue

但是，我們中的一些人正在繪製形狀sans繪圖管理器和標籤/圖標阻礙了新點的添加。如果它符合您的要求，您可以暫時刪除圖標/標籤。我發現，中轉，POI和景觀都需要切換：

var map = new google.maps.Map(document.getElementById("map"), {}); 
map.poi = function(state){ 

    var styles = [ 
    { 
     "featureType": "transit", 
     "stylers": [ 
     { "visibility": "off" } 
     ] 
    },{ 
     "featureType": "poi", 
     "stylers": [ 
     { "visibility": "off" } 
     ] 
    },{ 
     "featureType": "landscape", 
     "stylers": [ 
     { "visibility": "off" } 
     ] 
    } 
    ]; 

    this.set("styles", (state)? {} : styles); 

} 

和使用：

//turn the labels/icons off 
map.poi(false); 

//turn them back on 
map.poi(true); 

Answer 5

谷歌已經暴露了這個選項。見google.maps.MapOptionsin the docs的clickableIcons。

實例初始化代碼：

map = new google.maps.Map(document.getElementById('map'), { 
    clickableIcons: false 
}); 

Answer 6

將此選項添加到mapOption clickableIcons：假

這是更多的選擇，我認爲你會

draggable: true, // this is for disable the Draggable 
 
disableDefaultUI: true, // this for disable Default UI 
 
fullscreenControl: false, // this is for disable Full Screen 
 
scrollwheel: true, // this is for disable Scroll Wheel 
 
disableDoubleClickZoom: false, // this is for disable Double Click Zoom 
 
draggableCursor:'crosshair',// this is for cursor type 
 
draggingCursor:'move', // this is for dragging cursor type 
 
minZoom: 3, // this is for min zoom for map 
 
maxZoom: 18 , // this is for max zoom for map 
 
//note : max, min zoom it's so important for my design. 
 
zoom: 14, // this is to make default zoom 
 
clickableIcons: false, // this is to disable all labels icons except your custom infowindow or Infobox.