javascript - OpenLayers - 在 map View 上调用 setZoom() 后 getCooperativeFromPixel 的返回值保持不变

Question

我有一个用例，我想确定某些坐标是否位于视口(viewport)中可见的 View 部分内。我们的方法是首先使用 map 的 getCoordinateFromPixel 方法获取一些像素的坐标。这是可行的，但问题是我们还想以编程方式放大。我们注意到，在 map View 上调用 setZoom 之前和之后，使用完全相同的参数在 map 上调用 getCooperativeFromPixel 返回完全相同的结果。奇怪的是(？)我们还注意到，当我们在 map 上两次调用 getCooperativeFromPixel 之间手动放大时，结果确实会发生变化。

以这个脚本为例:

import 'ol/ol.css';
import Map from 'ol/Map';
import View from 'ol/View';
import VectorLayer from 'ol/layer/Vector';
import VectorSource from 'ol/source/Vector';
import GeoJSON from 'ol/format/GeoJSON';
import Feature from 'ol/Feature';

let markerView = new View({
    center: [5000, 1000],
    zoom: 2,
});

let map = new Map({
  target: 'map-container',
  layers: [
    new VectorLayer({
      source: new VectorSource({
        format: new GeoJSON(),
        url: './data/countries.json'
      }),
    })
  ],
  view: markerView
});

window.setTimeout(() => {
    console.log(JSON.stringify(map.getCoordinateFromPixel([0, 0])));
    map.getView().setZoom(5);
}, 2000);
window.setTimeout(() => {
    console.log(JSON.stringify(map.getCoordinateFromPixel([0, 0])));
}, 4000);

当在 OpenLayers 项目中执行此操作时，2000 毫秒后运行的闭包将在控制台上打印与 4000 毫秒后运行的闭包完全相同的内容，即使我们已经非常显着地放大了!

我想知道是否有人知道解决方法、修复方法或只是原因。我尝试查看 map 触发的事件，以便在处理程序中重新执行 getCooperativeFromPixel ，但我还没有找到当我们(以编程方式)更改缩放时 map 触发的事件。

如果需要，我很乐意提供更多详细信息。

提前非常感谢，

约书亚

Answer 1

如果您有范围和 map 大小，您可以轻松计算像素的坐标，而无需依赖 getCooperativeFromPixel ，由于某种原因，它不会立即更新(它已由预合成事件更新)。 x 坐标存在微小差异(800 万范围内大约 100 米)，但不足以显着。

map.getView().on(['change:resolution','change:center'], function() {
  var size = map.getSize();
  var extent = this.calculateExtent(size);
  var coordinate = [
    extent[0] + (extent[2]-extent[0]) * pixel[0]/size[0],
    extent[1] + (extent[3]-extent[1]) * (size[1]-pixel[1])/size[1]
  ];
  console.log(JSON.stringify(extent));
  console.log(JSON.stringify(coordinate));  // as expected
  console.log(JSON.stringify(map.getCoordinateFromPixel(pixel)));  // hasn't been updated
});

.

map.getView().on(['change:resolution','change:center'], function() {
  map.once('precompose', function() {
    console.log(JSON.stringify(map.getCoordinateFromPixel(pixel)));
  });
});