mapbox：在低缩放比例下避免重复图层

Question

我遇到了我的图层在低缩放比例下进行复制的问题。

使用mapbox-gl-leaflet，它将Mapbox Map与传单结合在一起。但是首先我正在使用mapbox图层，所以似乎问题出在mapbox中。

这是代码示例：

var map = L.map('map',  {minZoom: 1 }).setView([38.912753, -77.032194], 1);

var gl = L.mapboxGL({
    accessToken: "access_token",
    style: 'mapbox://styles/mapbox/bright-v8'
}).addTo(map);

gl._glMap.on('load', () => {

  gl._glMap.addLayer({
   "id": "line-example",
    "type": "line",
    "source": {
      "type": "geojson",
        "data": {
          "type": "Feature",
          "properties": {},
          "geometry": {
            "type": "LineString",
            "coordinates": [[28.2, 60.0], [-10, -13]]
          }
        }
    },
    "layout": {
      "line-join": "round",
      "line-cap": "round"
    },
    "paint": {
      "line-color": "rgba(13, 12, 39, .7)",
      "line-width": 6
    }
  });
});

结果如下：

如何解决重复问题？我需要我的图层仅出现在一个“世界”中。

Answer 1

尝试添加maxBounds [ [-180, -85], [180, 85] ]

Answer 2

通过将renderWorldCopies设置为false，可以防止地图渲染世界（和图层）的多个副本。

类似的事情会起作用：

var gl = L.mapboxGL({
    accessToken: "access_token",
    style: 'mapbox://styles/mapbox/bright-v8',
    renderWorldCopies: false,
}).addTo(map);

有关更多选项，请在此处查看API规范：https://docs.mapbox.com/mapbox-gl-js/api/