拖动/移动多个选定的功能 - OpenLayers

Question

我知道我可以轻松地允许用户在OpenLayers中选择多个功能/几何,但我希望让用户能够轻松地同时拖动/移动所有选定的功能.

使用ModifyFeature控件,它一次只能移动一个功能...有没有办法轻松扩展此控件(或任何工作)以移动该图层上的所有选定功能？

Answer 1

好的,跳过ModifyFeature控件并挂钩SelectFeature控件以跟踪所选功能,然后使用它DragControl同时操作选定的点.

控件实例化的示例:

var drag = new OpenLayers.Control.DragFeature(vectors, {
  onStart: startDrag,
  onDrag: doDrag,
  onComplete: endDrag
});
var select = new OpenLayers.Control.SelectFeature(vectors, {
  box: true,
  multiple: true,
  onSelect: addSelected,
  onUnselect: clearSelected
});

事件处理函数的示例:

/* Keep track of the selected features */
function addSelected(feature) {
    selectedFeatures.push(feature);
}

/* Clear the list of selected features */
function clearSelected(feature) {
    selectedFeatures = [];
}

/* Feature starting to move */
function startDrag(feature, pixel) {
    lastPixel = pixel;
}

/* Feature moving */
function doDrag(feature, pixel) {
    for (f in selectedFeatures) {
        if (feature != selectedFeatures[f]) {
            var res = map.getResolution();
            selectedFeatures[f].geometry.move(res * (pixel.x - lastPixel.x), res * (lastPixel.y - pixel.y));
            vectors.drawFeature(selectedFeatures[f]);
        }
    }
    lastPixel = pixel;
}

/* Featrue stopped moving */
function endDrag(feature, pixel) {
    for (f in selectedFeatures) {
        f.state = OpenLayers.State.UPDATE;
    }
}