我正在使用OpenLayers 3展示地图。我想使用经纬度坐标来居中地图。
我正在使用快速入门代码开始学习。但是,使用这段代码后,我无法更改地图的中心点。我认为这可能与球形墨卡托投影
有关。唯一的问题是,我只有经纬度坐标。
有没有人知道如何在 OpenLayers v3 中使地图居中?
我正在使用OpenLayers 3展示地图。我想使用经纬度坐标来居中地图。
我正在使用快速入门代码开始学习。但是,使用这段代码后,我无法更改地图的中心点。我认为这可能与球形墨卡托投影
有关。唯一的问题是,我只有经纬度坐标。
有没有人知道如何在 OpenLayers v3 中使地图居中?
var olCoordinates = ol.proj.transform([lon, lat],"WGS84", "EPSG:900913")
现在你可以使用olCorrdinates来设置中心点。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这两个数字更改为你的经纬度坐标即可。如果你想在初始化后更改中心位置,你需要使用setCenter()方法。
map.getView().setCenter(ol.proj.transform([lon, lat], 'EPSG:4326', 'EPSG:3857'))
OpenLayers在2015年3月引入了ol.proj.fromLonLat
和ol.proj.toLonLat
函数。
为了将地图居中,您可以在初始化期间使用它。
view: new ol.View({
center: ol.proj.fromLonLat([lon, lat])
})
或者在地图创建后
map.getView().setCenter(ol.proj.fromLonLat([lon, lat]))
虽然它们只是ol.proj.transform的封装,但我觉得它们更易于使用。
默认的Web Mercators是EPSG:4326
和EPSG:3857
。
就像Ole Borgersen所述, WGS84
与我们通常使用的经纬度坐标类型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')
<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');
For js-app use
// 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
})
});