Compare commits

...

3 Commits

Author SHA1 Message Date
Tim Schaub
1f3f849ca3 3.16.0-alpha.3 2016-05-18 21:45:12 -06:00
Tim Schaub
c4eb0ffcb5 Less weird name 2016-05-18 21:35:55 -06:00
Tim Schaub
a948d4b3ea Demonstrate how source.setUrl() works 2016-05-18 21:35:47 -06:00
5 changed files with 60 additions and 9 deletions

View File

@@ -0,0 +1,12 @@
---
layout: example.html
title: Reusable Source
shortdesc: Updating a tile source by changing the URL.
docs: >
You can call <code>source.setUrl()</code> to update the URL for a tile source. Note that when you change the URL for a tile source, existing tiles will not be replaced until new tiles are loaded. If you are interested instead in clearing currently rendered tiles, you can call the <code>source.refresh()</code> method. Alternatively, you can use two separate sources if you want to remove rendered tiles and start over loading new tiles.
---
<div id="map" class="map"></div>
<button class="switcher" value="0">January</button>
<button class="switcher" value="1">January (with bathymetry)</button>
<button class="switcher" value="2">July</button>
<button class="switcher" value="3">July (with bathymetry)</button>

View File

@@ -0,0 +1,39 @@
goog.require('ol.Map');
goog.require('ol.View');
goog.require('ol.layer.Tile');
goog.require('ol.source.XYZ');
var urls = [
'https://{a-c}.tiles.mapbox.com/v3/mapbox.blue-marble-topo-jan/{z}/{x}/{y}.png',
'https://{a-c}.tiles.mapbox.com/v3/mapbox.blue-marble-topo-bathy-jan/{z}/{x}/{y}.png',
'https://{a-c}.tiles.mapbox.com/v3/mapbox.blue-marble-topo-jul/{z}/{x}/{y}.png',
'https://{a-c}.tiles.mapbox.com/v3/mapbox.blue-marble-topo-bathy-jul/{z}/{x}/{y}.png'
];
var source = new ol.source.XYZ();
var map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: source
})
],
view: new ol.View({
center: [0, 0],
zoom: 2
})
});
function updateUrl(index) {
source.setUrl(urls[index]);
}
var buttons = document.getElementsByClassName('switcher');
for (var i = 0, ii = buttons.length; i < ii; ++i) {
var button = buttons[i];
button.addEventListener('click', updateUrl.bind(null, Number(button.value)));
}
updateUrl(0);

View File

@@ -1,6 +1,6 @@
{
"name": "openlayers",
"version": "3.15.1",
"version": "3.16.0-alpha.3",
"description": "Build tools and sources for developing OpenLayers based mapping applications",
"keywords": [
"map",

View File

@@ -279,19 +279,19 @@ ol.source.TileImage.prototype.getTile = function(z, x, y, pixelRatio, projection
ol.source.TileImage.prototype.getTileInternal = function(z, x, y, pixelRatio, projection) {
var /** @type {ol.Tile} */ tile = null;
var tileCoordKey = this.getKeyZXY(z, x, y);
var paramsKey = this.getKey();
var key = this.getKey();
if (!this.tileCache.containsKey(tileCoordKey)) {
goog.asserts.assert(projection, 'argument projection is truthy');
tile = this.createTile_(z, x, y, pixelRatio, projection, paramsKey);
tile = this.createTile_(z, x, y, pixelRatio, projection, key);
this.tileCache.set(tileCoordKey, tile);
} else {
tile = /** @type {!ol.Tile} */ (this.tileCache.get(tileCoordKey));
if (tile.key != paramsKey) {
if (tile.key != key) {
// The source's params changed. If the tile has an interim tile and if we
// can use it then we use it. Otherwise we create a new tile. In both
// cases we attempt to assign an interim tile to the new tile.
var /** @type {ol.Tile} */ interimTile = tile;
if (tile.interimTile && tile.interimTile.key == paramsKey) {
if (tile.interimTile && tile.interimTile.key == key) {
goog.asserts.assert(tile.interimTile.getState() == ol.TileState.LOADED);
goog.asserts.assert(tile.interimTile.interimTile === null);
tile = tile.interimTile;
@@ -299,7 +299,7 @@ ol.source.TileImage.prototype.getTileInternal = function(z, x, y, pixelRatio, pr
tile.interimTile = interimTile;
}
} else {
tile = this.createTile_(z, x, y, pixelRatio, projection, paramsKey);
tile = this.createTile_(z, x, y, pixelRatio, projection, key);
if (interimTile.getState() == ol.TileState.LOADED) {
tile.interimTile = interimTile;
} else if (interimTile.interimTile &&

View File

@@ -22,11 +22,11 @@ goog.require('ol.source.TileImage');
*
* @constructor
* @extends {ol.source.TileImage}
* @param {olx.source.XYZOptions} options XYZ options.
* @param {olx.source.XYZOptions=} opt_options XYZ options.
* @api stable
*/
ol.source.XYZ = function(options) {
options = options || {};
ol.source.XYZ = function(opt_options) {
var options = opt_options || {};
var projection = options.projection !== undefined ?
options.projection : 'EPSG:3857';