Openlayers和捕捉拖动事件

Question

即时通讯使用OpenLayers，我需要能够区分何时地图被我自己的脚本或用户移动。是的，我知道我可以使用moveend。但是，当同一脚本正在移动或根据来自ajax调用的传入数据重新定位地图时，它也会触发。所以移动或其他地图事件不会工作。

我做了一些Google搜索，发现OpenLayers.Hander.Drag。但我管理的所有内容都是阻止用户拖动地图。

我的脚本：

this.dragger = new OpenLayers.Handler.Drag('',{ 
     'dragStart': function(evt){ 
      this.userdragged = true; 
      console.log('drag'); 
     }},{ 
     'map':this.mymap 
     }); 
this.dragger.activate(); 

正如你所看到的，我试图userdragged变量设置为true以后使用中moveend事件这个相同的变量。不幸的是，所有这些都是为了阻止我的地图可以拖动。

有人可以帮助我吗？

艾伦

Answer 1

明白了！

什么得到它的工作是：

dragcontrol = new OpenLayers.Control.DragPan({'map':this.mymap, 'panMapDone':function(evt){ 
    this.userdragged = true; 
    console.log('drag'); 
}}); 
dragcontrol.draw(); 
this.mymap.addControl(dragcontrol); 
dragcontrol.activate(); 

Booyaka！

编辑： 其实this.userdragged不会在那里工作...这是不同的范围。你需要做一些类似var = this的事情;之前，该对象初始化和使用that.userdragged = true ...

编辑2： 我后来发现，这个panMapDone函数覆盖DragPans自己的方法，它具有相同的名称。就像我之前的例子一样，当用户拖动地图时，最终可能会导致地图的矢量功能与地图不同步。为了阻止这种情况发生，你应该在原有的功能复制到功能太...使它看起来类似的东西：

dragcontrol = new OpenLayers.Control.DragPan({'map':this.mymap, 'panMapDone':function(xy){ 
     if(this.panned) { 
      var res = null; 
      if (this.kinetic) { 
       res = this.kinetic.end(xy); 
      } 
      this.map.pan(
       this.handler.last.x - xy.x, 
       this.handler.last.y - xy.y, 
       {dragging: !!res, animate: false} 
      ); 
      if (res) { 
       var self = this; 
       this.kinetic.move(res, function(x, y, end) { 
        self.map.pan(x, y, {dragging: !end, animate: false}); 
       }); 
      } 
      this.panned = false; 
     } 
     that.userdragged = true; 
      // do whatever you want here 
    }}); 
    dragcontrol.draw(); 
    this.mymap.addControl(dragcontrol); 
    dragcontrol.activate(); 

艾伦

Answer 2

纵观documentation上拖动处理程序，它指出，它应该有一个控制对象使用。你用那种方式吗？也许代码片段不显示它？

“如果在没有控件的情况下使用处理程序，必须重写处理程序setMap方法才能正确处理地图。”

我还没有尝试过，但似乎你应该去这样的事情：

var myControl = new OpenLayers.Control(); 

var dragger = new OpenLayers.Handler.Drag{ 
    control: myControl, 
    callbacks: { 'done': function() { // do something }}, 
    options: {} 
} 

myMap.addControl(myControl); 
myControl.activate(); 

Answer 3

刚刚张贴的例子在这里当执行任意功能的用户拖动地图，而不会干扰用于平移地图的正常点击拖动，因为此页面是我搜索过程中最常见的结果，可以找出如何实现这一点。

var CustomDragControl = OpenLayers.Class(OpenLayers.Control, { 

    defaultHandlerOptions: { 
     'stopDown': false 
     /* important, otherwise it prevent the click-drag event from 
      triggering the normal click-drag behavior on the map to pan it */ 
    }, 

    initialize: function(options) { 
     this.handlerOptions = OpenLayers.Util.extend(
      {}, this.defaultHandlerOptions 
     ); 
     OpenLayers.Control.prototype.initialize.apply(
      this, arguments 
     ); 
     this.handler = new OpenLayers.Handler.Drag(
      this, { 
       'down': this.onDown //could be also 'move', 'up' or 'out' 
      }, this.handlerOptions 
     ); 
    }, 

    onDown: function(evt) { 
     // do something when the user clic on the map (so on drag start) 
     console.log('user clicked down on the map'); 
    } 
}); 

然后创建地图实例时将控件添加到您的地图的控制列表，或用map.addControl（），与

new CustomDragControl ({'autoActivate': true})