OpenLayers 3 fitExtent 没有按预期工作

Question

我正在使用 OpenLayers 3 显示单个图像。我正在尝试编写一个将缩放的函数，以便图像的左侧接触到容器的左侧，图像的右侧接触到容器的右侧。图像的顶部和底部是否在视图之外无关紧要。

我把投影范围设置成和图片分辨率一样：

var extent = [0, 0, 2480, 3508];
projection = new ol.proj.Projection({
    code: 'image',
    units: 'pixels',
    extent: extent
});

我在控制台 window 中使用代码试验 fitExtent 函数：

map.getView().fitExtent([0,0,2480,3508],map.getSize())

我得到的结果与我预期的不太一样。图像居中，但看起来比我预期的要小得多。我期待至少图像的顶部和底部接触容器的顶部和底部。

解释为什么会发生这种情况会很棒。一个贴合图片所以左边在左边右边在右边的方案（一个zoomToExtentY函数）就更好了

Example fiddle...

Answer 1

感谢@bartvde 的评论，我能够通过首先计算最长轴的分辨率使 fitExtent() 按我预期的方式工作：

    var imgW = extent[2];
    var imgH = extent[3];
    var boxW = document.getElementById('map').offsetWidth;
    var boxH = document.getElementById('map').offsetHeight;

    var xRes = imgW / boxW;
    var yRes = imgH / boxH;
    var maxRes = xRes < yRes ? yRes : xRes;

然后设置默认地图视图的最大分辨率：

view: new ol.View({
    projection: projection,
    center: ol.extent.getCenter(extent),
    zoom: 0,
    maxResolution:maxRes
})

我的另一个要求是设置缩放级别，使图像的左侧和右侧接触容器的左侧和右侧，通过将视图的分辨率设置为 x 轴的分辨率来解决：

    //set the resolution to that of the xAxis.
    map.getView().setResolution(xRes);

请参阅 this fiddle 以了解上述两种设置的实际应用示例。

OpenLayers 3 fitExtent 没有按预期工作

OpenLayers 3 fitExtent not working as expected

javascript

gis

openlayers-3