Tạo điểm đánh dấu có thể kéo và có thể nhấp

Question

Tôi có lớp vectơ để hiển thị các điểm đánh dấu làm đối tượng địa lý trên bản đồ của tôi, nhưng bây giờ là mather, tôi làm gì, chúng có thể kéo được hoặc có thể nhấp được. Tôi có thể làm gì để có được cả hai?

/*** Init Drag Marker 
*/ 
    var dragFeature = new OpenLayers.Control.DragFeature(layerTrackMarker, 
     {'onComplete': updateMarker} 
    ); 
    map.addControl(dragFeature); 
    dragFeature.activate(); 

/*** Init Click Marker 
*/ 
    var clickFeature = new OpenLayers.Control.SelectFeature(layerTrackMarker, 
     {} 
    ); 
    map.addControl(clickFeature); 
    layerTrackMarker.events.on({ 
        "featureselected": function(e) { 
         var markerId = e.feature.geometry.id; 
         removeMarker(markerId); 
         /* ToDo: show context menu */ 
        }, 
        "featureunselected": function(e) { 
         /* ToDo: hide context menu */ 
        } 
       }); 
    clickFeature.activate(); 

Answer 1

Tôi chưa thử nghiệm, nhưng không phải công việc này như vậy?

var dragged = false; 
var dragFeature = new OpenLayers.Control.DragFeature(layerTrackMarker, { 
    onComplete: function(){ 
     if(dragged){ 
      dragCallback(); 
     }else{ 
      clickCallback(); 
     } 
    }, 
    onStart: function(){ 
     dragged = false; 
    }, 
    onDrag: function(){ 
     dragged = true; 
    } 
}); 
map.addControl(dragFeature); 
dragFeature.activate(); 

Chỉnh sửa: onComplete không kích hoạt nếu không có kéo thực tế. Dưới đây là đoạn code làm việc

var dragged = false; 
var dragFeature = new OpenLayers.Control.DragFeature(pointLayer, { 
    onStart: function(){dragged = false;}, 
    onDrag: function() {dragged = true;} 
}); 

map.addControl(dragFeature); 
dragFeature.activate(); 

map.events.register("mouseup", map , function(e){ 
    if(dragged == true){ 
     alert("dragged"); 
    }else{ 
     alert("clicked"); 
    } 
}); 

jsFiddle: http://jsfiddle.net/reKRr/5/

EDIT: đây là cách ít hacky để làm việc đó

var selectFeature = new OpenLayers.Control.SelectFeature(
    pointLayer, 
    { 
     onSelect: function(){    
      alert("selected"); 
     } 
    } 
); 

var dragFeature = new OpenLayers.Control.DragFeature(pointLayer, { 
    onComplete: function(){ 
     alert("drag"); 
    } 
}); 

dragFeature.handlers['drag'].stopDown = false; 
dragFeature.handlers['drag'].stopUp = false; 
dragFeature.handlers['drag'].stopClick = false; 
dragFeature.handlers['feature'].stopDown = false; 
dragFeature.handlers['feature'].stopUp = false; 
dragFeature.handlers['feature'].stopClick = false; 

map.addControls([selectFeature,dragFeature]); 

selectFeature.activate(); 
dragFeature.activate();