From 184c2e52d52f40b76c538c90f60759799c01478e Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Wed, 11 Sep 2013 15:56:46 +0200 Subject: [PATCH 1/5] Factor out ol.TileCoordTransformType --- src/ol/tileurlfunction.js | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/ol/tileurlfunction.js b/src/ol/tileurlfunction.js index d2d348a7e0..d69080dc0a 100644 --- a/src/ol/tileurlfunction.js +++ b/src/ol/tileurlfunction.js @@ -14,6 +14,12 @@ goog.require('ol.extent'); ol.TileUrlFunctionType; +/** + * @typedef {function(ol.TileCoord, ol.Projection, ol.TileCoord=): ol.TileCoord} + */ +ol.TileCoordTransformType; + + /** * @param {string} template Template. * @return {ol.TileUrlFunctionType} Tile URL function. @@ -121,8 +127,7 @@ ol.TileUrlFunction.nullTileUrlFunction = function(tileCoord, projection) { /** - * @param {function(ol.TileCoord, ol.Projection, ol.TileCoord=): ol.TileCoord} - * transformFn Transform function. + * @param {ol.TileCoordTransformType} transformFn Transform function. * @param {ol.TileUrlFunctionType} tileUrlFunction Tile URL function. * @return {ol.TileUrlFunctionType} Tile URL function. */ From 4ef6254c1362e575823fd666920d8ed21c4c8869 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Wed, 11 Sep 2013 15:57:09 +0200 Subject: [PATCH 2/5] Add ol.source.TileImage#setTileUrlFunction --- src/ol/source/imagetilesource.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/ol/source/imagetilesource.js b/src/ol/source/imagetilesource.js index 453dd29126..87e8ad0f51 100644 --- a/src/ol/source/imagetilesource.js +++ b/src/ol/source/imagetilesource.js @@ -108,6 +108,16 @@ ol.source.TileImage.prototype.getTile = function(z, x, y, projection) { }; +/** + * @param {ol.TileUrlFunctionType} tileUrlFunction Tile URL function. + */ +ol.source.TileImage.prototype.setTileUrlFunction = function(tileUrlFunction) { + this.tileCache_.clear(); + this.tileUrlFunction = tileUrlFunction; + this.dispatchChangeEvent(); +}; + + /** * @inheritDoc */ From 1ef4c379b2280c9cecb19e6e2391ddc0cb434cc2 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Wed, 11 Sep 2013 16:00:01 +0200 Subject: [PATCH 3/5] Add ol.source.XYZ#setUrl and friends --- src/ol/source/xyzsource.js | 66 +++++++++++++++++++++++++------------- 1 file changed, 44 insertions(+), 22 deletions(-) diff --git a/src/ol/source/xyzsource.js b/src/ol/source/xyzsource.js index 0f00bc385a..51e5f43080 100644 --- a/src/ol/source/xyzsource.js +++ b/src/ol/source/xyzsource.js @@ -18,33 +18,12 @@ ol.source.XYZ = function(options) { var projection = options.projection || ol.proj.get('EPSG:3857'); - /** - * @type {ol.TileUrlFunctionType} - */ - var tileUrlFunction = ol.TileUrlFunction.nullTileUrlFunction; - // FIXME use goog.nullFunction ? - if (goog.isDef(options.tileUrlFunction)) { - tileUrlFunction = options.tileUrlFunction; - } else if (goog.isDef(options.urls)) { - tileUrlFunction = ol.TileUrlFunction.createFromTemplates(options.urls); - } else if (goog.isDef(options.url)) { - tileUrlFunction = ol.TileUrlFunction.createFromTemplates( - ol.TileUrlFunction.expandUrl(options.url)); - } - var maxZoom = goog.isDef(options.maxZoom) ? options.maxZoom : 18; var tileGrid = new ol.tilegrid.XYZ({ maxZoom: maxZoom }); - var tileCoordTransform = tileGrid.createTileCoordTransform({ - extent: options.extent - }); - - tileUrlFunction = ol.TileUrlFunction.withTileCoordTransform( - tileCoordTransform, tileUrlFunction); - goog.base(this, { attributions: options.attributions, crossOrigin: options.crossOrigin, @@ -52,8 +31,51 @@ ol.source.XYZ = function(options) { logo: options.logo, projection: projection, tileGrid: tileGrid, - tileUrlFunction: tileUrlFunction + tileUrlFunction: ol.TileUrlFunction.nullTileUrlFunction }); + /** + * @private + * @type {ol.TileCoordTransformType} + */ + this.tileCoordTransform_ = tileGrid.createTileCoordTransform({ + extent: options.extent + }); + + if (goog.isDef(options.tileUrlFunction)) { + this.setTileUrlFunction(options.tileUrlFunction); + } else if (goog.isDef(options.urls)) { + this.setUrls(options.urls); + } else if (goog.isDef(options.url)) { + this.setUrl(options.url); + } + }; goog.inherits(ol.source.XYZ, ol.source.TileImage); + + +/** + * @param {ol.TileUrlFunctionType} tileUrlFunction Tile URL function. + */ +ol.source.XYZ.prototype.setTileUrlFunction = function(tileUrlFunction) { + goog.base(this, 'setTileUrlFunction', + ol.TileUrlFunction.withTileCoordTransform( + this.tileCoordTransform_, tileUrlFunction)); +}; + + +/** + * @param {string} url URL. + */ +ol.source.XYZ.prototype.setUrl = function(url) { + this.setTileUrlFunction(ol.TileUrlFunction.createFromTemplates( + ol.TileUrlFunction.expandUrl(url))); +}; + + +/** + * @param {Array.} urls URLs. + */ +ol.source.XYZ.prototype.setUrls = function(urls) { + this.setTileUrlFunction(ol.TileUrlFunction.createFromTemplates(urls)); +}; From ae6ecb7103ccef97dd70156977f4433ffa7bc5a6 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Wed, 11 Sep 2013 16:18:27 +0200 Subject: [PATCH 4/5] Add XYZ set URL example --- examples/xyz-seturl.html | 62 ++++++++++++++++++++++++++++++++++++++++ examples/xyz-seturl.js | 34 ++++++++++++++++++++++ 2 files changed, 96 insertions(+) create mode 100644 examples/xyz-seturl.html create mode 100644 examples/xyz-seturl.js diff --git a/examples/xyz-seturl.html b/examples/xyz-seturl.html new file mode 100644 index 0000000000..2adb6c1310 --- /dev/null +++ b/examples/xyz-seturl.html @@ -0,0 +1,62 @@ + + + + + + + + + + + SetURL example + + + +
+
+
+ OpenLayers 3 Examples +
    +
    • +
    • +
    • +
