如果在OpenLayers 3中关闭div,则删除'singleclick'地图事件

时间:2015-10-16 10:21:38

标签: javascript jquery function onclicklistener openlayers-3

我在OpenLayers 3网页地图上有一个按钮,当用户点击地图时,点击该按钮会激活一个在div中返回Google街景图像的功能。

这个工作正常,但我想做的是在div关闭时禁用地图点击功能。

目前我有:

$("#street-view").click(function() {
  map.on('singleclick', function(evt) {
    var coord = evt.coordinate;
    var x = coord[0];
    var y = coord[1];
    var os1w = new OSRef(x, y);
    var coordres = os1w.toLatLng(os1w);
    coordres.OSGB36ToWGS84();
    xResult = coordres.toLatString();
    yResult = coordres.toLngString();
    var sv = new google.maps.StreetViewService();
    panorama = new google.maps.StreetViewPanorama(document.getElementById('street-view-image'));
    var googleCoord = new google.maps.LatLng(xResult,yResult);
    sv.getPanorama({location: googleCoord, radius: 20}, getStreetViewImage);
  });
});

function getStreetViewImage(data, status) {
  if (status === google.maps.StreetViewStatus.OK) {
    panorama.setPano(data.location.pano);
    panorama.setPov({
      heading: 0,
      pitch: 0
    });
    $('#street-view-pane').fadeIn("slow");
    panorama.setVisible(true);
  } else {
    $("#street-view-image").html("Sorry! No Street View images are available at this location.");
  }
}


$("#close-street-view").click(function(evt) {
  $('#street-view-pane').fadeOut("slow");
});

我已经尝试在for循环中创建一个if语句来说明循环是否大于0并且div是打开的,然后运行代码(所以如果div没有显示然后什么也不做) - 但这不是不行。

div关闭后是否有一种简单的方法可以停止单击事件?我有一个单击事件,用于识别地图上已启用的功能,因此我无法禁用所有单击功能。

由于

2 个答案:

答案 0 :(得分:1)

on的{​​{1}}方法返回该事件监听器的唯一键。如果您希望能够取消事件监听器,请保存该密钥并将其与unByKey方法一起使用。

答案 1 :(得分:0)

示例:

1。 //添加选择事件

this.olSelectkey = this.select.on(' select',function(evt){

//你的代码

});

//删除选择事件
this.select.unByKey(this.olSelectkey);

2

//映射单击事件

this.mapCursorKey = this.map.on(" singleclick",function(evt){

                           var hit = this.forEachFeatureAtPixel(evt.pixel,
                                    function(feature, layer) {
                                        return true;
                                    }); 
                            if (hit) {
                                this.getTarget().style.cursor = 'pointer';
                            } else {
                                this.getTarget().style.cursor = '';
                            }
                        });

//删除光标指针更改事件
this.map.unByKey(this.mapCursorKey);