2

ページに 2 つの openlayer マップを作成しましたが、これらを同期して動作させたいと考えています。

たとえば、あるマップの中心またはズームが変更され、それに応じて別のマップが変更されたとします。

およびその逆。

どのイベントをマップに登録すればよいですか？

4

1 に答える 1

1

私がやったばかりなので、これは確かに可能です。パンまたはズームされているマップから 'moveend' および 'move' イベントをトラップする必要があります (moveend はズームの最後にトリガーされますが、安全のために 'zoomend' もトラップできます)。親マップをコンテキストとして使用してこれらをトラップすると、新しいマップの中心を取得できます。ナビゲーション コントロールが使用されていて、ズームがマウスを使用して行われている場合、マップをズームするとマップの中心が変わる可能性があることに注意してください。次に、moveTo メソッド (childmap.moveTo()) を使用します。

私は moveTo メソッドを選択しました (十分に文書化されていませんが)。これは、マップ上のパンまたはズーム イベントで常に最終的に呼び出されるものです。余談ですが、moveTo を呼び出すと、'move'、'moveend' イベントも子マップでトリガーされます。

json を使用してマップのコレクションを作成し、jQuery を使用する場合、実際のコードは次のようになります (OpenLayers でマップ イベントをトラップする方法を知っていると仮定しています)。

var newCentre = zoomedMap.getCenter();

$.each(maps, function (ind, map) {
            if (map !== zoomedMap) map.moveTo(newCentre, newZoom);
        });

ここで、maps はマップのコレクション、zoomedMap はユーザーが実際にパンまたはズーム イベントをトリガーしたマップです (これを zoomeMap と呼びましたが、同じように簡単に pannedMap と呼ぶこともできます)、(明らかに) map は移動が必要なコレクション。

上記のコードに落ち着く前に、少し遊んでみました。ここでの利点は、 $.each が moveTo 関数が戻るのを待たないことです。そのため、より滑らかに見える同期が得られます。もちろん、2 つのマップのみを同期する場合、これは実際には問題にはなりません。

質問がされてからかなり経ってから投稿して申し訳ありませんが、新しい検索者の助けになるかもしれません。

于 2014-03-30T16:13:16.870 に答える