Merge pull request #4410 from openlayers/v3.11.x

Merge in changes from the 3.11.1 release.

changelog/v3.11.1.md

@@ -0,0 +1,11 @@
+# v3.11.1
+
+## Summary
+
+The v3.11.1 release is a patch release that addresses a few regressions in the v3.11.0 release.  See the [v3.11.0 release notes](https://github.com/openlayers/ol3/releases/tag/v3.11.0) for details on upgrading from v3.10.
+
+## Fixes
+
+ * [#4413](https://github.com/openlayers/ol3/pull/4413) - Revert "Merge pull request #4339 from bartvde/issue-4337" ([@bartvde](https://github.com/bartvde))
+ * [#4412](https://github.com/openlayers/ol3/pull/4412) - Revert "Merge pull request #4344 from bartvde/issue-2844" ([@ahocevar](https://github.com/ahocevar))
+ * [#4408](https://github.com/openlayers/ol3/pull/4408) - Use ratio when calculating ImageWMS width and height ([@ahocevar](https://github.com/ahocevar))

package.json

@@ -1,6 +1,6 @@
 {
   "name": "openlayers",
-  "version": "3.11.0",
+  "version": "3.11.1",
   "description": "Build tools and sources for developing OpenLayers based mapping applications",
   "keywords": [
     "map",

src/ol/image.js

@@ -14,7 +14,7 @@ goog.require('ol.extent');
  * @constructor
  * @extends {ol.ImageBase}
  * @param {ol.Extent} extent Extent.
- * @param {Array.<number>|undefined} resolution Resolution.
+ * @param {number|undefined} resolution Resolution.
  * @param {number} pixelRatio Pixel ratio.
  * @param {Array.<ol.Attribution>} attributions Attributions.
  * @param {string} src Image source URI.
@@ -114,10 +114,7 @@ ol.Image.prototype.handleImageError_ = function() {
  */
 ol.Image.prototype.handleImageLoad_ = function() {
   if (this.resolution === undefined) {
-    this.resolution = [
-      ol.extent.getWidth(this.extent) / this.image_.width,
-      ol.extent.getHeight(this.extent) / this.image_.height
-    ];
+    this.resolution = ol.extent.getHeight(this.extent) / this.image_.height;
   }
   this.state = ol.ImageState.LOADED;
   this.unlistenImage_();

src/ol/imagebase.js

@@ -24,9 +24,7 @@ ol.ImageState = {
  * @constructor
  * @extends {goog.events.EventTarget}
  * @param {ol.Extent} extent Extent.
- * @param {Array.<number>|undefined} resolution Resolution, first value
- *     is the resolution in the x direction, second value is the resolution
- *     in the y direction.
+ * @param {number|undefined} resolution Resolution.
  * @param {number} pixelRatio Pixel ratio.
  * @param {ol.ImageState} state State.
  * @param {Array.<ol.Attribution>} attributions Attributions.
@@ -55,7 +53,7 @@ ol.ImageBase = function(extent, resolution, pixelRatio, state, attributions) {
 
   /**
    * @protected
-   * @type {Array.<number>|undefined}
+   * @type {number|undefined}
    */
   this.resolution = resolution;
 
@@ -109,7 +107,7 @@ ol.ImageBase.prototype.getPixelRatio = function() {
 
 
 /**
- * @return {Array.<number>} Resolution.
+ * @return {number} Resolution.
  */
 ol.ImageBase.prototype.getResolution = function() {
   goog.asserts.assert(this.resolution !== undefined, 'resolution not yet set');

src/ol/imagecanvas.js

@@ -30,8 +30,7 @@ ol.ImageCanvas = function(extent, resolution, pixelRatio, attributions,
   var state = opt_loader !== undefined ?
       ol.ImageState.IDLE : ol.ImageState.LOADED;
 
-  goog.base(this, extent, [resolution, resolution], pixelRatio, state,
-      attributions);
+  goog.base(this, extent, resolution, pixelRatio, state, attributions);
 
   /**
    * @private

src/ol/render/canvas/canvasreplay.js

@@ -344,10 +344,8 @@ ol.render.canvas.Replay.prototype.replay_ = function(
             context.globalAlpha = alpha * opacity;
           }
 
-          var w = width - originX;
-          var h = height - originY;
-          context.drawImage(image, originX, originY, w, h, x, y,
-              w * pixelRatio, h * pixelRatio);
+          context.drawImage(image, originX, originY, width, height,
+              x, y, width * pixelRatio, height * pixelRatio);
 
           if (opacity != 1) {
             context.globalAlpha = alpha;

src/ol/renderer/canvas/canvasimagelayerrenderer.js

@@ -193,19 +193,15 @@ ol.renderer.canvas.ImageLayer.prototype.prepareFrame =
     var imageExtent = image.getExtent();
     var imageResolution = image.getResolution();
     var imagePixelRatio = image.getPixelRatio();
-    var xImageResolution = imageResolution[0];
-    var yImageResolution = imageResolution[1];
-    var xScale = pixelRatio * xImageResolution /
-        (viewResolution * imagePixelRatio);
-    var yScale = pixelRatio * yImageResolution /
+    var scale = pixelRatio * imageResolution /
         (viewResolution * imagePixelRatio);
     ol.vec.Mat4.makeTransform2D(this.imageTransform_,
         pixelRatio * frameState.size[0] / 2,
         pixelRatio * frameState.size[1] / 2,
-        xScale, yScale,
+        scale, scale,
         viewRotation,
-        imagePixelRatio * (imageExtent[0] - viewCenter[0]) / xImageResolution,
-        imagePixelRatio * (viewCenter[1] - imageExtent[3]) / yImageResolution);
+        imagePixelRatio * (imageExtent[0] - viewCenter[0]) / imageResolution,
+        imagePixelRatio * (viewCenter[1] - imageExtent[3]) / imageResolution);
     this.imageTransformInv_ = null;
     this.updateAttributions(frameState.attributions, image.getAttributions());
     this.updateLogos(frameState, imageSource);

src/ol/reproj/image.js

@@ -116,9 +116,8 @@ ol.reproj.Image = function(sourceProj, targetProj,
     attributions = this.sourceImage_.getAttributions();
   }
 
-  goog.base(this, targetExtent, [targetResolution, targetResolution],
-            this.sourcePixelRatio_, state, attributions);
-
+  goog.base(this, targetExtent, targetResolution, this.sourcePixelRatio_,
+            state, attributions);
 };
 goog.inherits(ol.reproj.Image, ol.ImageBase);
 

src/ol/reproj/reproj.js

@@ -93,7 +93,7 @@ ol.reproj.enlargeClipPoint_ = function(centroidX, centroidY, x, y) {
  * @param {number} width Width of the canvas.
  * @param {number} height Height of the canvas.
  * @param {number} pixelRatio Pixel ratio.
- * @param {Array.<number>} sourceResolution Source resolution.
+ * @param {number} sourceResolution Source resolution.
  * @param {ol.Extent} sourceExtent Extent of the data source.
  * @param {number} targetResolution Target resolution.
  * @param {ol.Extent} targetExtent Target extent.
@@ -124,14 +124,12 @@ ol.reproj.render = function(width, height, pixelRatio,
 
   var canvasWidthInUnits = ol.extent.getWidth(sourceDataExtent);
   var canvasHeightInUnits = ol.extent.getHeight(sourceDataExtent);
-  var sourceResolutionX = sourceResolution[0];
-  var sourceResolutionY = sourceResolution[1];
   var stitchContext = ol.dom.createCanvasContext2D(
-      Math.round(pixelRatio * canvasWidthInUnits / sourceResolutionX),
-      Math.round(pixelRatio * canvasHeightInUnits / sourceResolutionY));
+      Math.round(pixelRatio * canvasWidthInUnits / sourceResolution),
+      Math.round(pixelRatio * canvasHeightInUnits / sourceResolution));
 
-  stitchContext.scale(pixelRatio / sourceResolutionX,
-                      pixelRatio / sourceResolutionY);
+  stitchContext.scale(pixelRatio / sourceResolution,
+                      pixelRatio / sourceResolution);
   stitchContext.translate(-sourceDataExtent[0], sourceDataExtent[3]);
 
   sources.forEach(function(src, i, arr) {
@@ -224,8 +222,8 @@ ol.reproj.render = function(width, height, pixelRatio,
     context.translate(sourceDataExtent[0] - sourceNumericalShiftX,
                       sourceDataExtent[3] - sourceNumericalShiftY);
 
-    context.scale(sourceResolutionX / pixelRatio,
-                  -sourceResolutionY / pixelRatio);
+    context.scale(sourceResolution / pixelRatio,
+                  -sourceResolution / pixelRatio);
 
     context.drawImage(stitchContext.canvas, 0, 0);
     context.restore();

src/ol/reproj/tile.js

@@ -258,7 +258,7 @@ ol.reproj.Tile.prototype.reproject_ = function() {
 
   var targetExtent = this.targetTileGrid_.getTileCoordExtent(tileCoord);
   this.canvas_ = ol.reproj.render(width, height, this.pixelRatio_,
-      [sourceResolution, sourceResolution], this.sourceTileGrid_.getExtent(),
+      sourceResolution, this.sourceTileGrid_.getExtent(),
       targetResolution, targetExtent, this.triangulation_, sources,
       this.renderEdges_);
 

src/ol/source/imagemapguidesource.js

@@ -150,7 +150,7 @@ ol.source.ImageMapGuide.prototype.getImageInternal =
 
   var imageUrl = this.imageUrlFunction_(extent, size, projection);
   if (imageUrl !== undefined) {
-    image = new ol.Image(extent, [resolution, resolution], pixelRatio,
+    image = new ol.Image(extent, resolution, pixelRatio,
         this.getAttributions(), imageUrl, this.crossOrigin_,
         this.imageLoadFunction_);
     goog.events.listen(image, goog.events.EventType.CHANGE,

src/ol/source/imagestaticsource.js

@@ -26,12 +26,10 @@ ol.source.ImageStatic = function(options) {
 
   var imageExtent = options.imageExtent;
 
-  var xResolution, yResolution, resolutions, imgResolution;
+  var resolution, resolutions;
   if (options.imageSize !== undefined) {
-    xResolution = ol.extent.getWidth(imageExtent) / options.imageSize[0];
-    yResolution = ol.extent.getHeight(imageExtent) / options.imageSize[1];
-    imgResolution = [xResolution, yResolution];
-    resolutions = [yResolution];
+    resolution = ol.extent.getHeight(imageExtent) / options.imageSize[1];
+    resolutions = [resolution];
   }
 
   var crossOrigin = options.crossOrigin !== undefined ?
@@ -52,8 +50,8 @@ ol.source.ImageStatic = function(options) {
    * @private
    * @type {ol.Image}
    */
-  this.image_ = new ol.Image(imageExtent, imgResolution, 1,
-      attributions, options.url, crossOrigin, imageLoadFunction);
+  this.image_ = new ol.Image(imageExtent, resolution, 1, attributions,
+      options.url, crossOrigin, imageLoadFunction);
   goog.events.listen(this.image_, goog.events.EventType.CHANGE,
       this.handleImageChange, false, this);
 

src/ol/source/imagewmssource.js

@@ -203,21 +203,13 @@ ol.source.ImageWMS.prototype.getImageInternal =
   var centerY = (extent[1] + extent[3]) / 2;
 
   var imageResolution = resolution / pixelRatio;
-
-  // Compute an integer width and height.
-  var width = Math.ceil(ol.extent.getWidth(extent) / imageResolution);
-  var height = Math.ceil(ol.extent.getHeight(extent) / imageResolution);
-
-  // Modify the extent to match the integer width and height.
-  extent[0] = centerX - imageResolution * width / 2;
-  extent[2] = centerX + imageResolution * width / 2;
-  extent[1] = centerY - imageResolution * height / 2;
-  extent[3] = centerY + imageResolution * height / 2;
+  var imageWidth = ol.extent.getWidth(extent) / imageResolution;
+  var imageHeight = ol.extent.getHeight(extent) / imageResolution;
 
   var image = this.image_;
   if (image &&
       this.renderedRevision_ == this.getRevision() &&
-      image.getResolution()[0] == resolution &&
+      image.getResolution() == resolution &&
       image.getPixelRatio() == pixelRatio &&
       ol.extent.containsExtent(image.getExtent(), extent)) {
     return image;
@@ -241,13 +233,13 @@ ol.source.ImageWMS.prototype.getImageInternal =
   };
   goog.object.extend(params, this.params_);
 
-  this.imageSize_[0] = width;
-  this.imageSize_[1] = height;
+  this.imageSize_[0] = Math.ceil(imageWidth * this.ratio_);
+  this.imageSize_[1] = Math.ceil(imageHeight * this.ratio_);
 
   var url = this.getRequestUrl_(extent, this.imageSize_, pixelRatio,
       projection, params);
 
-  this.image_ = new ol.Image(extent, [resolution, resolution], pixelRatio,
+  this.image_ = new ol.Image(extent, resolution, pixelRatio,
       this.getAttributions(), url, this.crossOrigin_, this.imageLoadFunction_);
 
   this.renderedRevision_ = this.getRevision();

test_rendering/spec/ol/layer/image.test.js

@@ -4,16 +4,16 @@ describe('ol.rendering.layer.Image', function() {
 
   var target, map;
 
-  function createMap(renderer, center, zoom) {
+  function createMap(renderer) {
     target = createMapDiv(50, 50);
 
     map = new ol.Map({
       target: target,
       renderer: renderer,
       view: new ol.View({
-        center: center ? center : ol.proj.transform(
+        center: ol.proj.transform(
             [-122.416667, 37.783333], 'EPSG:4326', 'EPSG:3857'),
-        zoom: zoom ? zoom : 5
+        zoom: 5
       })
     });
     return map;
@@ -82,35 +82,6 @@ describe('ol.rendering.layer.Image', function() {
       });
     });
   });
-
-  describe('single image layer with different x and y resolutions', function() {
-    var source;
-
-    beforeEach(function() {
-      source = new ol.source.ImageStatic({
-        url: 'spec/ol/data/dem.jpg',
-        projection: ol.proj.get('EPSG:3857'),
-        alwaysInRange: true,
-        imageSize: [373, 350],
-        imageExtent: [2077922.782144, 5744637.392734, 2082074.999150,
-          5750225.419064]
-      });
-    });
-
-    afterEach(function() {
-      disposeMap(map);
-    });
-
-    it('tests the canvas renderer', function(done) {
-      map = createMap('canvas', [2080687.2732495, 5747435.594262], 10);
-      waitForImages([source], {}, function() {
-        expectResemble(map, 'spec/ol/layer/expected/image-canvas-resxy.png',
-            IMAGE_TOLERANCE, done);
-      });
-    });
-
-  });
-
 });
 
 goog.require('goog.object');

test_rendering/spec/ol/style/icon.test.js

@@ -30,7 +30,7 @@ describe('ol.rendering.style.Icon', function() {
       disposeMap(map);
     });
 
-    function createFeatures(callback, offset) {
+    function createFeatures(callback) {
       var feature;
       feature = new ol.Feature({
         geometry: new ol.geom.Point([0, 0])
@@ -44,7 +44,6 @@ describe('ol.rendering.style.Icon', function() {
             anchorXUnits: 'fraction',
             anchorYUnits: 'pixels',
             opacity: 0.75,
-            offset: offset,
             scale: 0.5,
             img: img,
             imgSize: [32, 48]
@@ -64,14 +63,6 @@ describe('ol.rendering.style.Icon', function() {
       });
     });
 
-    it('tests the canvas renderer with an offset', function(done) {
-      map = createMap('canvas');
-      createFeatures(function() {
-        expectResemble(map, 'spec/ol/style/expected/icon-canvas-offset.png',
-            IMAGE_TOLERANCE, done);
-      }, [10, 10]);
-    });
-
     it('tests the WebGL renderer', function(done) {
       assertWebGL();
       map = createMap('webgl');