OpenLayers 地图环绕。重复的地图区域给出无效坐标

OpenLayers map wraps. Repeated map areas give invalid coordinates

我正在使用 OpenLayers 在我的网站上显示世界地图。地图绕到任一侧,并且在重复的部分中,坐标是疯狂的。

地图上的图钉可以移动。如果我们将它们移到重复的部分,而不是获取地球上那个点的实际坐标,我们会得到一个无效的坐标集,这会使该图钉完全从地图上消失。

这是我用于地图的代码:

    this.maps.vectorSource = new ol.source.Vector({
      });

    this.maps.vectorLayer = new ol.layer.Vector({
        source: self.maps.vectorSource
      });

      this.maps.rasterLayer = new ol.layer.Tile({
            source: new ol.source.OSM({wrapDateLine: false})
      });

      this.maps.map = new ol.Map({
        target: 'map',
        interactions: ol.interaction.defaults({mouseWheelZoom:false}),
        layers: [self.maps.rasterLayer, self.maps.vectorLayer],
        view: new ol.View({
          center: ol.proj.transform([-98.583333, 37.833333], 'EPSG:4326', 'EPSG:3857'),
          zoom: 4
        })
      });

你可以看到我已经尝试将 wrapDateLine 选项设置为 false,但据我所知这没有任何效果。

我想通过防止地图重复或确保重复部分报告正确的坐标来解决这个问题。在这一点上,我不太关心哪个。我有什么想法可以实现这两个结果之一吗?

根据您的 OpenLayers 版本,您可能需要使用不同的选项来禁用水平重复。尝试将以下选项添加到您的 OSM 源:

wrapX: false,
noWrap: true

我制作了一个 jsFiddle,其中稍微修改了您的代码版本来说明: https://jsfiddle.net/fg1oxpu0/

安东尼的回答让我朝着正确的方向前进。我们使用的是不支持 wrapX 的 OL 3.1.1。我更新到 3.2.0 并且能够关闭环绕。然而,这造成了一个 UX 问题(地图现在在任一侧结束,用户需要手动移回另一侧)和 UI 问题(我们用于地图显示的大区域现在大部分是空的) .

我尝试升级到最新版本 (3.7.0),我注意到它开始包装矢量图层。 (矢量环绕在 OL 3 的移动中丢失了,但后来恢复了。)这让我可以重新打开我的地图环绕,并且在地图的每次重复上绘制图钉。即使在重复的地图上,它现在也能报告正确的坐标。