+
+
+
+ +
+ +
+
+
+ + + + + +
+
+ +
+ +
+

XYZ set URL example

+

Example of a setting the URL on an XYZ source

+
+

See the xyz-seturl.js source to see how this is done.

+
+
xyz, seturl
+
+ +
+ +
+ + + + + + + diff --git a/examples/xyz-seturl.js b/examples/xyz-seturl.js new file mode 100644 index 0000000000..f412819514 --- /dev/null +++ b/examples/xyz-seturl.js @@ -0,0 +1,34 @@ +goog.require('ol.Map'); +goog.require('ol.RendererHints'); +goog.require('ol.View2D'); +goog.require('ol.layer.Tile'); +goog.require('ol.source.XYZ'); + + +var source = new ol.source.XYZ({ + url: 'http://{a-c}.tile.openstreetmap.org/{z}/{x}/{y}.png' +}); +var map = new ol.Map({ + layers: [ + new ol.layer.Tile({ + source: source + }) + ], + renderers: ol.RendererHints.createFromQueryData(), + target: 'map', + view: new ol.View2D({ + center: [0, 0], + zoom: 4 + }) +}); + +$('#set-stamen').click(function() { + source.setUrl('http://{a-d}.tile.stamen.com/watercolor/{z}/{x}/{y}.jpg'); +}); +$('#set-opencyclemap').click(function() { + source.setUrl('http://{a-c}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png'); +}); +$('#set-esri').click(function() { + source.setUrl('http://server.arcgisonline.com/ArcGIS/rest/services/' + + 'World_Topo_Map/MapServer/tile/{z}/{y}/{x}'); +}); From 4542c689e844ffa0742c13fc16e3712fdb821b9f Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Wed, 11 Sep 2013 16:48:31 +0200 Subject: [PATCH 5/5] Add FIXME about avoiding tile cache clears --- src/ol/source/imagetilesource.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/ol/source/imagetilesource.js b/src/ol/source/imagetilesource.js index 87e8ad0f51..8769cf71cf 100644 --- a/src/ol/source/imagetilesource.js +++ b/src/ol/source/imagetilesource.js @@ -112,6 +112,9 @@ ol.source.TileImage.prototype.getTile = function(z, x, y, projection) { * @param {ol.TileUrlFunctionType} tileUrlFunction Tile URL function. */ ol.source.TileImage.prototype.setTileUrlFunction = function(tileUrlFunction) { + // FIXME It should be possible to be more intelligent and avoid clearing the + // FIXME cache. The tile URL function would need to be incorporated into the + // FIXME cache key somehow. this.tileCache_.clear(); this.tileUrlFunction = tileUrlFunction; this.dispatchChangeEvent();