緯度と経度に対する画面座標

Question

オープンレイヤーライブラリで、以下はスクリーン座標を緯度と経度に変換するために使用される方法です。このメソッドがカプセル化するロジックを理解できませんか？

getLatLonFromPoint: function (point) {
    var center = this.getCenter();
    //map center lat/lon
    var res  = this.getResolution(); 
    //pre defined by the user. Represents the change in lat long per screen unit at the given zoom level
    var size = this.getSize(); 
    //this is the width and height of the div in which the map has to be displayed
    var delta_x = point.x - (size.w / 2);
    var delta_y = point.y - (size.h / 2);
    return new OpenLayers.LatLon(
        center.lat - delta_y * res,
        center.lon + delta_x * res );
   }

誰かがいくつかのポインタを提供してもらえますか？

Answer 1

この関数は、マップの現在の解像度、現在のマップの中心点の緯度と経度、および選択したポイントが中心点からの距離に基づいて、指定したポイントの緯度と経度を計算します地図。

var center = this.getCenter();
//map center lat/lon
var res  = this.getResolution(); 
//pre defined by the user. Represents the change in lat long ...
var size = this.getSize(); 

上記のコードは、計算に必要な情報を収集します。現在のマップビューの中心点（中心点の緯度/経度が表示されます）、現在のマップ解像度、および現在のマップサイズユーザー画面（画面サイズなどの影響を受ける可能性があります）。

その後、計算は次のようになります：

    //this is the width and height of the div in which the map has to be displayed
    var delta_x = point.x - (size.w / 2);
    var delta_y = point.y - (size.h / 2);

まずx座標（ピクセル単位）を取得し、マップの幅（ピクセル単位）を減算します。これにより、0がマップの中心ピクセルである新しいx座標が得られます。 delta-xは、-（size.w / 2）〜+（size.w / 2）の範囲のピクセル値になります。 その後、y座標についても同じことを行います。 したがって、delta-xとdelta-yは、地図の中心を原点とするデカルト座標になりました。

    return new OpenLayers.LatLon(
        center.lat - delta_y * res,
        center.lon + delta_x * res );

delta-xとdelta-yをピクセルからlat / lonに変換する必要があります。まず、delta-xとdelta-yに現在の解像度を掛けます。これにより、正しい縮尺が得られますが、正しい原点は得られません。 center.latおよびcentre.lon adustsを追加して、現在表示されている地図に基づいてlat / lonを提供します。

最後に、「新しいOpenLayers.LatLon」呼び出しは、上記の計算をLatLonオブジェクトにラップするだけなので、関数からLatLonオブジェクトとして返されます。

編集：ピクセルを使用する場合、x座標の増加は通常「右に移動」を意味し、y座標の増加は通常「上に移動」を意味します。地図上で経度を大きくすると、通常「右に移動」します。ただし、Latitudeは逆さまです。 Latitudeを上げると、通常、地図上で「下に移動」します。

Hence Latitudeは、画面上の通常のy座標スキームとは反対の方向に機能します。したがって、最終的な計算では、centre.latにはマイナスが使用されますが、centre.lonにはプラスが使用されます。

Answer 2

既存のコメントを再配置し、さらに追加し、空白を追加しました。うまくいけば、これがより明確になります。

getLatLonFromPoint: function (point) {
    // point is the x and y screen coordinate

    // map center lat/lon
    var center = this.getCenter();

    // pre defined by the user. Represents the change in lat long per screen unit at the given zoom level
    var res  = this.getResolution(); 

    // this is the width and height of the screen (div) in which the map has to be displayed
    var size = this.getSize(); 

    // this is the distance of the point from the center of the screen (div)
    var delta_x = point.x - (size.w / 2);
    var delta_y = point.y - (size.h / 2);

    // return the latitude and longitude
    //   these are calculated from the center lat/lon using the 
    //   screen distances which are scaled (multiplied) by the resolution
    return new OpenLayers.LatLon(
        center.lat - delta_y * res,
        center.lon + delta_x * res );
   }

Answer 3

これを試してください：

map.events.register("mousemove", map, function(e) { 
    var position = this.events.getMousePosition(e);
    var p = map.getLonLatFromPixel(new OpenLayers.Pixel(position.x, position.y));
    // your longitude value = p.lon;
    // your latitude value = p.lat;
});