私は、OpenLayersに基づいたOrdnance Survey(これはOpenSpaceと呼ばれる)のAPIを使用してlink textというサイトを作成しました。地図をクリックしてマーカーを追加すると、マーカーをクリックしてマップ上でドラッグできるようになります。 OpenSpaceまたはOpenLayers APIを使用してこれを行う簡単な方法はありますか?Ordnance Survey/Openlayersでマーカーをドラッグapi
2
A
答えて
6
OpenLayers APIを使用すると、マーカーとフィーチャーをマップに追加できます。 MarkerではなくFeaturesを追加すると、次のコードを追加することでマーカーをドラッグ可能にすることができます。
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にリスナーを登録できます。例えば、フィーチャーが修正(すなわちドラッグされ、リリースされた)時にリスナーを登録するには、次のコードを使用する必要があります。ベクトル層をとり、これを行うための簡単な方法は、openlayerドラッグコントロールを使用しているとしてOpenLayersをAPIのドキュメントOpenLayers api doc
1
を見て聞くことができるイベントの完全なリストについては、
vectorLayer.events.register('featuremodified', vectorLayer, function(feature) {
//custom behavior
});
ターゲット。
var drag=new OpenLayers.Control.DragFeature(vectors);
map.addControl(drag);
drag.activate();
ドラッグコントロールを使用しての他の利点は次のとおりです、ベクトルと呼ばれるアイコンを含むベクトル層を(これはOLの開発者が使用して思いとどまらマーカーに好まれている)、あなたは、単に行うことができと仮定
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を参照してください。
関連する問題
- 1. リーフレット円でドラッグするマーカー
- 2. matplotlibのドラッグ可能なマーカー
- 3. ドラッグ中にマーカーの中央にマーカーを置く
- 4. GoogleマップAPI v3にドラッグ可能なマーカーを読む新しい位置
- 5. GoogleマップV 3.8とドラッグ可能マーカー
- 6. Googleマップのマーカーのドラッグ&ズームの問題
- 7. Google Maps API - マーカー
- 8. ドラッグ可能なマーカーからマーカーの新しい位置を保存 - GoogleマップV3
- 9. 選択をスキップし、MapKitマーカーで直接ドラッグする
- 10. Googleマップでドラッグ可能マーカー位置(lat、lng)を取得する
- 11. Bing Maps V8 Javascript APIでOrdnance Surveyのオプションを削除するにはどうすればよいですか?
- 12. Google apiにマーカーを追加
- 13. Google Maps APIでマーカー機能を追加
- 14. Google Maps API - ポリラインに沿って定義した点のポリラインでドラッグ可能なマーカーを保持する
- 15. ポリゴンオーバーレイをドラッグする - リーフレットオープンソースマップAPI
- 16. Android - マップを保持することなくマーカーをドラッグする
- 17. Android:マーカーを中央に維持しながら地図をドラッグ
- 18. Google Map APIマーカーの番号?
- 19. Google Maps API v3マーカー座標
- 20. Googleマップandroid api v2マーカー影
- 21. Google MapのAPIマーカーJavascript
- 22. Google Map API - マーカーの削除
- 23. Googleマップapi。複数のマーカー
- 24. 同時に2つのGoogle Mapsマーカーをドラッグする
- 25. マップの外側のマーカーをhtml要素にドラッグ
- 26. マーカーをドラッグ可能にしてクリック可能にする
- 27. mapbox android sdk - ドラッグ可能なマーカーを作成する方法
- 28. iOS向けGoogleマップSDKを使用したドラッグ可能なマーカー
- 29. Javascriptを使用してGoogleマップでマーカーを正しくドラッグできない
- 30. マーカーをマーカーに追加した後にマーカーをマーカーに追加する方法android google maps api
私はちょうど上記のコードを使用し、1つの問題とは別に問題なく動作します。マーカーをドラッグ/移動してズームインまたはズームアウトすると、ベクター機能が消えます。何か案は? – nickdos