Use source minzoom if not configured otherwise

src/ol/layer/MapboxVector.js

@@ -197,9 +197,11 @@ const SourceType = {
  * @property {number} [minResolution] The minimum resolution (inclusive) at which this layer will be
  * visible.
  * @property {number} [maxResolution] The maximum resolution (exclusive) below which this layer will
- * be visible.
- * @property {number} [minZoom] The minimum view zoom level (exclusive) above which this layer will be
- * visible.
+ * be visible. If neither `maxResolution` nor `minZoom` are defined, the layer's `maxResolution` will
+ * match the style source's `minzoom`.
+ * @property {number} [minZoom] The minimum view zoom level (exclusive) above which this layer will
+ * be visible. If neither `maxResolution` nor `minZoom` are defined, the layer's `minZoom` will match
+ * the style source's `minzoom`.
  * @property {number} [maxZoom] The maximum view zoom level (inclusive) at which this layer will
  * be visible.
  * @property {import("../render.js").OrderFunction} [renderOrder] Render order. Function to be used when sorting
@@ -298,6 +300,9 @@ class MapboxVectorLayer extends VectorTileLayer {
       properties: options.properties,
     });
 
+    this.setMaxResolutionFromTileGrid_ =
+      options.maxResolution === undefined && options.minZoom === undefined;
+
     this.sourceId = options.source;
     this.layers = options.layers;
 
@@ -517,6 +522,10 @@ class MapboxVectorLayer extends VectorTileLayer {
         tile.getFeatures().unshift(renderFeature);
       });
     }
+    if (this.setMaxResolutionFromTileGrid_) {
+      const tileGrid = targetSource.getTileGrid();
+      this.setMaxResolution(tileGrid.getResolution(tileGrid.getMinZoom()));
+    }
     targetSource.setState(SourceState.READY);
   }
 

test/browser/spec/ol/layer/MapboxVector.test.js

@@ -131,6 +131,55 @@ describe('ol/layer/MapboxVector', () => {
     });
   });
 
+  describe('maxResolution', function () {
+    const styleUrl =
+      'data:,' +
+      encodeURIComponent(
+        JSON.stringify({
+          version: 8,
+          sources: {
+            'foo': {
+              tiles: ['/spec/ol/data/{z}-{x}-{y}.vector.pbf'],
+              type: 'vector',
+              minzoom: 6,
+            },
+          },
+          layers: [],
+        })
+      );
+
+    it('accepts minZoom from configuration', function (done) {
+      const layer = new MapboxVectorLayer({
+        minZoom: 5,
+        styleUrl: styleUrl,
+      });
+      const source = layer.getSource();
+      source.on('change', function onchange() {
+        if (source.getState() === 'ready') {
+          source.un('change', onchange);
+          expect(layer.getMaxResolution()).to.be(Infinity);
+          done();
+        }
+      });
+    });
+
+    it('uses minZoom from source', function (done) {
+      const layer = new MapboxVectorLayer({
+        styleUrl: styleUrl,
+      });
+      const source = layer.getSource();
+      source.on('change', function onchange() {
+        if (source.getState() === 'ready') {
+          source.un('change', onchange);
+          expect(layer.getMaxResolution()).to.be(
+            source.getTileGrid().getResolution(6)
+          );
+          done();
+        }
+      });
+    });
+  });
+
   describe('background', function () {
     it('adds a feature for the background', function (done) {
       const layer = new MapboxVectorLayer({