Merge pull request #3387 from ahocevar/wmts-wrapx

Add wrapX option for ol.source.WMTS

examples/wmts-layer-from-capabilities.js

@@ -2,7 +2,6 @@ goog.require('ol.Map');
 goog.require('ol.View');
 goog.require('ol.format.WMTSCapabilities');
 goog.require('ol.layer.Tile');
-goog.require('ol.proj');
 goog.require('ol.source.OSM');
 goog.require('ol.source.WMTS');
 
@@ -14,8 +13,6 @@ $.ajax('data/WMTSCapabilities.xml').then(function(response) {
   var options = ol.source.WMTS.optionsFromCapabilities(result,
       {layer: 'layer-7328', matrixSet: 'EPSG:3857'});
 
-  var projection = ol.proj.get('EPSG:3857');
-  var projectionExtent = projection.getExtent();
   map = new ol.Map({
     layers: [
       new ol.layer.Tile({
@@ -24,7 +21,6 @@ $.ajax('data/WMTSCapabilities.xml').then(function(response) {
       }),
       new ol.layer.Tile({
         opacity: 1,
-        extent: projectionExtent,
         source: new ol.source.WMTS(options)
       })
     ],

examples/wmts.js

@@ -35,7 +35,6 @@ var map = new ol.Map({
     }),
     new ol.layer.Tile({
       opacity: 0.7,
-      extent: projectionExtent,
       source: new ol.source.WMTS({
         attributions: [attribution],
         url: 'http://services.arcgisonline.com/arcgis/rest/' +
@@ -49,7 +48,8 @@ var map = new ol.Map({
           resolutions: resolutions,
           matrixIds: matrixIds
         }),
-        style: 'default'
+        style: 'default',
+        wrapX: true
       })
     })
   ],

externs/olx.js

@@ -5540,7 +5540,8 @@ olx.source.StaticVectorOptions.prototype.urls;
  *     urls: (Array.<string>|undefined),
  *     tileClass: (function(new: ol.ImageTile, ol.TileCoord,
  *                          ol.TileState, string, ?string,
- *                          ol.TileLoadFunctionType)|undefined)}}
+ *                          ol.TileLoadFunctionType)|undefined),
+ *     wrapX: (boolean|undefined)}}
  * @api
  */
 olx.source.WMTSOptions;
@@ -5699,6 +5700,14 @@ olx.source.WMTSOptions.prototype.tileLoadFunction;
 olx.source.WMTSOptions.prototype.urls;
 
 
+/**
+ * Whether to wrap the world horizontally. Default is `false`.
+ * @type {boolean|undefined}
+ * @api
+ */
+olx.source.WMTSOptions.prototype.wrapX;
+
+
 /**
  * @typedef {{attributions: (Array.<ol.Attribution>|undefined),
  *     crossOrigin: (null|string|undefined),
@@ -6480,7 +6489,8 @@ olx.tilegrid;
  *     origins: (Array.<ol.Coordinate>|undefined),
  *     resolutions: !Array.<number>,
  *     tileSize: (number|undefined),
- *     tileSizes: (Array.<number>|undefined)}}
+ *     tileSizes: (Array.<number>|undefined),
+ *     widths: (Array.<number>|undefined)}}
  * @api
  */
 olx.tilegrid.TileGridOptions;
@@ -6503,8 +6513,8 @@ olx.tilegrid.TileGridOptions.prototype.origin;
 
 
 /**
- * Origins. If given, the array should match the `resolutions` array, i.e.
+ * Origins. If given, the array length should match the length of the
- * each resolution can have a different origin.
+ * `resolutions` array, i.e. each resolution can have a different origin.
  * @type {Array.<ol.Coordinate>|undefined}
  * @api stable
  */
@@ -6512,7 +6522,9 @@ olx.tilegrid.TileGridOptions.prototype.origins;
 
 
 /**
- * Resolutions.
+ * Resolutions. The array index of each resolution needs to match the zoom
+ * level. This means that even if a `minZoom` is configured, the resolutions
+ * array will have a length of `maxZoom + 1`.
  * @type {!Array.<number>}
  * @api stable
  */
