2010-12-08 8 views
6

Ich weiß, dass ich einem Benutzer leicht erlauben kann, mehrere Features/Geometrien in OpenLayers auszuwählen, aber ich möchte dann dem Benutzer ermöglichen, alle ausgewählten Features gleichzeitig zu ziehen/zu bewegen.Mehrere ausgewählte Features ziehen/verschieben - OpenLayers

Mit dem Steuerelement ModifyFeature bewegt es nur ein Feature nach dem anderen ... gibt es eine Möglichkeit, dieses Steuerelement (oder was auch immer funktioniert) einfach zu erweitern, um alle ausgewählten Features auf diesem Layer zu verschieben?

Antwort

12

Okay, überspringen Sie das ModifyFeature Steuerelement und haken Sie einfach in das SelectFeature Steuerelement, um die ausgewählten Features zu verfolgen und dann DragControl zu verwenden, um die ausgewählten Punkte gleichzeitig zu bearbeiten.

Beispiel der Steuer Instanziierung:

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 
}); 

Beispiel für die Event-Handling-Funktionen:

/* 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; 
    } 
} 
+0

Dank für diese - auch für mich arbeitet, erwartet, dass, sobald die Merkmale gezogen worden sind, sind sie nicht mehr„wählbar“aus dem Auswahlfeld, und nicht wieder bewegt werden kann. Hattest du dieses Problem? –

+0

Danke für das klare Beispiel, es dauerte fast einen Tag, um ein einfaches Beispiel für das Ziehen und Ereignisse zu finden. Dieser ist großartig! Ich benutze es nicht für mehrere Funktionen, sondern für 1. – Marco

+0

Gefunden, verwendet es und es funktioniert :). Also ein großes DANKE! – elrado

0

Hmm ...

Ich habe versucht, den Code oben und konnte nicht machen es funktioniert. Zwei Probleme: 1) Um jedes Feature zu verschieben, müssen Sie die ursprüngliche Position dieses Features verwenden und den "Ziehvektor" aus der Funktion hinzufügen, mit der sich das DragControl selbst bewegt (d. H. Den Feature-Parameter toDrag). 2) Da der DragFeatures-eigene Code lastPixel = Pixel vor dem Aufruf von drag setzt, verschiebt die Zeile, die move() aufruft, das Feature auf (0,0).

Mein Code sieht in etwa wie folgt aus:

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); 
     } 
    } 
} 
+1

Willkommen bei Stack Overflow! Wenn Sie eine NEUE Frage haben, klicken Sie bitte auf die Schaltfläche [Frage stellen] (http://stackoverflow.com/questions/ask). Wenn Sie eine ausreichende Reputation haben, können Sie die Frage stellen (http://stackoverflow.com/privileges/vote-up). Alternativ "Stern" als Favorit und Sie werden über neue Antworten benachrichtigt. – jjnguy

0

Ich hatte ein ähnliches Problem und löste es durch DragFeature der moveFeature Funktion überschreiben und this.lastPixel = Pixel innerhalb der for-Schleife setzen, dass der Umzug auf alle Funktionen gilt innerhalb mein Ebenenvektor. Bis ich dieses.letzte Pixel = Pixel innerhalb der Schleife bewegt habe, wurden alle Features außer demjenigen, der gezogen wurde, verrückt verzerrt.

`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); 
    }; 

`