Перетаскивание нескольких выбранных объектов - 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;
    }
}

Answer 2

У меня была похожая проблема, и я решил ее, переопределив функцию MoveFeature в DragFeature и поместив this.lastPixel = pixel внутри цикла for, который применяет перемещение ко всем объектам в моем векторе слоя. Пока я не переместил this.lastPixel = pixel внутри цикла, все функции, кроме перетаскиваемой, безумно искажались.

 `OpenLayers.Control.DragFeature.prototype.moveFeature = function (pixel) {

        var res = this.map.getResolution();         
        for (var i = 0; i < vector.features.length; i++) {
            var feature = vector.features[i];
            feature .geometry.move(res * (pixel.x - this.lastPixel.x),
                res * (this.lastPixel.y - pixel.y));
            this.layer.drawFeature(feature );
            this.lastPixel = pixel;
        }
        this.onDrag(this.feature, pixel);
    };

`

Answer 3

Хмм ...

Я попробовал код выше и не смог заставить его работать. Два вопроса: 1) Чтобы переместить каждый объект, вам нужно использовать исходное положение этого объекта и добавить «вектор перетаскивания» из любого объекта, который DragControl перемещает сам по себе (то есть, параметр-параметр в doDrag). 2) Поскольку собственный код DragFeatures устанавливает lastPixel = pixel перед вызовом onDrag, строка, вызывающая move (), переместит объект в (0,0).

Мой код выглядит примерно так:

var lastPixels;
function startDrag(feature, pixel) {
    // save hash with selected features start position
    lastPixels = [];
    for( var f=0; f<wfs.selectedFeatures.length; f++){
         lastPixels.push({ fid: layer.selectedFeatures[f].fid, 
                           lastPixel: map.getPixelFromLonLat( layer.selectedFeatures[f].geometry.getBounds().getCenterLonLat() )
                         });
    }
}

function doDrag(feature, pixel) {
    /* because DragFeatures own handler overwrites dragSelected.lastPixel with pixel before this is called, calculate drag vector from movement of "feature" */
    var g = 0;
    while( lastPixels[g].fid != feature.fid ){ g++; }
    var lastPixel = lastPixels[g].lastPixel;

    var currentCenter =  map.getPixelFromLonLat( feature.geometry.getBounds().getCenterLonLat() );
    var dragVector = { dx: currentCenter.x - lastPixel.x, dy: lastPixel.y - currentCenter.y };

    for( var f=0; f<layer.selectedFeatures.length; f++){
         if (feature != layer.selectedFeatures[f]) {
             // get lastpixel of this feature
             lastPixel = null;
             var h = 0;
             while( lastPixels[h].fid != layer.selectedFeatures[f].fid ){ h++; }
             lastPixel = lastPixels[h].lastPixel;

             var newPixel = new OpenLayers.Pixel( lastPixel.x + dragVector.dx, lastPixel.y - dragVector.dy );
             // move() moves polygon feature so that centre is at location given as parameter
             layer.selectedFeatures[f].move(newPixel);
         }
    }
}