fix bug causing overzoomed tiles to disappear (#4567)

* fix overzoomed tiles when source has

* check for maxzoom when determining if a tile is within bounds

* add regression test

src/source/raster_tile_source.js

@@ -68,7 +68,7 @@ class RasterTileSource extends Evented {
     }
 
     hasTile(coord) {
-        return !this.tileBounds || this.tileBounds.contains(coord);
+        return !this.tileBounds || this.tileBounds.contains(coord, this.maxzoom);
     }
 
     loadTile(tile, callback) {

src/source/tile_bounds.js

@@ -10,12 +10,16 @@ class TileBounds {
         this.maxzoom = maxzoom || 24;
     }
 
-    contains(coord) {
+    contains(coord, maxzoom) {
+        // TileCoord returns incorrect z for overscaled tiles, so we use this
+        // to make sure overzoomed tiles still get displayed.
+        const tileZ = maxzoom ? Math.min(coord.z, maxzoom) : coord.z;
+
         const level = {
-            minX: Math.floor(this.lngX(this.bounds.getWest(), coord.z)),
-            minY: Math.floor(this.latY(this.bounds.getNorth(), coord.z)),
-            maxX: Math.ceil(this.lngX(this.bounds.getEast(), coord.z)),
-            maxY: Math.ceil(this.latY(this.bounds.getSouth(), coord.z))
+            minX: Math.floor(this.lngX(this.bounds.getWest(), tileZ)),
+            minY: Math.floor(this.latY(this.bounds.getNorth(), tileZ)),
+            maxX: Math.ceil(this.lngX(this.bounds.getEast(), tileZ)),
+            maxY: Math.ceil(this.latY(this.bounds.getSouth(), tileZ))
         };
         const hit = coord.x >= level.minX && coord.x < level.maxX && coord.y >= level.minY && coord.y < level.maxY;
         return hit;

src/source/vector_tile_source.js

@@ -59,7 +59,7 @@ class VectorTileSource extends Evented {
     }
 
     hasTile(coord) {
-        return !this.tileBounds || this.tileBounds.contains(coord);
+        return !this.tileBounds || this.tileBounds.contains(coord, this.maxzoom);
     }
 
     onAdd(map) {

test/integration/render-tests/regressions/mapbox-gl-js#4564/style.json

@@ -0,0 +1,43 @@
+{
+  "version": 8,
+  "metadata": {
+    "test": {
+      "height": 64,
+      "width":64
+    }
+  },
+  "center": [
+    13.418056,
+    52.499167
+  ],
+  "zoom": 16,
+  "sources": {
+    "mapbox": {
+      "type": "vector",
+      "maxzoom": 14,
+      "tiles": [
+        "local://tiles/{z}-{x}-{y}.mvt"
+      ],
+      "bounds":[[13.4043671, 52.4959407], [13.43183291,52.502459]]
+    }
+  },
+  "layers": [
+    {
+      "id": "background",
+      "type": "background",
+      "paint": {
+        "background-color": "white"
+      }
+    },
+    {
+      "id": "road",
+      "type": "line",
+      "source": "mapbox",
+      "source-layer": "road",
+      "paint": {
+        "line-width": 2,
+        "line-color": "#000"
+      }
+    }
+  ]
+}