OpenLayer 5:按像素值移动地图中心

Question

>我有一个由以下人员生成的 openlayers 5 地图：

// create the map with the proper center
var map = new ol.Map(
    {
        view: new ol.View(
            {
                center: ol.proj.fromLonLat([center.long, center.lat]),
                zoom: zoom
            }
        ),
        layers: [
            new ol.layer.Tile(
                {
                    source: new ol.source.OSM()
                }
            )
        ],
        target: 'mapdiv',
    }
);

我想点击一个元素将地图的中心移动 [10， 10] 像素，我正在尝试这样的事件：

document.getElementById('mover').onclick = function() {
  center = map.getView().getCenter();
  map.view.setCenter(center[0] + 10, center[1] + 10);
  return false;
};

但它不起作用，它破坏了地图。

实现搬家的正确方法是什么？

Answer 1

map.view会导致错误，应该map.getView() 您需要将像素乘以分辨率（即米/像素）才能将移动距离从像素转换为米

var center = map.getView().getCenter();
var resolution = map.getView().getResolution();
map.getView().setCenter([center[0] + 10*resolution, center[1] + 10*resolution]);

Answer 2

如示例文档中所述 高级视图定位 它应该由view.centerOn(coordinate, size, position);完成 你可以在这里找到详细的API 中心在 API