@@ -6528,21 +6540,31 @@ olx.tilegrid.TileGridOptions.prototype.tileSize;
 
 
 /**
- * Tile sizes. If given, the array should match the `resolutions` array, i.e.
+ * Tile sizes. If given, the array length should match the length of the
- * each resolution can have a different tile size.
+ * `resolutions` array, i.e. each resolution can have a different tile size.
  * @type {Array.<number>|undefined}
  * @api stable
  */
 olx.tilegrid.TileGridOptions.prototype.tileSizes;
 
 
+/**
+ * Widths in tiles. If given, the array length should match the length of the
+ * `resolutions` array, i.e. each resolution will have a number of tile columns.
+ * @type {Array.<number>|undefined}
+ * @api
+ */
+olx.tilegrid.TileGridOptions.prototype.widths;
+
+
 /**
  * @typedef {{origin: (ol.Coordinate|undefined),
  *     origins: (Array.<ol.Coordinate>|undefined),
  *     resolutions: !Array.<number>,
  *     matrixIds: !Array.<string>,
  *     tileSize: (number|undefined),
- *     tileSizes: (Array.<number>|undefined)}}
+ *     tileSizes: (Array.<number>|undefined),
+ *     widths: (Array.<number>|undefined)}}
  * @api
  */
 olx.tilegrid.WMTSOptions;
@@ -6557,7 +6579,8 @@ olx.tilegrid.WMTSOptions.prototype.origin;
 
 
 /**
- * Origins.
+ * Origins. The length of this array needs to match the length of the
+ * `resolutions` array.
  * @type {Array.<ol.Coordinate>|undefined}
  * @api
  */
@@ -6565,7 +6588,9 @@ olx.tilegrid.WMTSOptions.prototype.origins;
 
 
 /**
- * Resolutions.
+ * Resolutions. The array index of each resolution needs to match the zoom
+ * level. This means that even if a `minZoom` is configured, the resolutions
+ * array will have a length of `maxZoom + 1`
  * @type {!Array.<number>}
  * @api
  */
@@ -6573,7 +6598,8 @@ olx.tilegrid.WMTSOptions.prototype.resolutions;
 
 
 /**
- * matrix IDs.
+ * matrix IDs. The length of this array needs to match the length of the
+ * `resolutions` array.
  * @type {!Array.<string>}
  * @api
  */
@@ -6589,13 +6615,23 @@ olx.tilegrid.WMTSOptions.prototype.tileSize;
 
 
 /**
- * Tile sizes.
+ * Tile sizes. The length of this array needs to match the length of the
+ * `resolutions` array.
  * @type {Array.<number>|undefined}
  * @api
  */
 olx.tilegrid.WMTSOptions.prototype.tileSizes;
 
 
