如何在OpenLayers 4.2.0中為VectorTile圖層設置范圍？

Question

我目前在“開放圖層4.2.0”中添加了一系列Mapbox VectorTile圖層。 但是會出現問題。 每當我縮小到遠處時，我的整個地圖都會變成灰色，並且控制台中的網絡選項卡將充滿404的解釋，這說明在Mapbox一側找不到磁貼。 這當然是有道理的，因為並非所有加載的圖塊都存在於Mapbox中。

要詳細說明一些代碼：

這是加載Mapbox圖層的位置：

var source = new ol.source.VectorTile({
    format: new ol.format.MVT(),
    tilePixelRatio: 16,
    url: 'https://{a-d}.tiles.mapbox.com/v4/' + layer.id + '/{z}/{x}/{y}.vector.pbf?access_token=' + this.mapboxGlToken
});

return new ol.layer.VectorTile({
    source:        source,
    minResolution: layer.minres,
    maxResolution: layer.maxres,
    style:         this.styles.normal,
    filter:        layer.filter,
    name:          layer.name
});

這實際上將顯示地圖（+矢量圖塊，這是荷蘭各省的紅色邊框）：

萬歲！ 但是，如果我在Firefox的“網絡”標簽中查看：

Mapbox有很多404錯誤。 起初，我以為我可以忽略這些，但它們會使我的整個應用程序停止渲染任何其他圖塊，這很煩人。 我認為發生這種情況是因為“開放層”試圖加載在Mapbox層邊界之外的圖塊。

我用谷歌搜索了很多，並嘗試了很多。 這是我嘗試過的：

關於Open VectorTile 4.2.0中的VectorTile的文檔指定了一個名為TileGrid的選項（ http://openlayers.org/en/latest/apidoc/ol.source.VectorTile.html ）。 我已經嘗試了許多該功能的衍生產品，但這並不能解決我的問題。 它要么不再渲染任何東西，要么凍結我的瀏覽器，以保留原始問題。 我也不知道它是如何工作的，但是說它有一個范圍選項，我想我可以試試看。

那么，如何設置圖層范圍？ 如何告訴圖層僅將切片從{x1,y1}加載到{x2,y2} ？ 老實說，我不知道，我們將不勝感激。

Answer 1

原來，我在混淆ol.source.VectorTile和ol.layer.VectorTile （源或層）。 ol.layer.VectorTile '確實具有一個范圍選項，這是設置它的正確方法。

設置范圍有一些古怪之處。 每個mapbox tileet都有其自身的范圍（或稱為邊界）：

邊界需要從lat1, lng1, lat2, lng2為像素（如果我錯了，請改正我）。 做到這一點的方法是從網絡控制台運行：

ol.proj.fromLonLat([lat1, lng1]).concat(ol.proj.fromLonLat([lat2, lng2]))

這將為您提供正確的范圍。

此范圍需要這樣實現：

new ol.layer.VectorTile({
    source:        source,
    extent:        [convertedlat1, convertedLng1, convertedLat2, convertedLng2], // <---
    minResolution: layer.minres,
    maxResolution: layer.maxres,
    style:         this.styles.normal,
    filter:        layer.filter,
    name:          layer.name
});