diff --git a/src/render/draw_debug.js b/src/render/draw_debug.js index 58266cf6f10..3b157fdf788 100644 --- a/src/render/draw_debug.js +++ b/src/render/draw_debug.js @@ -43,7 +43,9 @@ function drawDebugTile(painter, sourceCache, coord) { const tileRawData = sourceCache.getTileByID(coord.key).latestRawTileData; const tileByteLength = (tileRawData && tileRawData.byteLength) || 0; const tileSizeKb = Math.floor(tileByteLength / 1024); - const vertices = createTextVertices(`${coord.toString()} ${tileSizeKb}kb`, 50, 200, 5); + const tileSize = sourceCache.getTile(coord).tileSize; + const scaleRatio = 512 / Math.min(tileSize, 512); + const vertices = createTextVertices(`${coord.toString()} ${tileSizeKb}kb`, 50, 200 * scaleRatio, 5 * scaleRatio); const debugTextArray = new PosArray(); const debugTextIndices = new LineIndexArray(); for (let v = 0; v < vertices.length; v += 2) { @@ -56,9 +58,21 @@ function drawDebugTile(painter, sourceCache, coord) { // Draw the halo with multiple 1px lines instead of one wider line because // the gl spec doesn't guarantee support for lines with width > 1. - const tileSize = sourceCache.getTile(coord).tileSize; - const onePixel = EXTENT / (Math.pow(2, painter.transform.zoom - coord.overscaledZ) * tileSize); - const translations = [[-1, -1], [-1, 1], [1, -1], [1, 1]]; + const onePixel = EXTENT / (Math.pow(2, painter.transform.zoom - coord.overscaledZ) * tileSize * scaleRatio); + + const haloWidth = 1; + const translations = []; + for (let x = -haloWidth; x <= haloWidth; x++) { + for (let y = -haloWidth; y <= haloWidth; y++) { + if (x === 0 && y === 0) { + // don't draw the halo at 0,0 since the text is drawn there + break; + } + + translations.push([x, y]); + } + } + for (let i = 0; i < translations.length; i++) { const translation = translations[i]; diff --git a/test/integration/render-tests/debug/raster/expected.png b/test/integration/render-tests/debug/raster/expected.png new file mode 100644 index 00000000000..b3308e5126b Binary files /dev/null and b/test/integration/render-tests/debug/raster/expected.png differ diff --git a/test/integration/render-tests/debug/raster/style.json b/test/integration/render-tests/debug/raster/style.json new file mode 100644 index 00000000000..bcd9988a49f --- /dev/null +++ b/test/integration/render-tests/debug/raster/style.json @@ -0,0 +1,46 @@ +{ + "version": 8, + "metadata": { + "test": { + "debug": true, + "height": 256 + } + }, + "center": [ + 13.418056, + 52.499167 + ], + "zoom": 16, + "sources": { + "satellite": { + "type": "raster", + "tiles": [ + "local://tiles/{z}-{x}-{y}.satellite.png" + ], + "maxzoom": 17, + "tileSize": 256 + } + }, + "glyphs": "local://glyphs/{fontstack}/{range}.pbf", + "sprite": "local://sprites/sprite", + "layers": [ + { + "id": "background", + "type": "background", + "paint": { + "background-color": "white" + } + }, + { + "id": "raster", + "type": "raster", + "source": "satellite", + "layout": { + }, + "paint": { + "raster-opacity": 1, + "raster-fade-duration": 0 + } + } + ] +}