打开图层检查功能是否在视口中

Question

我的目的是仅显示在我的 map 视口（当前显示的地图区域）内具有坐标的要素。

我通过执行以下操作来获得视口的范围：

var mapExtent = this.map.getView().calculateExtent(this.map.getSize());
mapExtent = ol.proj.transformExtent(mapExtent, 'EPSG:3857', 'EPSG:4326');

然后，在我正在读取一家商店的元素的循环中，

var point = ol.proj.fromLonLat([
      element.get('longitude'),
      element.get('latitude')
]);

elementPoint = new ol.geom.Point(point);
var feature = new ol.Feature(elementPoint);
var coordsFeatures = feature.getGeometry().getCoordinates();

之后，为了快速查看该点是否在我的视口内，我只使用控制台日志：

console.log(ol.extent.containsXY(mapExtent, coordsFeatures[0],coordsFeatures[1]));
/*if(!ol.extent.containsXY(mapExtent, coordsFeatures[0],coordsFeatures[1])){
     return true;
}*/

但我不知道为什么，结果只是假的，即使在当前显示的map区域内肯定有点。

我做错了什么？

Answer 1

您正在混合预测。

对于范围，您从 3857 更改为 4326。

对于这一点，通过应用ol.proj.fromLonLat() ，您可以从 4326 更改为 3857 （默认值）

只需使用 3857 或 4326 即可

Answer 2

所以我会发布正确的代码以防其他人需要它。 正如@GH（再次感谢）所提到的，我的问题是混合投影，所以我以这种方式更改了我的代码：

而不是使用坐标，我得到了特征的范围：

var extentFeature = feature.getGeometry().getExtent();

在我应用了与 map 相同的 transformExtent 之后：

extentFeature = ol.proj.transformExtent(extentFeature, 'EPSG:3857', 'EPSG:4326');

if(!ol.extent.containsExtent(mapExtent, extentFeature)){
   return true;
}

现在它可以工作了：：D