diff --git a/src/symbol/sprite_atlas.js b/src/symbol/sprite_atlas.js index e4df0e03294..6dbcf3d5c39 100644 --- a/src/symbol/sprite_atlas.js +++ b/src/symbol/sprite_atlas.js @@ -21,7 +21,7 @@ class SpriteAtlas extends Evented { this.data = false; this.texture = 0; // WebGL ID this.filter = 0; // WebGL ID - this.pixelRatio = 1; + this.pixelRatio = browser.devicePixelRatio > 1 ? 2 : 1; this.dirty = true; } @@ -52,11 +52,11 @@ class SpriteAtlas extends Evented { width = pixels.width; height = pixels.height; pixels = browser.getImageData(pixels); - pixelRatio = this.pixelRatio; + pixelRatio = 1; } else { width = options.width; height = options.height; - pixelRatio = options.pixelRatio || this.pixelRatio; + pixelRatio = options.pixelRatio || 1; } if (ArrayBuffer.isView(pixels)) { @@ -81,7 +81,7 @@ class SpriteAtlas extends Evented { width: width / pixelRatio, height: height / pixelRatio, sdf: false, - pixelRatio: 1 + pixelRatio: pixelRatio / this.pixelRatio }; this.images[name] = image; @@ -195,13 +195,9 @@ class SpriteAtlas extends Evented { } setSprite(sprite) { - if (sprite) { - this.pixelRatio = browser.devicePixelRatio > 1 ? 2 : 1; - - if (this.canvas) { - this.canvas.width = this.width * this.pixelRatio; - this.canvas.height = this.height * this.pixelRatio; - } + if (sprite && this.canvas) { + this.canvas.width = this.width * this.pixelRatio; + this.canvas.height = this.height * this.pixelRatio; } this.sprite = sprite; } diff --git a/test/integration/render-tests/runtime-styling/image-add-1x-image-1x-screen/expected.png b/test/integration/render-tests/runtime-styling/image-add-1x-image-1x-screen/expected.png new file mode 100644 index 00000000000..da6dbe02373 Binary files /dev/null and b/test/integration/render-tests/runtime-styling/image-add-1x-image-1x-screen/expected.png differ diff --git a/test/integration/render-tests/runtime-styling/image-add/style.json b/test/integration/render-tests/runtime-styling/image-add-1x-image-1x-screen/style.json similarity index 95% rename from test/integration/render-tests/runtime-styling/image-add/style.json rename to test/integration/render-tests/runtime-styling/image-add-1x-image-1x-screen/style.json index 674adc3bb88..97fad3bf076 100644 --- a/test/integration/render-tests/runtime-styling/image-add/style.json +++ b/test/integration/render-tests/runtime-styling/image-add-1x-image-1x-screen/style.json @@ -8,7 +8,7 @@ [ "addImage", "marker", - "./image/marker.png" + "./sprites/1x.png" ], [ "addLayer", diff --git a/test/integration/render-tests/runtime-styling/image-add-1x-image-2x-screen/expected.png b/test/integration/render-tests/runtime-styling/image-add-1x-image-2x-screen/expected.png new file mode 100644 index 00000000000..309f787dcc1 Binary files /dev/null and b/test/integration/render-tests/runtime-styling/image-add-1x-image-2x-screen/expected.png differ diff --git a/test/integration/render-tests/runtime-styling/image-add-1x-image-2x-screen/style.json b/test/integration/render-tests/runtime-styling/image-add-1x-image-2x-screen/style.json new file mode 100644 index 00000000000..57bd8adee83 --- /dev/null +++ b/test/integration/render-tests/runtime-styling/image-add-1x-image-2x-screen/style.json @@ -0,0 +1,41 @@ +{ + "version": 8, + "metadata": { + "test": { + "width": 64, + "height": 64, + "pixelRatio": 2, + "operations": [ + [ + "addImage", + "marker", + "./sprites/1x.png" + ], + [ + "addLayer", + { + "id": "geometry", + "type": "symbol", + "source": "geometry", + "layout": { + "icon-image": "marker" + } + } + ], + [ + "wait" + ] + ] + } + }, + "sources": { + "geometry": { + "type": "geojson", + "data": { + "type": "Point", + "coordinates": [0, 0] + } + } + }, + "layers": [] +} diff --git a/test/integration/render-tests/runtime-styling/image-add-2x-image-1x-screen/expected.png b/test/integration/render-tests/runtime-styling/image-add-2x-image-1x-screen/expected.png new file mode 100644 index 00000000000..07895f2b64a Binary files /dev/null and b/test/integration/render-tests/runtime-styling/image-add-2x-image-1x-screen/expected.png differ diff --git a/test/integration/render-tests/runtime-styling/image-add-2x-image-1x-screen/style.json b/test/integration/render-tests/runtime-styling/image-add-2x-image-1x-screen/style.json new file mode 100644 index 00000000000..472f3f52bd6 --- /dev/null +++ b/test/integration/render-tests/runtime-styling/image-add-2x-image-1x-screen/style.json @@ -0,0 +1,42 @@ +{ + "version": 8, + "metadata": { + "test": { + "width": 64, + "height": 64, + "pixelRatio": 1, + "operations": [ + [ + "addImage", + "marker", + "./sprites/2x.png", + 2 + ], + [ + "addLayer", + { + "id": "geometry", + "type": "symbol", + "source": "geometry", + "layout": { + "icon-image": "marker" + } + } + ], + [ + "wait" + ] + ] + } + }, + "sources": { + "geometry": { + "type": "geojson", + "data": { + "type": "Point", + "coordinates": [0, 0] + } + } + }, + "layers": [] +} diff --git a/test/integration/render-tests/runtime-styling/image-add-2x-image-2x-screen/expected.png b/test/integration/render-tests/runtime-styling/image-add-2x-image-2x-screen/expected.png new file mode 100644 index 00000000000..efe3e87dd4e Binary files /dev/null and b/test/integration/render-tests/runtime-styling/image-add-2x-image-2x-screen/expected.png differ diff --git a/test/integration/render-tests/runtime-styling/image-add-2x-image-2x-screen/style.json b/test/integration/render-tests/runtime-styling/image-add-2x-image-2x-screen/style.json new file mode 100644 index 00000000000..8c84fa532bb --- /dev/null +++ b/test/integration/render-tests/runtime-styling/image-add-2x-image-2x-screen/style.json @@ -0,0 +1,42 @@ +{ + "version": 8, + "metadata": { + "test": { + "width": 64, + "height": 64, + "pixelRatio" :2, + "operations": [ + [ + "addImage", + "marker", + "./sprites/2x.png", + 2 + ], + [ + "addLayer", + { + "id": "geometry", + "type": "symbol", + "source": "geometry", + "layout": { + "icon-image": "marker" + } + } + ], + [ + "wait" + ] + ] + } + }, + "sources": { + "geometry": { + "type": "geojson", + "data": { + "type": "Point", + "coordinates": [0, 0] + } + } + }, + "layers": [] +} diff --git a/test/integration/render-tests/runtime-styling/image-add/expected.png b/test/integration/render-tests/runtime-styling/image-add/expected.png deleted file mode 100644 index a88d85daa6f..00000000000 Binary files a/test/integration/render-tests/runtime-styling/image-add/expected.png and /dev/null differ diff --git a/test/suite_implementation.js b/test/suite_implementation.js index b322c63e665..f5353e8d294 100644 --- a/test/suite_implementation.js +++ b/test/suite_implementation.js @@ -104,7 +104,8 @@ function applyOperations(map, operations, callback) { } else if (operation[0] === 'addImage') { const img = PNG.sync.read(fs.readFileSync(path.join(__dirname, './integration', operation[2]))); - map.addImage(operation[1], img.data, {height: img.height, width: img.width, pixelRatio: 1}); + const pixelRatio = operation.length > 3 ? operation[3] : 1; + map.addImage(operation[1], img.data, {height: img.height, width: img.width, pixelRatio: pixelRatio}); applyOperations(map, operations.slice(1), callback); } else {