2015-01-07 9 views
13

私はOpenLayers 3と歌うことができます。私はlatLon座標を使って地図を中心にしたいと思います。 まず、quickstart codeを使用しています。 このコードを使用して、地図の中心を変更することはできません。私はこれがSpherical Mercator projectionと関係があると思います。唯一のことは、私は緯度経度座標しか持っていない。Openlayers 3中心部

誰かがopenlayers v3からマップをセンターする方法を知っていますか?

答えて

22

あなたは今、あなたはolCorrdinatesでセンターを設定することができます

var olCoordinates = ol.proj.transform([lon, lat],"WGS84", "EPSG:900913") 

を使用して正しい投影に経度/緯度座標を変換(または座標系)にする必要があります。

異なる投影には異なるコード名があります。 WGS84は「普通」のlon/latで、EPSG:900913はGoogleマップ、openstreetmap、bingなどのWebマップで頻繁に使用されるプロジェクションです。

OpenLayers 3はWGS84/EPSG:4326(lon/lat)からの変換をサポートしていますが、他の座標系に変換する必要がある場合は、proj4jsライブラリを組み込むことができます。 Openlayersはこのlibと統合され、同じ方法で変換を行うことができます。

https://github.com/proj4js/proj4js

編集libにドキュメントに http://openlayers.org/en/v3.1.1/apidoc/ol.proj.html

にProj4を変換: をご参照のうえにされている例では、中心位置は、実際には/緯度経度で設定されています。

view: new ol.View({ 
    center: ol.proj.transform([37.41, 8.82], 'EPSG:4326', 'EPSG:3857'), 
    zoom: 4 
}) 

EPSG:4326は実際にはWGS84と同じで、EPSG:3857はEPSG:900913と同じです。これは非常に混乱しています。私は自分自身にいました。

37.41と8.82の数字をあなたのlon/lat座標に変更するだけです。初期化後に中心の場所を変更する場合は、setCenter()を使用する必要があります。

map.getView().setCenter(ol.proj.transform([lon, lat], 'EPSG:4326', 'EPSG:3857')) 
+1

「WGS84」、「EPSG:900913」とは何ですか?私はこれらのことを多くのサイトで見ていますが、それが何であるかは分かりません。 – SheperdOfFire

+3

地図投影または座標系です。世界を測定するには複数の方法がありますが、これらはコードネームであり、コードネームは異なる方法で行います。 WGS84はlon/lat、EPSG:900913はopenstreetmap、google、bingなどで使用されているものです。また、世界を小さな四角形で囲み、メトリックシステムを座標として使用するUTM投影のようなものもあります。 –

+2

また、引数の順序も注意してください。 ol.proj.transformメソッドでは[経度、緯度]が必要ですが、一部のプログラムでは引数の緯度/経度の順番が使用されます。たとえば、Googleマップのコンテキストメニューから「ここにあるもの」を選択すると、その場所は緯度/経度として表示されます。 –

7

OpenLayersをはol.proj.fromLonLatol.proj.toLonLat機能on Mar. 2015を導入しました。

マップを中央に、あなたが初期化

view: new ol.View({ 
     center: ol.proj.fromLonLat([lon, lat]) 
     }) 

または彼らはol.proj.transformjust wrappersだが、マップが

map.getView().setCenter(ol.proj.fromLonLat([lon, lat])) 

を作成した後に中にそれを使用したい場合があり、私はそれらを見つけますより使いやすい。

デフォルトのWebマーケターはEPSG:4326EPSG:3857です。

Ole Borgersen statesのように、WGS84は、私たちが使用しているLong-Lat座標のタイプであるEPSG:4326と同じです。

ol.proj.fromLonLat([lon, lat]); 
// is equivalent of 
ol.proj.transform([lon, lat], 'EPSG:4326', 'EPSG:3857') 

ol.proj.toLonLat([lon, lat]); 
// is equivalent of 
ol.proj.transform([lon, lat], 'EPSG:3857', 'EPSG:4326')