OpenLayers

Question

OpenLayersで複数のフィーチャ/ジオメトリを簡単に選択できるようになっていますが、同時にすべての選択されたフィーチャを簡単にドラッグ/移動できるようにしたいと考えています。

ModifyFeatureコントロールでは、一度に1つのフィーチャしか移動しません。このコントロールを簡単に拡張して、そのレイヤのすべての選択されたフィーチャを移動できますか？

Answer 1

さて、ModifyFeature制御をスキップして、ちょうど同時に選択されたポイントを操作するためDragControlを使用して、選択した機能を追跡するためにSelectFeatureコントロールにフックと。コントロールのインスタンス化の

例：関数をイベント処理の

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

うーん...

私は上記のコードを試みたが、作ることができませんでしたそれは働く。 2つの問題： 1）各フィーチャーを移動するには、そのフィーチャーの元の位置を使用し、DragControl自体が移動しているフィーチャー（つまり、ドラッグのフィーチャーパラメーター）から「ドラッグベクトル」を追加する必要があります。 2）DragFeatures自身のコードでは、onDragを呼び出す前にlastPixel = pixelを設定するので、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); 
     } 
    } 
} 

Answer 3

を私は同様の問題を抱えていたとDragFeatureのmoveFeature関数をオーバーライドし、内のすべての機能への移行を適用し、forループ内でthis.lastPixel =ピクセルを置くことによってそれを解決しました私のレイヤーベクトル。私が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); 
    }; 

`