diff --git a/src/ol/layer/TileLayer.js b/src/ol/layer/TileLayer.js index 3fe27a9c7e..320c586d1a 100644 --- a/src/ol/layer/TileLayer.js +++ b/src/ol/layer/TileLayer.js @@ -10,6 +10,12 @@ goog.require('ol.TileCache'); */ ol.layer.TileLayer = function() { + /** + * @private + * @type {string|undefined} + */ + this.url_ = undefined; + /** * @protected * @type {ol.Projection} @@ -161,6 +167,14 @@ ol.layer.TileLayer.prototype.getResolutions = function() { return this.resolutions_; }; +/** + * Set the layer URL. + * @param {string} url + */ +ol.layer.TileLayer.prototype.setUrl = function(url) { + this.url_ = url; +}; + /** * Set layer projection. * @param {ol.Projection} projection @@ -233,3 +247,84 @@ ol.layer.TileLayer.prototype.getTile = function(url, bounds) { } return tile; }; + +/** + * Get data from the layer. This is the layer's main API function. + * @param {ol.Bounds} bounds + * @param {number} resolution + */ +ol.layer.TileLayer.prototype.getData = function(bounds, resolution) { + var me = this, + zoomAndRes = me.getZoomAndRes(resolution), + zoom = zoomAndRes[0]; + resolution = zoomAndRes[1]; + + // define some values used for the actual tiling + var boundsMinX = bounds.getMinX(), + boundsMaxX = bounds.getMaxX(), + boundsMinY = bounds.getMinY(), + boundsMaxY = bounds.getMaxY(), + + tileWidth = me.tileWidth_, + tileHeight = me.tileHeight_, + + tileOrigin = me.getTileOrigin(), + tileOriginX = tileOrigin[0], + tileOriginY = tileOrigin[1], + + tileWidthGeo = tileWidth * resolution, + tileHeightGeo = tileHeight * resolution, + + offsetX = Math.floor( + (boundsMinX - tileOriginX) / tileWidthGeo), + offsetY = Math.floor( + (tileOriginY - boundsMaxY) / tileHeightGeo), + + gridLeft = tileOriginX + tileWidthGeo * offsetX, + gridTop = tileOriginY - tileHeightGeo * offsetY; + + // now tile + var tiles = [], + tile, + url, + tileBottom, tileRight, tileBounds; + for (var y=0, tileTop=gridTop; tileTop > boundsMinY; + ++y, tileTop-=tileHeightGeo) { + tiles[y] = []; + tileBottom = tileTop - tileHeightGeo; + for (var x=0, tileLeft=gridLeft; tileLeft < boundsMaxX; + ++x, tileLeft+=tileWidthGeo) { + tileRight = tileLeft + tileWidthGeo; + tileBounds = new ol.Bounds(tileLeft, tileBottom, + tileRight, tileTop, this.projection_); + url = me.url_.replace('{x}', offsetX + x + '') + .replace('{y}', offsetY + y + '') + .replace('{z}', zoom + ''); + tile = this.getTile(url, tileBounds); + tiles[y][x] = tile; + } + } + + return new ol.TileSet(tiles, tileWidth, tileHeight, resolution); +}; + +/** + * Get the zoom level (z) and layer resolution for the given resolution. + * @param {number} resolution + * @return {Array.} + */ +ol.layer.TileLayer.prototype.getZoomAndRes = function(resolution) { + var delta = Number.POSITIVE_INFINITY, + currentDelta, + resolutions = this.getResolutions(), + zoom; + for (var i=resolutions.length-1; i>=0; --i) { + currentDelta = Math.abs(resolutions[i] - resolution); + if (currentDelta > delta) { + break; + } + delta = currentDelta; + } + zoom = i + 1; + return [zoom, resolutions[zoom]]; +}; diff --git a/src/ol/layer/XYZ.js b/src/ol/layer/XYZ.js index d1c885f672..c32ea74a50 100644 --- a/src/ol/layer/XYZ.js +++ b/src/ol/layer/XYZ.js @@ -15,96 +15,11 @@ goog.require('ol.TileSet'); */ ol.layer.XYZ = function(url) { - /** - * @private - * @type {string} - */ - this.url_ = url; - goog.base(this); + this.setUrl(url); this.setMaxResolution(156543.03390625); }; goog.inherits(ol.layer.XYZ, ol.layer.TileLayer); -/** - * Get data from the layer. This is the layer's main API function. - * @param {ol.Bounds} bounds - * @param {number} resolution - */ -ol.layer.XYZ.prototype.getData = function(bounds, resolution) { - var me = this, - zoomAndRes = me.getZoomAndRes(resolution), - zoom = zoomAndRes[0]; - resolution = zoomAndRes[1]; - - // define some values used for the actual tiling - var boundsMinX = bounds.getMinX(), - boundsMaxX = bounds.getMaxX(), - boundsMinY = bounds.getMinY(), - boundsMaxY = bounds.getMaxY(), - - tileWidth = me.tileWidth_, - tileHeight = me.tileHeight_, - - tileOrigin = me.getTileOrigin(), - tileOriginX = tileOrigin[0], - tileOriginY = tileOrigin[1], - - tileWidthGeo = tileWidth * resolution, - tileHeightGeo = tileHeight * resolution, - - offsetX = Math.floor( - (boundsMinX - tileOriginX) / tileWidthGeo), - offsetY = Math.floor( - (tileOriginY - boundsMaxY) / tileHeightGeo), - - gridLeft = tileOriginX + tileWidthGeo * offsetX, - gridTop = tileOriginY - tileHeightGeo * offsetY; - - // now tile - var tiles = [], - tile, - url, - tileBottom, tileRight, tileBounds; - for (var y=0, tileTop=gridTop; tileTop > boundsMinY; - ++y, tileTop-=tileHeightGeo) { - tiles[y] = []; - tileBottom = tileTop - tileHeightGeo; - for (var x=0, tileLeft=gridLeft; tileLeft < boundsMaxX; - ++x, tileLeft+=tileWidthGeo) { - tileRight = tileLeft + tileWidthGeo; - tileBounds = new ol.Bounds(tileLeft, tileBottom, - tileRight, tileTop, this.projection_); - url = me.url_.replace('{x}', offsetX + x + '') - .replace('{y}', offsetY + y + '') - .replace('{z}', zoom + ''); - tile = this.getTile(url, tileBounds); - tiles[y][x] = tile; - } - } - - return new ol.TileSet(tiles, tileWidth, tileHeight, resolution); -}; - -/** - * Get the zoom level (z) and layer resolution for the given resolution. - * @param {number} resolution - * @return {Array.} - */ -ol.layer.XYZ.prototype.getZoomAndRes = function(resolution) { - var delta = Number.POSITIVE_INFINITY, - currentDelta, - resolutions = this.getResolutions(), - zoom; - for (var i=resolutions.length-1; i>=0; --i) { - currentDelta = Math.abs(resolutions[i] - resolution); - if (currentDelta > delta) { - break; - } - delta = currentDelta; - } - zoom = i + 1; - return [zoom, resolutions[zoom]]; -}; diff --git a/test/spec/ol/layer/TileLayer.test.js b/test/spec/ol/layer/TileLayer.test.js index e252258b90..cd7706e06e 100644 --- a/test/spec/ol/layer/TileLayer.test.js +++ b/test/spec/ol/layer/TileLayer.test.js @@ -133,4 +133,155 @@ describe('ol.layer.TileLayer', function() { }); }); + + describe('get data from the layer', function() { + var layer; + + beforeEach(function() { + layer = new ol.layer.TileLayer(); + layer.setUrl('/{z}/{x}/{y}'); + layer.setResolutions([1, 0.5, 0.25]); + layer.setTileOrigin(-128, 128); + }); + + describe('extent -128,-128,128,128, resolution 1', function() { + + it('returns the expected data', function() { + var tileset = layer.getData( + new ol.Bounds(-128, -128, 128, 128), 1); + + var tiles = tileset.getTiles(); + expect(tiles.length).toEqual(1); + expect(tiles[0].length).toEqual(1); + + var tile = tiles[0][0]; + expect(tile.getUrl()).toEqual('/0/0/0'); + expect(tile.getImg()).toBeDefined(); + }); + }); + + describe('extent -128,-128,128,128, resolution 0.5', function() { + + it('returns the expected data', function() { + var tileset = layer.getData( + new ol.Bounds(-128, -128, 128, 128), 0.5); + + var tiles = tileset.getTiles(); + expect(tiles.length).toEqual(2); + expect(tiles[0].length).toEqual(2); + + var tile; + + tile = tiles[0][0]; + expect(tile.getUrl()).toEqual('/1/0/0'); + expect(tile.getImg()).toBeDefined(); + + tile = tiles[0][1]; + expect(tile.getUrl()).toEqual('/1/1/0'); + expect(tile.getImg()).toBeDefined(); + + tile = tiles[1][0]; + expect(tile.getUrl()).toEqual('/1/0/1'); + expect(tile.getImg()).toBeDefined(); + + tile = tiles[1][1]; + expect(tile.getUrl()).toEqual('/1/1/1'); + expect(tile.getImg()).toBeDefined(); + }); + }); + + describe('extent -64,-64,64,64, resolution 0.5', function() { + + it('returns the expected data', function() { + var tileset = layer.getData( + new ol.Bounds(-64, -64, 64, 64), 0.5); + + var tiles = tileset.getTiles(); + expect(tiles.length).toEqual(2); + expect(tiles[0].length).toEqual(2); + + var tile; + + tile = tiles[0][0]; + expect(tile.getUrl()).toEqual('/1/0/0'); + expect(tile.getImg()).toBeDefined(); + + tile = tiles[0][1]; + expect(tile.getUrl()).toEqual('/1/1/0'); + expect(tile.getImg()).toBeDefined(); + + tile = tiles[1][0]; + expect(tile.getUrl()).toEqual('/1/0/1'); + expect(tile.getImg()).toBeDefined(); + + tile = tiles[1][1]; + expect(tile.getUrl()).toEqual('/1/1/1'); + expect(tile.getImg()).toBeDefined(); + }); + }); + + describe('extent -96,32,-32,96, resolution 0.5', function() { + + it('returns the expected data', function() { + var tileset = layer.getData( + new ol.Bounds(-96, 32, -32, 96), 0.5); + + var tiles = tileset.getTiles(); + expect(tiles.length).toEqual(1); + expect(tiles[0].length).toEqual(1); + + var tile; + + tile = tiles[0][0]; + expect(tile.getUrl()).toEqual('/1/0/0'); + expect(tile.getImg()).toBeDefined(); + }); + }); + + describe('extent -32,32,32,96, resolution 0.5', function() { + + it('returns the expected data', function() { + var tileset = layer.getData( + new ol.Bounds(-32, 32, 32, 96), 0.5); + + var tiles = tileset.getTiles(); + expect(tiles.length).toEqual(1); + expect(tiles[0].length).toEqual(2); + + var tile; + + tile = tiles[0][0]; + expect(tile.getUrl()).toEqual('/1/0/0'); + expect(tile.getImg()).toBeDefined(); + + tile = tiles[0][1]; + expect(tile.getUrl()).toEqual('/1/1/0'); + expect(tile.getImg()).toBeDefined(); + }); + }); + + describe('extent 32,-32,96,32, resolution 0.5', function() { + + it('returns the expected data', function() { + var tileset = layer.getData( + new ol.Bounds(32, -32, 96, 32), 0.5); + + var tiles = tileset.getTiles(); + expect(tiles.length).toEqual(2); + expect(tiles[0].length).toEqual(1); + expect(tiles[1].length).toEqual(1); + + var tile; + + tile = tiles[0][0]; + expect(tile.getUrl()).toEqual('/1/1/0'); + expect(tile.getImg()).toBeDefined(); + + tile = tiles[1][0]; + expect(tile.getUrl()).toEqual('/1/1/1'); + expect(tile.getImg()).toBeDefined(); + }); + }); + + }); }); diff --git a/test/spec/ol/layer/XYZ.test.js b/test/spec/ol/layer/XYZ.test.js index e048486804..92cedf109d 100644 --- a/test/spec/ol/layer/XYZ.test.js +++ b/test/spec/ol/layer/XYZ.test.js @@ -9,153 +9,4 @@ describe('ol.layer.XYZ', function() { }); - describe('get data from the layer', function() { - var layer; - - beforeEach(function() { - layer = new ol.layer.XYZ('/{z}/{x}/{y}'); - layer.setResolutions([1, 0.5, 0.25]); - layer.setTileOrigin(-128, 128); - }); - - describe('extent -128,-128,128,128, resolution 1', function() { - - it('returns the expected data', function() { - var tileset = layer.getData( - new ol.Bounds(-128, -128, 128, 128), 1); - - var tiles = tileset.getTiles(); - expect(tiles.length).toEqual(1); - expect(tiles[0].length).toEqual(1); - - var tile = tiles[0][0]; - expect(tile.getUrl()).toEqual('/0/0/0'); - expect(tile.getImg()).toBeDefined(); - }); - }); - - describe('extent -128,-128,128,128, resolution 0.5', function() { - - it('returns the expected data', function() { - var tileset = layer.getData( - new ol.Bounds(-128, -128, 128, 128), 0.5); - - var tiles = tileset.getTiles(); - expect(tiles.length).toEqual(2); - expect(tiles[0].length).toEqual(2); - - var tile; - - tile = tiles[0][0]; - expect(tile.getUrl()).toEqual('/1/0/0'); - expect(tile.getImg()).toBeDefined(); - - tile = tiles[0][1]; - expect(tile.getUrl()).toEqual('/1/1/0'); - expect(tile.getImg()).toBeDefined(); - - tile = tiles[1][0]; - expect(tile.getUrl()).toEqual('/1/0/1'); - expect(tile.getImg()).toBeDefined(); - - tile = tiles[1][1]; - expect(tile.getUrl()).toEqual('/1/1/1'); - expect(tile.getImg()).toBeDefined(); - }); - }); - - describe('extent -64,-64,64,64, resolution 0.5', function() { - - it('returns the expected data', function() { - var tileset = layer.getData( - new ol.Bounds(-64, -64, 64, 64), 0.5); - - var tiles = tileset.getTiles(); - expect(tiles.length).toEqual(2); - expect(tiles[0].length).toEqual(2); - - var tile; - - tile = tiles[0][0]; - expect(tile.getUrl()).toEqual('/1/0/0'); - expect(tile.getImg()).toBeDefined(); - - tile = tiles[0][1]; - expect(tile.getUrl()).toEqual('/1/1/0'); - expect(tile.getImg()).toBeDefined(); - - tile = tiles[1][0]; - expect(tile.getUrl()).toEqual('/1/0/1'); - expect(tile.getImg()).toBeDefined(); - - tile = tiles[1][1]; - expect(tile.getUrl()).toEqual('/1/1/1'); - expect(tile.getImg()).toBeDefined(); - }); - }); - - describe('extent -96,32,-32,96, resolution 0.5', function() { - - it('returns the expected data', function() { - var tileset = layer.getData( - new ol.Bounds(-96, 32, -32, 96), 0.5); - - var tiles = tileset.getTiles(); - expect(tiles.length).toEqual(1); - expect(tiles[0].length).toEqual(1); - - var tile; - - tile = tiles[0][0]; - expect(tile.getUrl()).toEqual('/1/0/0'); - expect(tile.getImg()).toBeDefined(); - }); - }); - - describe('extent -32,32,32,96, resolution 0.5', function() { - - it('returns the expected data', function() { - var tileset = layer.getData( - new ol.Bounds(-32, 32, 32, 96), 0.5); - - var tiles = tileset.getTiles(); - expect(tiles.length).toEqual(1); - expect(tiles[0].length).toEqual(2); - - var tile; - - tile = tiles[0][0]; - expect(tile.getUrl()).toEqual('/1/0/0'); - expect(tile.getImg()).toBeDefined(); - - tile = tiles[0][1]; - expect(tile.getUrl()).toEqual('/1/1/0'); - expect(tile.getImg()).toBeDefined(); - }); - }); - - describe('extent 32,-32,96,32, resolution 0.5', function() { - - it('returns the expected data', function() { - var tileset = layer.getData( - new ol.Bounds(32, -32, 96, 32), 0.5); - - var tiles = tileset.getTiles(); - expect(tiles.length).toEqual(2); - expect(tiles[0].length).toEqual(1); - expect(tiles[1].length).toEqual(1); - - var tile; - - tile = tiles[0][0]; - expect(tile.getUrl()).toEqual('/1/1/0'); - expect(tile.getImg()).toBeDefined(); - - tile = tiles[1][0]; - expect(tile.getUrl()).toEqual('/1/1/1'); - expect(tile.getImg()).toBeDefined(); - }); - }); - - }); });