From 277c1ea3a614ef4b32ad74a37f48c9899dbc0fdb Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Fri, 20 Jul 2012 23:33:59 +0200 Subject: [PATCH] Use XYZ to indicate OpenStreetMap-style tile grids --- src/ol/ol.js | 5 +- src/ol/tilegrid/{openstreetmap.js => xyz.js} | 4 +- src/ol/tilelayer/openstreetmap.js | 16 ++++++- src/ol/{ => tilelayer}/tilelayer.js | 0 src/ol/tilelayer/xyz.js | 21 +++++++++ src/ol/tilestore/openstreetmap.js | 48 -------------------- src/ol/tilestore/tilestore_test.js | 41 ++++++++--------- src/ol/tilestore/xyz.js | 43 ++++++++++++++++++ 8 files changed, 101 insertions(+), 77 deletions(-) rename src/ol/tilegrid/{openstreetmap.js => xyz.js} (86%) rename src/ol/{ => tilelayer}/tilelayer.js (100%) create mode 100644 src/ol/tilelayer/xyz.js delete mode 100644 src/ol/tilestore/openstreetmap.js create mode 100644 src/ol/tilestore/xyz.js diff --git a/src/ol/ol.js b/src/ol/ol.js index 56fc39ea9a..b1adcab3fe 100644 --- a/src/ol/ol.js +++ b/src/ol/ol.js @@ -34,9 +34,10 @@ goog.require('ol.dom'); goog.require('ol.dom.LayerRenderer'); goog.require('ol.dom.Map'); goog.require('ol.dom.TileLayerRenderer'); -goog.require('ol.tilegrid.createOpenStreetMap'); +goog.require('ol.tilegrid.createXYZ'); goog.require('ol.tilelayer.createOpenStreetMap'); -goog.require('ol.tilestore.createOpenStreetMap'); +goog.require('ol.tilelayer.createXYZ'); +goog.require('ol.tilestore.createXYZ'); goog.require('ol.webgl'); goog.require('ol.webgl.LayerRenderer'); goog.require('ol.webgl.Map'); diff --git a/src/ol/tilegrid/openstreetmap.js b/src/ol/tilegrid/xyz.js similarity index 86% rename from src/ol/tilegrid/openstreetmap.js rename to src/ol/tilegrid/xyz.js index f5ffddc9d6..b4bbac80dc 100644 --- a/src/ol/tilegrid/openstreetmap.js +++ b/src/ol/tilegrid/xyz.js @@ -1,4 +1,4 @@ -goog.provide('ol.tilegrid.createOpenStreetMap'); +goog.provide('ol.tilegrid.createXYZ'); goog.require('ol.Coordinate'); goog.require('ol.Projection'); @@ -10,7 +10,7 @@ goog.require('ol.TileGrid'); * @param {number} maxZoom Maximum zoom. * @return {ol.TileGrid} Tile grid. */ -ol.tilegrid.createOpenStreetMap = function(maxZoom) { +ol.tilegrid.createXYZ = function(maxZoom) { var resolutions = new Array(maxZoom + 1); var z; diff --git a/src/ol/tilelayer/openstreetmap.js b/src/ol/tilelayer/openstreetmap.js index 65c6923b77..8d2b95919a 100644 --- a/src/ol/tilelayer/openstreetmap.js +++ b/src/ol/tilelayer/openstreetmap.js @@ -2,7 +2,7 @@ goog.provide('ol.tilelayer.createOpenStreetMap'); goog.require('ol.Layer'); goog.require('ol.TileLayer'); -goog.require('ol.tilestore.createOpenStreetMap'); +goog.require('ol.tilestore.createXYZ'); /** @@ -10,6 +10,18 @@ goog.require('ol.tilestore.createOpenStreetMap'); * @return {ol.Layer} Layer. */ ol.tilelayer.createOpenStreetMap = function(opt_values) { - var store = ol.tilestore.createOpenStreetMap(); + var store = ol.tilestore.createXYZ( + 18, + [ + 'http://a.tile.openstreetmap.org/{z}/{x}/{y}.png', + 'http://b.tile.openstreetmap.org/{z}/{x}/{y}.png', + 'http://c.tile.openstreetmap.org/{z}/{x}/{y}.png' + ], + '© ' + + 'OpenStreetMap ' + + 'contributors, ' + + 'CC BY-SA', + '' + ); return new ol.TileLayer(store, opt_values); }; diff --git a/src/ol/tilelayer.js b/src/ol/tilelayer/tilelayer.js similarity index 100% rename from src/ol/tilelayer.js rename to src/ol/tilelayer/tilelayer.js diff --git a/src/ol/tilelayer/xyz.js b/src/ol/tilelayer/xyz.js new file mode 100644 index 0000000000..d7ec1b6bda --- /dev/null +++ b/src/ol/tilelayer/xyz.js @@ -0,0 +1,21 @@ +goog.provide('ol.tilelayer.createXYZ'); + +goog.require('ol.Layer'); +goog.require('ol.TileLayer'); +goog.require('ol.tilestore.createXYZ'); + + +/** + * @param {number} maxZoom Maximum zoom. + * @param {Array.} templates Templates. + * @param {string=} opt_attribution Attribution. + * @param {string=} opt_crossOrigin Cross origin. + * @param {Object.=} opt_values Values. + * @return {ol.Layer} Layer. + */ +ol.tilelayer.createXYZ = + function(maxZoom, templates, opt_attribution, opt_crossOrigin, opt_values) { + var store = ol.tilestore.createXYZ( + maxZoom, templates, opt_attribution, opt_crossOrigin); + return new ol.TileLayer(store, opt_values); +}; diff --git a/src/ol/tilestore/openstreetmap.js b/src/ol/tilestore/openstreetmap.js deleted file mode 100644 index 08684d91d5..0000000000 --- a/src/ol/tilestore/openstreetmap.js +++ /dev/null @@ -1,48 +0,0 @@ -goog.provide('ol.tilestore.createOpenStreetMap'); - -goog.require('goog.math'); -goog.require('ol.Projection'); -goog.require('ol.TileCoord'); -goog.require('ol.TileGrid'); -goog.require('ol.TileStore'); -goog.require('ol.TileUrlFunction'); -goog.require('ol.tilegrid.createOpenStreetMap'); - - -/** - * @return {ol.TileStore} Tile store. - */ -ol.tilestore.createOpenStreetMap = function() { - - var projection = ol.Projection.getFromCode('EPSG:3857'); - var tileGrid = ol.tilegrid.createOpenStreetMap(18); - var tileUrlFunction = ol.TileUrlFunction.withTileCoordTransform( - function(tileCoord) { - var n = 1 << tileCoord.z; - var y = -tileCoord.y - 1; - if (y < 0 || n <= y) { - return null; - } else { - var x = goog.math.modulo(tileCoord.x, n); - return new ol.TileCoord(tileCoord.z, x, y); - } - }, - ol.TileUrlFunction.createFromTemplates([ - 'http://a.tile.openstreetmap.org/{z}/{x}/{y}.png', - 'http://b.tile.openstreetmap.org/{z}/{x}/{y}.png', - 'http://c.tile.openstreetmap.org/{z}/{x}/{y}.png' - ])); - var extent = projection.getExtent(); - var attribution = - '© ' + - 'OpenStreetMap ' + - 'contributors, ' + - 'CC BY-SA'; - var crossOrigin = ''; - - return new ol.TileStore( - projection, tileGrid, tileUrlFunction, extent, attribution, crossOrigin); - -}; - - diff --git a/src/ol/tilestore/tilestore_test.js b/src/ol/tilestore/tilestore_test.js index 12dd05d27b..031b4d1061 100644 --- a/src/ol/tilestore/tilestore_test.js +++ b/src/ol/tilestore/tilestore_test.js @@ -1,71 +1,66 @@ goog.require('goog.testing.jsunit'); goog.require('ol.Coordinate'); goog.require('ol.TileCoord'); -goog.require('ol.tilestore.createOpenStreetMap'); +goog.require('ol.tilestore.createXYZ'); -function getTileCoordPart(tileUrl) { - return tileUrl.substr(32, tileUrl.length - 36); -} +function testXYZ() { - -function testOpenStreetMap() { - - var tileStore = ol.tilestore.createOpenStreetMap(8); + var tileStore = ol.tilestore.createXYZ(6, ['{z}/{x}/{y}']); var tileGrid = tileStore.getTileGrid(); var coordinate = new ol.Coordinate(829330.2064098881, 5933916.615134273); var tileUrl; tileUrl = tileStore.getTileCoordUrl(tileGrid.getTileCoord(0, coordinate)); - assertEquals('0/0/0', getTileCoordPart(tileUrl)); + assertEquals('0/0/0', tileUrl); tileUrl = tileStore.getTileCoordUrl(tileGrid.getTileCoord(1, coordinate)); - assertEquals('1/1/0', getTileCoordPart(tileUrl)); + assertEquals('1/1/0', tileUrl); tileUrl = tileStore.getTileCoordUrl(tileGrid.getTileCoord(2, coordinate)); - assertEquals('2/2/1', getTileCoordPart(tileUrl)); + assertEquals('2/2/1', tileUrl); tileUrl = tileStore.getTileCoordUrl(tileGrid.getTileCoord(3, coordinate)); - assertEquals('3/4/2', getTileCoordPart(tileUrl)); + assertEquals('3/4/2', tileUrl); tileUrl = tileStore.getTileCoordUrl(tileGrid.getTileCoord(4, coordinate)); - assertEquals('4/8/5', getTileCoordPart(tileUrl)); + assertEquals('4/8/5', tileUrl); tileUrl = tileStore.getTileCoordUrl(tileGrid.getTileCoord(5, coordinate)); - assertEquals('5/16/11', getTileCoordPart(tileUrl)); + assertEquals('5/16/11', tileUrl); tileUrl = tileStore.getTileCoordUrl(tileGrid.getTileCoord(6, coordinate)); - assertEquals('6/33/22', getTileCoordPart(tileUrl)); + assertEquals('6/33/22', tileUrl); } -function testOpenStreetMapWrapX() { +function testXYZWrapX() { - var tileStore = ol.tilestore.createOpenStreetMap(8); + var tileStore = ol.tilestore.createXYZ(6, ['{z}/{x}/{y}']); tileUrl = tileStore.getTileCoordUrl(new ol.TileCoord(6, -31, -23)); - assertEquals('6/33/22', getTileCoordPart(tileUrl)); + assertEquals('6/33/22', tileUrl); tileUrl = tileStore.getTileCoordUrl(new ol.TileCoord(6, 33, -23)); - assertEquals('6/33/22', getTileCoordPart(tileUrl)); + assertEquals('6/33/22', tileUrl); tileUrl = tileStore.getTileCoordUrl(new ol.TileCoord(6, 97, -23)); - assertEquals('6/33/22', getTileCoordPart(tileUrl)); + assertEquals('6/33/22', tileUrl); } -function testOpenStreetMapCropY() { +function testXYZCropY() { - var tileStore = ol.tilestore.createOpenStreetMap(8); + var tileStore = ol.tilestore.createXYZ(6, ['{z}/{x}/{y}']); tileUrl = tileStore.getTileCoordUrl(new ol.TileCoord(6, 33, -87)); assertUndefined(tileUrl); tileUrl = tileStore.getTileCoordUrl(new ol.TileCoord(6, 33, -23)); - assertEquals('6/33/22', getTileCoordPart(tileUrl)); + assertEquals('6/33/22', tileUrl); tileUrl = tileStore.getTileCoordUrl(new ol.TileCoord(6, 33, 41)); assertUndefined(tileUrl); diff --git a/src/ol/tilestore/xyz.js b/src/ol/tilestore/xyz.js new file mode 100644 index 0000000000..ad639379e6 --- /dev/null +++ b/src/ol/tilestore/xyz.js @@ -0,0 +1,43 @@ +goog.provide('ol.tilestore.createXYZ'); + +goog.require('goog.math'); +goog.require('ol.Projection'); +goog.require('ol.TileCoord'); +goog.require('ol.TileGrid'); +goog.require('ol.TileStore'); +goog.require('ol.TileUrlFunction'); +goog.require('ol.tilegrid.createXYZ'); + + +/** + * @param {number} maxZoom Maximum zoom. + * @param {Array.} templates Templates. + * @param {string=} opt_attribution Attribution. + * @param {string=} opt_crossOrigin Cross origin. + * @return {ol.TileStore} Tile store. + */ +ol.tilestore.createXYZ = + function(maxZoom, templates, opt_attribution, opt_crossOrigin) { + + var projection = ol.Projection.getFromCode('EPSG:3857'); + var tileGrid = ol.tilegrid.createXYZ(maxZoom); + var tileUrlFunction = ol.TileUrlFunction.withTileCoordTransform( + function(tileCoord) { + var n = 1 << tileCoord.z; + var y = -tileCoord.y - 1; + if (y < 0 || n <= y) { + return null; + } else { + var x = goog.math.modulo(tileCoord.x, n); + return new ol.TileCoord(tileCoord.z, x, y); + } + }, + ol.TileUrlFunction.createFromTemplates(templates)); + var extent = projection.getExtent(); + + return new ol.TileStore(projection, tileGrid, tileUrlFunction, extent, + opt_attribution, opt_crossOrigin); + +}; + +