Openlayers 3中心地图

时间:2015-01-07 13:39:59

标签: javascript openlayers-3

我正在唱OpenLayers 3来显示地图。我想使用latLon坐标使地图居中。 我正在使用quickstart code开头。 使用此代码,我无法更改地图的中心。我认为这与Spherical Mercator projection有关。唯一的问题是,我只有lat lon坐标。

有谁知道如何从openlayers v3中心地图?

3 个答案:

答案 0 :(得分:25)

您需要使用

将lon / lat坐标转换为正确的投影(或坐标系)
var olCoordinates = ol.proj.transform([lon, lat],"WGS84", "EPSG:900913")

现在您可以使用olCorrdinates设置中心。

不同的投影具有不同的代码名称。 WGS84是“普通”lon / lat和EPSG:900913是网络地图中经常使用的投影,如谷歌地图,openstreetmap和bing。

我认为OpenLayers 3内置支持从WGS84 / EPSG转换:4326(lon / lat),但是如果你需要转换到其他坐标系或从其他坐标系转换,你可以包含proj4js库。 Openlayers将与此lib集成,并能够以相同的方式进行转换。

转换文档 http://openlayers.org/en/v3.1.1/apidoc/ol.proj.html

Proj4 lib https://github.com/proj4js/proj4js

编辑: 在您所参考的示例中,中心位置实际上是使用lon / lat设置的。

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 :(得分:9)

OpenLayers介绍了ol.proj.fromLonLatol.proj.toLonLat函数on Mar. 2015

要使地图居中,您可能希望在初始化期间使用它

public void insertHeadline(int id){

    String text = getString(id);
    TextView headline = (TextView) inflater.inflate(R.layout.layout_text_headline, null, false);
    headline.setText(text);

    //add this TextView to the empty container
    myLinearLayoutContainerView.addView(headline);

}

或创建地图后

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

虽然它们是just wrappersol.proj.transform,但我发现它们更易于使用。

默认的Web Mercators是map.getView().setCenter(ol.proj.fromLonLat([lon, lat])) EPSG:4326

Ole Borgersen states一样,EPSG:3857WGS84相同,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')

答案 2 :(得分:0)

取决于您的使用方式吗?

仅用于浏览器:

<script src='https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js'></script>


  ol.proj.transform() 

  ol.proj.transform([long, lat], 'EPSG:4326', 'EPSG:3857');

对于js-app使用

   // for projection
  import {transform} from 'ol/proj.js';

  // use this one : transform([-118.246521, 34.049039], 'EPSG:4326', 'EPSG:3857')





   var map = new Map({
    layers: layers,
    target: 'map',
    view: new View({
      //center: [-118.246521, 34.049039],
        center: transform([-118.246521, 34.049039], 'EPSG:4326', 'EPSG:3857'),
      zoom: 16
    })
  });
相关问题