+/**
+ * Widths in tiles. If given, the array length should match the length of the
+ * `resolutions` array, i.e. each resolution will have a number of tile columns.
+ * @type {Array.<number>|undefined}
+ * @api
+ */
+olx.tilegrid.WMTSOptions.prototype.widths;
+
+
 /**
  * @typedef {{extent: (ol.Extent|undefined),
  *     maxZoom: (number|undefined),

src/ol/attribution.js

@@ -77,8 +77,8 @@ ol.Attribution.prototype.intersectsAnyTileRange =
       if (testTileRange.intersects(tileRange)) {
         return true;
       }
-      var extentTileRange = tileGrid.getTileRangeForExtentAndZ(
+      var extentTileRange = tileGrid.getTileRange(
-          ol.tilegrid.extentFromProjection(projection), parseInt(zKey, 10));
+          parseInt(zKey, 10), projection);
       var width = extentTileRange.getWidth();
       if (tileRange.minX < extentTileRange.minX ||
           tileRange.maxX > extentTileRange.maxX) {

src/ol/source/tilesource.js

@@ -224,12 +224,11 @@ ol.source.Tile.prototype.getWrapXTileCoord =
     function(tileCoord, opt_projection) {
   var projection = goog.isDef(opt_projection) ?
       opt_projection : this.getProjection();
-  if (goog.isDef(this.wrapX_) && projection.isGlobal()) {
+  var tileGrid = this.getTileGridForProjection(projection);
-    var tileGrid = this.getTileGridForProjection(projection);
+  if (goog.isDef(this.wrapX_) && tileGrid.isGlobal(tileCoord[0], projection)) {
-    var extent = ol.tilegrid.extentFromProjection(projection);
     return this.wrapX_ ?
-        ol.tilecoord.wrapX(tileCoord, tileGrid, extent) :
+        ol.tilecoord.wrapX(tileCoord, tileGrid, projection) :
-        ol.tilecoord.clipX(tileCoord, tileGrid, extent);
+        ol.tilecoord.clipX(tileCoord, tileGrid, projection);
   } else {
     return tileCoord;
   }

src/ol/source/wmtssource.js

@@ -3,7 +3,6 @@ goog.provide('ol.source.WMTSRequestEncoding');
 
 goog.require('goog.array');
 goog.require('goog.asserts');
-goog.require('goog.math');
 goog.require('goog.object');
 goog.require('goog.string');
 goog.require('goog.uri.utils');
@@ -170,7 +169,6 @@ ol.source.WMTS = function(options) {
   }
 
   var tmpExtent = ol.extent.createEmpty();
-  var tmpTileCoord = [0, 0, 0];
   tileUrlFunction = ol.TileUrlFunction.withTileCoordTransform(
       /**
        * @param {ol.TileCoord} tileCoord Tile coordinate.
@@ -188,16 +186,6 @@ ol.source.WMTS = function(options) {
         var tileExtent = tileGrid.getTileCoordExtent(tileCoord, tmpExtent);
         var extent = projection.getExtent();
 
-        if (!goog.isNull(extent) && projection.isGlobal()) {
-          var numCols = Math.ceil(
-              ol.extent.getWidth(extent) /
-              ol.extent.getWidth(tileExtent));
-          x = goog.math.modulo(x, numCols);
-          tmpTileCoord[0] = tileCoord[0];
-          tmpTileCoord[1] = x;
-          tmpTileCoord[2] = tileCoord[2];
-          tileExtent = tileGrid.getTileCoordExtent(tmpTileCoord, tmpExtent);
-        }
         if (!ol.extent.intersects(tileExtent, extent) ||
             ol.extent.touches(tileExtent, extent)) {
           return null;
@@ -215,7 +203,8 @@ ol.source.WMTS = function(options) {
     tileGrid: tileGrid,
     tileLoadFunction: options.tileLoadFunction,
     tilePixelRatio: options.tilePixelRatio,
-    tileUrlFunction: tileUrlFunction
+    tileUrlFunction: tileUrlFunction,
+    wrapX: goog.isDef(options.wrapX) ? options.wrapX : false
   });
 
 };
@@ -348,7 +337,7 @@ ol.source.WMTS.optionsFromCapabilities = function(wmtsCap, config) {
   goog.asserts.assert(!goog.isNull(l));
 
   goog.asserts.assert(l['TileMatrixSetLink'].length > 0);
-  var idx, matrixSet;
+  var idx, matrixSet, wrapX;
   if (l['TileMatrixSetLink'].length > 1) {
     idx = goog.array.findIndex(l['TileMatrixSetLink'],
         function(elt, index, array) {
@@ -372,6 +361,13 @@ ol.source.WMTS.optionsFromCapabilities = function(wmtsCap, config) {
 
   goog.asserts.assert(!goog.isNull(matrixSet));
 
+  var wgs84BoundingBox = l['WGS84BoundingBox'];
+  if (goog.isDef(wgs84BoundingBox)) {
+    var wgs84ProjectionExtent = ol.proj.get('EPSG:4326').getExtent();
+    wrapX = (wgs84BoundingBox[0] == wgs84ProjectionExtent[0] &&
+        wgs84BoundingBox[2] == wgs84ProjectionExtent[2]);
+  }
+
   var format = /** @type {string} */ (l['Format'][0]);
   if (goog.isDef(config['format'])) {
     format = config['format'];
@@ -463,7 +459,8 @@ ol.source.WMTS.optionsFromCapabilities = function(wmtsCap, config) {
     requestEncoding: requestEncoding,
     tileGrid: tileGrid,
     style: style,
-    dimensions: dimensions
+    dimensions: dimensions,
+    wrapX: wrapX
   };
 
   /* jshint +W069 */

src/ol/tilecoord.js

@@ -143,15 +143,15 @@ ol.tilecoord.toString = function(tileCoord) {
 /**
  * @param {ol.TileCoord} tileCoord Tile coordinate.
  * @param {ol.tilegrid.TileGrid} tilegrid Tile grid.
- * @param {ol.Extent} extent Extent.
+ * @param {ol.proj.Projection} projection Projection.
  * @return {ol.TileCoord} Tile coordinate.
  */
 ol.tilecoord.wrapX = (function() {
   var tmpTileCoord = [0, 0, 0];
-  return function(tileCoord, tileGrid, extent) {
+  return function(tileCoord, tileGrid, projection) {
     var z = tileCoord[0];
     var x = tileCoord[1];
-    var tileRange = tileGrid.getTileRangeForExtentAndZ(extent, z);
+    var tileRange = tileGrid.getTileRange(z, projection);
     if (x < tileRange.minX || x > tileRange.maxX) {
       x = goog.math.modulo(x, tileRange.getWidth());
       return ol.tilecoord.createOrUpdate(z, x, tileCoord[2], tmpTileCoord);
@@ -164,11 +164,12 @@ ol.tilecoord.wrapX = (function() {
 /**
  * @param {ol.TileCoord} tileCoord Tile coordinate.
  * @param {ol.tilegrid.TileGrid} tileGrid Tile grid.
- * @param {ol.Extent} extent Extent.
+ * @param {ol.proj.Projection} projection Projection.
  * @return {ol.TileCoord} Tile coordinate.
  */
-ol.tilecoord.clipX = function(tileCoord, tileGrid, extent) {
+ol.tilecoord.clipX = function(tileCoord, tileGrid, projection) {
+  var z = tileCoord[0];
   var x = tileCoord[1];
-  var tileRange = tileGrid.getTileRangeForExtentAndZ(extent, tileCoord[0]);
+  var tileRange = tileGrid.getTileRange(z, projection);
   return (x < tileRange.minX || x > tileRange.maxX) ? null : tileCoord;
 };

src/ol/tilegrid/tilegrid.js

@@ -65,7 +65,7 @@ ol.tilegrid.TileGrid = function(options) {
   this.origins_ = null;
   if (goog.isDef(options.origins)) {
     this.origins_ = options.origins;
-    goog.asserts.assert(this.origins_.length == this.maxZoom + 1);
+    goog.asserts.assert(this.origins_.length == this.resolutions_.length);
   }
   goog.asserts.assert(
       (goog.isNull(this.origin_) && !goog.isNull(this.origins_)) ||
@@ -78,7 +78,7 @@ ol.tilegrid.TileGrid = function(options) {
   this.tileSizes_ = null;
   if (goog.isDef(options.tileSizes)) {
     this.tileSizes_ = options.tileSizes;
-    goog.asserts.assert(this.tileSizes_.length == this.maxZoom + 1);
+    goog.asserts.assert(this.tileSizes_.length == this.resolutions_.length);
   }
 
   /**
@@ -92,6 +92,16 @@ ol.tilegrid.TileGrid = function(options) {
       (!goog.isDef(this.tileSize_) && !goog.isNull(this.tileSizes_)) ||
       (goog.isDef(this.tileSize_) && goog.isNull(this.tileSizes_)));
 
+  /**
+   * @private
+   * @type {Array.<number>}
+   */
+  this.widths_ = null;
+  if (goog.isDef(options.widths)) {
+    this.widths_ = options.widths;
+    goog.asserts.assert(this.widths_.length == this.resolutions_.length);
+  }
+
 };
 
 
@@ -373,6 +383,25 @@ ol.tilegrid.TileGrid.prototype.getTileCoordResolution = function(tileCoord) {
 };
 
 
+/**
+ * @param {number} z Zoom level.
+ * @param {ol.proj.Projection} projection Projection.
+ * @param {ol.TileRange=} opt_tileRange Tile range.
+ * @return {ol.TileRange} Tile range.
+ */
+ol.tilegrid.TileGrid.prototype.getTileRange =
+    function(z, projection, opt_tileRange) {
+  var projectionExtentTileRange = this.getTileRangeForExtentAndZ(
+      ol.tilegrid.extentFromProjection(projection), z);
+  var width = this.getWidth(z);
+  if (!goog.isDef(width)) {
+    width = projectionExtentTileRange.getWidth();
+  }
+  return ol.TileRange.createOrUpdate(
+      0, width - 1, 0, projectionExtentTileRange.getHeight(), opt_tileRange);
+};
+
+
 /**
  * @param {number} z Z.
  * @return {number} Tile size.
@@ -389,6 +418,19 @@ ol.tilegrid.TileGrid.prototype.getTileSize = function(z) {
 };
 
 
+/**
+ * @param {number} z Zoom level.
+ * @return {number|undefined} Width for the specified zoom level or `undefined`
+ *     if unknown.
+ */
+ol.tilegrid.TileGrid.prototype.getWidth = function(z) {
+  if (!goog.isNull(this.widths_)) {
+    goog.asserts.assert(this.minZoom <= z && z <= this.maxZoom);
+    return this.widths_[z];
+  }
+};
+
+
 /**
  * @param {number} resolution Resolution.
  * @return {number} Z.
@@ -399,6 +441,26 @@ ol.tilegrid.TileGrid.prototype.getZForResolution = function(resolution) {
 };
 
 
+/**
+ * @param {number} z Zoom level.
+ * @param {ol.proj.Projection} projection Projection.
+ * @return {boolean} Whether the tile grid is defined for the whole globe when
+ *     used with the provided `projection` at zoom level `z`.
+ */
+ol.tilegrid.TileGrid.prototype.isGlobal = function(z, projection) {
+  var width = this.getWidth(z);
+  if (goog.isDef(width)) {
+    var projTileGrid = ol.tilegrid.getForProjection(projection);
+    var projExtent = projection.getExtent();
+    return this.getTileSize(z) * width ==
+        projTileGrid.getTileSize(z) *
+        projTileGrid.getTileRangeForExtentAndZ(projExtent, z).getWidth();
+  } else {
+    return projection.isGlobal();
+  }
+};
+
+
 /**
  * @param {ol.proj.Projection} projection Projection.
  * @return {ol.tilegrid.TileGrid} Default tile grid for the passed projection.
@@ -433,10 +495,17 @@ ol.tilegrid.createForExtent =
   var resolutions = ol.tilegrid.resolutionsFromExtent(
       extent, opt_maxZoom, tileSize);
 
+  var widths = new Array(resolutions.length);
+  var extentWidth = ol.extent.getWidth(extent);
+  for (var z = resolutions.length - 1; z >= 0; --z) {
+    widths[z] = extentWidth / tileSize / resolutions[z];
+  }
+
   return new ol.tilegrid.TileGrid({
     origin: ol.extent.getCorner(extent, corner),
     resolutions: resolutions,
-    tileSize: tileSize
+    tileSize: tileSize,
+    widths: widths
   });
 };
 

src/ol/tilegrid/wmtstilegrid.js

@@ -34,7 +34,8 @@ ol.tilegrid.WMTS = function(options) {
     origins: options.origins,
     resolutions: options.resolutions,
     tileSize: options.tileSize,
-    tileSizes: options.tileSizes
+    tileSizes: options.tileSizes,
+    widths: options.widths
   });
 
 };
@@ -77,6 +78,8 @@ ol.tilegrid.WMTS.createFromCapabilitiesMatrixSet =
   var origins = [];
   /** @type {!Array.<number>} */
   var tileSizes = [];
+  /** @type {!Array.<number>} */
+  var widths = [];
 
   var supportedCRSPropName = 'SupportedCRS';
   var matrixIdsPropName = 'TileMatrix';
@@ -112,12 +115,14 @@ ol.tilegrid.WMTS.createFromCapabilitiesMatrixSet =
         var tileHeight = elt[tileHeightPropName];
         goog.asserts.assert(tileWidth == tileHeight);
         tileSizes.push(tileWidth);
+        widths.push(elt['MatrixWidth']);
       });
 
   return new ol.tilegrid.WMTS({
     origins: origins,
     resolutions: resolutions,
     matrixIds: matrixIds,
-    tileSizes: tileSizes
+    tileSizes: tileSizes,
+    widths: widths
   });
 };