diff --git a/src/ol/renderer/canvas/canvaslayerrenderer.js b/src/ol/renderer/canvas/canvaslayerrenderer.js index 9022170cd6..8ce6f7cc4b 100644 --- a/src/ol/renderer/canvas/canvaslayerrenderer.js +++ b/src/ol/renderer/canvas/canvaslayerrenderer.js @@ -1,5 +1,6 @@ goog.provide('ol.renderer.canvas.Layer'); +goog.require('goog.array'); goog.require('goog.vec.Mat4'); goog.require('ol.layer.Layer'); goog.require('ol.render.Event'); @@ -163,3 +164,37 @@ ol.renderer.canvas.Layer.prototype.getTransform = function(frameState) { -view2DState.rotation, -view2DState.center[0], -view2DState.center[1]); }; + + +/** + * @param {CanvasRenderingContext2D} context Context. + * @param {ol.Size} size Size. + * @return {boolean} True when the canvas with the current size does not exceed + * the maximum dimensions. + */ +ol.renderer.canvas.Layer.testCanvasSize = (function() { + + /** + * @type {ImageData} + */ + var testImageData = null; + + return function(context, size) { + var x = size[0] - 1; + var y = size[1] - 1; + var originalImageData = context.getImageData(x, y, 1, 1); + if (goog.isNull(testImageData)) { + testImageData = context.createImageData(1, 1); + var data = testImageData.data; + data[0] = 42; + data[1] = 84; + data[2] = 126; + data[3] = 255; + } + context.putImageData(testImageData, x, y); + var result = context.getImageData(x, y, 1, 1); + var good = goog.array.equals(testImageData.data, result.data); + context.putImageData(originalImageData, x, y); + return good; + }; +})(); diff --git a/src/ol/renderer/canvas/canvastilelayerrenderer.js b/src/ol/renderer/canvas/canvastilelayerrenderer.js index 724af798d0..89b5e93f63 100644 --- a/src/ol/renderer/canvas/canvastilelayerrenderer.js +++ b/src/ol/renderer/canvas/canvastilelayerrenderer.js @@ -44,6 +44,12 @@ ol.renderer.canvas.TileLayer = function(mapRenderer, tileLayer) { */ this.canvasSize_ = null; + /** + * @private + * @type {boolean} + */ + this.canvasTooBig_ = false; + /** * @private * @type {CanvasRenderingContext2D} @@ -203,17 +209,23 @@ ol.renderer.canvas.TileLayer.prototype.prepareFrame = this.canvas_ = context.canvas; this.canvasSize_ = [canvasWidth, canvasHeight]; this.context_ = context; + this.canvasTooBig_ = + !ol.renderer.canvas.Layer.testCanvasSize(context, this.canvasSize_); } else { goog.asserts.assert(!goog.isNull(this.canvasSize_)); goog.asserts.assert(!goog.isNull(this.context_)); canvas = this.canvas_; context = this.context_; if (this.canvasSize_[0] < canvasWidth || - this.canvasSize_[1] < canvasHeight) { - // Canvas is too small, make it bigger + this.canvasSize_[1] < canvasHeight || + (this.canvasTooBig_ && (this.canvasSize_[0] > canvasWidth || + this.canvasSize_[1] > canvasHeight))) { + // Canvas is too small or too big, resize it canvas.width = canvasWidth; canvas.height = canvasHeight; this.canvasSize_ = [canvasWidth, canvasHeight]; + this.canvasTooBig_ = + !ol.renderer.canvas.Layer.testCanvasSize(context, this.canvasSize_); this.renderedCanvasTileRange_ = null; } else { canvasWidth = this.canvasSize_[0];