Question

我正在开发一个应用程序，我从服务器获取用户位置，然后将其显示在地图上。

我也提供了一个角度，这样我就可以显示用户正在查看的方向。

还有可能打开侧面板以获取更多信息。在这种情况下，我必须向左移动地图中心，我喜欢这样。

var center = map.getView().getCenter();

var pan = ol.animation.pan({
    duration: 500,
    source: (center)
});

if (isSidePanelVisible) {
    center[0] += 1000;
} else {
    center[0] -= 1000;
}

map.beforeRender(pan);
map.getView().setCenter(center);

当用户“向北”看时，这很有用，但是当我以一定角度旋转地图时却没有。是否有一种快速的方法来平移地图总是留下一定数量的角度？

Answer 1

您可以使用ol.Map.html#getPixelFromCoordinate将中心转换为像素坐标，进行计算，然后使用ol.Map.html#getCoordinateFromPixel转换回实际坐标：

var view = map.getView();
var center = view.getCenter();
var centerInPx = map.getPixelFromCoordinate(center);
var newCenterInPx = [centerInPx[0] - 100, centerInPx[1]];
var newCenter = map.getCoordinateFromPixel(newCenterInPx);
view.setCenter(newCenter);

http://jsfiddle.net/6mh110xv/1/

Answer 2

要向左，向右，从底部到顶部平移，可以使用以下代码：

panMap(direction: string) {
    let newCenterInPx;
    let center = map.getView().getCenter();
    let centerInPx = map.getPixelFromCoordinate(center);

    switch (direction) {
      case 'left': newCenterInPx = [centerInPx[0] - 100, centerInPx[1]]; break;
      case 'right': newCenterInPx = [centerInPx[0] + 100, centerInPx[1]]; break;
      case 'top': newCenterInPx = [centerInPx[0], centerInPx[1] - 100]; break;
      case 'bottom': newCenterInPx = [centerInPx[0], centerInPx[1] + 100]; break;
    }
    var newCenter = map.getCoordinateFromPixel(newCenterInPx);
    map.getView().setCenter(newCenter);

  }

Openlayers 3 pan map始终向左

2 个答案: