添加绘图管理器后丢失绑定事件

时间:2013-05-07 20:30:35

标签: javascript google-maps google-maps-api-3

当我向Google地图添加DrawingManager功能时,我遇到了一个问题。当我在下面调用drawingManager.setMap(map)时,我会丢失我在createMap函数底部添加的点击事件。当我评论drawingManager.setMap(map)时,我的点击事件正常。我在文档中找不到任何可以解释这种行为的提法,但我必须错过一步或做错事。

以下是我正在使用的代码的基本版本:

function createMap() {
  window.center = new google.maps.LatLng(latitude, longitude);

  var mapOptions = {
    zoom: zoom,
    center: center,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };

  window.map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

  window.drawingManager = new google.maps.drawing.DrawingManager({                 
    drawingMode: google.maps.drawing.OverlayType.MARKER,                        
    drawingControl: true,                                                       
    drawingControlOptions: {                                                    
      position: google.maps.ControlPosition.TOP_CENTER,                         
      drawingModes: [                                                           
        google.maps.drawing.OverlayType.POLYGON                                 
      ]                                                                         
    },                                                                          
    circleOptions: {                                                            
      fillColor: '#ffff00',                                                     
      fillOpacity: 1,                                                           
      strokeWeight: 5,                                                          
      clickable: true,                                                         
      editable: true,                                                           
      zIndex: 1                                                                 
    }                                                                           
  });                                                                           

  window.drawingManager.setMap(window.map);                                                   

  google.maps.event.addListener(window.map, 'click', function(event){
    console.log('clicked!');
  });

}

这是运行drawingManager.setMap(map)的破解版本:

http://jsfiddle.net/spencercarnage/4hD2S/3/

没有drawingManager.setMap(map),它正确地控制了来自听众的点击:

http://jsfiddle.net/spencercarnage/4hD2S/4/

2 个答案:

答案 0 :(得分:0)

看起来图纸管理器正在消耗点击事件。如果在不使用它时将其禁用,则单击事件将再次起作用。那可能,我不知道它在哪里被记录。

答案 1 :(得分:0)

发现问题。替换:

drawingMode: google.maps.drawing.OverlayType.MARKER

使用:

drawingMode: google.maps.drawing.OverlayType.POLYGON 

新秀错误。