OpenLayers に基づく Ordnance Survey (これは OpenSpace と呼ばれていると思います) によって作成された API を使用して、サイトリンク テキストを作成しました。地図をクリックしてマーカーを追加できるようにしました。その後、マーカーをクリックして地図上でドラッグできるようにしたいと考えています。OpenSpace または OpenLayers API を使用してこれを行う簡単な方法はありますか。
2 に答える
OpenLayers API を使用すると、マーカーとフィーチャをマップに追加できます。マーカーではなく機能を追加する場合は、次のコードを追加してドラッグ可能にすることができます。
var vectorLayer = new OpenLayers.Layer.Vector("Vector Layer");
var osMap = new OpenSpace.Map('map');
osMap.addLayer(vectorLayer);
var modifyFeaturesControl = new OpenLayers.Control.ModifyFeature(vectorLayer);
modifyFeaturesControl.mode = OpenLayers.Control.ModifyFeature.RESHAPE;
osMap.addControl(modifyFeaturesControl);
modifyFeaturesControl.activate();
これにより、マップ上でフィーチャをドラッグできます。機能がドラッグされたときのカスタム動作を追加したい場合は、vectorLayer にリスナーを登録できます。たとえば、機能が変更されたとき (つまり、ドラッグされて解放されたとき) にリスナーを登録するには、次のコードを使用する必要があります。
vectorLayer.events.register('featuremodified', vectorLayer, function(feature) {
//custom behavior
});
リッスンできるイベントの完全なリストについては、OpenLayers api doc を参照してくださいOpenLayers api doc
これを行う簡単な方法は、ベクターレイヤーをターゲットとするopenlayerドラッグコントロールを使用することです。
ベクトルと呼ばれるアイコンを含むベクトルレイヤー(これは、OLの開発者が使用を推奨しないマーカーよりも優先されます)を想定すると、次のように簡単に実行できます。
var drag=new OpenLayers.Control.DragFeature(vectors);
map.addControl(drag);
drag.activate();
ドラッグコントロールを使用するもう1つの利点は、onStartやonDragなど、機能とピクセル位置を返すさまざまなコールバックにフックできることです。例えば、
var drag=new OpenLayers.Control.DragFeature(vectors,{
'onDrag':function(feature, pixel){
console.log(pixel.x);//this can be used to do something else, such as move another feature
}
});
詳細については、 http://trac.osgeo.org/openlayers/browser/trunk/openlayers/lib/OpenLayers/Control/DragFeature.jsを参照してください。