禁用谷歌地图上的可点击地标

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.