ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Make tile transitions configurable

Browse Source
This commit is contained in:
Tim Schaub
2017-09-16 15:54:29 -06:00
parent 76726a3a6f
commit 16e6d13700
25 changed files with 259 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
examples/tile-transitions.html Normal file
View File

@@ -0,0 +1,15 @@
---
layout: example.html
title: Tile Transitions
shortdesc: Custom configuration for opacity transitions on tiles.
docs: >
By default tiles are rendered with an opacity transition - fading in over
250 ms. To disable this behavior, set the <code>transition</code> option
of the tile source to 0.
tags: "fade, transition"
---
<div id="map" class="map"></div>
<label>
render with an opacity transition
<input id="transition" type="checkbox" checked>
</label>

31
examples/tile-transitions.js Normal file
View File

@@ -0,0 +1,31 @@
goog.require('ol.Map');
goog.require('ol.View');
goog.require('ol.layer.Tile');
goog.require('ol.source.XYZ');
var url = 'https://{a-c}.tiles.mapbox.com/v3/mapbox.world-bright/{z}/{x}/{y}.png';
var withTransition = new ol.layer.Tile({
source: new ol.source.XYZ({url: url})
});
var withoutTransition = new ol.layer.Tile({
source: new ol.source.XYZ({url: url, transition: 0}),
visible: false
});
var map = new ol.Map({
layers: [withTransition, withoutTransition],
target: 'map',
view: new ol.View({
center: [0, 0],
zoom: 2,
maxZoom: 11
})
});
document.getElementById('transition').addEventListener('change', function(event) {
var transition = event.target.checked;
withTransition.setVisible(transition);
withoutTransition.setVisible(!transition);
});

126
externs/olx.js
View File

@@ -463,6 +463,23 @@ olx.SphereMetricOptions.prototype.projection;
olx.SphereMetricOptions.prototype.radius;
/**
* Options for tile constructors.
* @typedef {{transition: (number|undefined)}}
*/
olx.TileOptions;
/**
* A duration for tile opacity transitions. By default, tiles will render with
* a opacity transition that lasts 250 ms. To change the duration, pass a
* number in milliseconds. A duration of 0 disables the opacity transition.
* @type {number|undefined}
* @api
*/
olx.TileOptions.prototype.transition;
/**
* Object literal with options for the {@link ol.Map#forEachFeatureAtPixel} and
* {@link ol.Map#hasFeatureAtPixel} methods.
@@ -4597,7 +4614,8 @@ olx.source;
* maxZoom: (number|undefined),
* reprojectionErrorThreshold: (number|undefined),
* tileLoadFunction: (ol.TileLoadFunctionType|undefined),
* wrapX: (boolean|undefined)}}
* wrapX: (boolean|undefined),
* transition: (number|undefined)}}
*/
olx.source.BingMapsOptions;
@@ -4681,6 +4699,15 @@ olx.source.BingMapsOptions.prototype.tileLoadFunction;
olx.source.BingMapsOptions.prototype.wrapX;
/**
* Duration of the opacity transition for rendering. To disable the opacity
* transition, pass `transition: 0`.
* @type {number|undefined}
* @api
*/
olx.source.BingMapsOptions.prototype.transition;
/**
* @typedef {{attributions: (ol.AttributionLike|undefined),
* distance: (number|undefined),
@@ -4845,7 +4872,8 @@ olx.source.TileUTFGridOptions.prototype.url;
* tileUrlFunction: (ol.TileUrlFunctionType|undefined),
* url: (string|undefined),
* urls: (Array.<string>|undefined),
* wrapX: (boolean|undefined)}}
* wrapX: (boolean|undefined),
* transition: (number|undefined)}}
*/
olx.source.TileImageOptions;
@@ -4998,6 +5026,15 @@ olx.source.TileImageOptions.prototype.urls;
olx.source.TileImageOptions.prototype.wrapX;
/**
* Duration of the opacity transition for rendering. To disable the opacity
* transition, pass `transition: 0`.
* @type {number|undefined}
* @api
*/
olx.source.TileImageOptions.prototype.transition;
/**
* @typedef {{attributions: (ol.AttributionLike|undefined),
* cacheSize: (number|undefined),
@@ -5014,7 +5051,8 @@ olx.source.TileImageOptions.prototype.wrapX;
* tileUrlFunction: (ol.TileUrlFunctionType|undefined),
* url: (string|undefined),
* urls: (Array.<string>|undefined),
* wrapX: (boolean|undefined)}}
* wrapX: (boolean|undefined),
* transition: (number|undefined)}}
*/
olx.source.VectorTileOptions;
@@ -5154,6 +5192,15 @@ olx.source.VectorTileOptions.prototype.urls;
olx.source.VectorTileOptions.prototype.wrapX;
/**
* Duration of the opacity transition for rendering. To disable the opacity
* transition, pass `transition: 0`.
* @type {number|undefined}
* @api
*/
olx.source.VectorTileOptions.prototype.transition;
/**
* @typedef {{url: (string|undefined),
* displayDpi: (number|undefined),
@@ -6070,7 +6117,8 @@ olx.source.ImageStaticOptions.prototype.url;
* tileLoadFunction: (ol.TileLoadFunctionType|undefined),
* url: (string|undefined),
* urls: (Array.<string>|undefined),
* wrapX: (boolean|undefined)}}
* wrapX: (boolean|undefined),
* transition: (number|undefined)}}
*/
olx.source.TileArcGISRestOptions;
@@ -6184,6 +6232,15 @@ olx.source.TileArcGISRestOptions.prototype.url;
olx.source.TileArcGISRestOptions.prototype.wrapX;
/**
* Duration of the opacity transition for rendering. To disable the opacity
* transition, pass `transition: 0`.
* @type {number|undefined}
* @api
*/
olx.source.TileArcGISRestOptions.prototype.transition;
/**
* ArcGIS Rest service urls. Use this instead of `url` when the ArcGIS Service supports multiple
* urls for export requests.
@@ -6202,7 +6259,8 @@ olx.source.TileArcGISRestOptions.prototype.urls;
* tileJSON: (TileJSON|undefined),
* tileLoadFunction: (ol.TileLoadFunctionType|undefined),
* url: (string|undefined),
* wrapX: (boolean|undefined)}}
* wrapX: (boolean|undefined),
* transition: (number|undefined)}}
*/
olx.source.TileJSONOptions;
@@ -6293,6 +6351,15 @@ olx.source.TileJSONOptions.prototype.url;
olx.source.TileJSONOptions.prototype.wrapX;
/**
* Duration of the opacity transition for rendering. To disable the opacity
* transition, pass `transition: 0`.
* @type {number|undefined}
* @api
*/
olx.source.TileJSONOptions.prototype.transition;
/**
* @typedef {{attributions: (ol.AttributionLike|undefined),
* cacheSize: (number|undefined),
@@ -6311,7 +6378,8 @@ olx.source.TileJSONOptions.prototype.wrapX;
* tileLoadFunction: (ol.TileLoadFunctionType|undefined),
* url: (string|undefined),
* urls: (Array.<string>|undefined),
* wrapX: (boolean|undefined)}}
* wrapX: (boolean|undefined),
* transition: (number|undefined)}}
*/
olx.source.TileWMSOptions;
@@ -6475,6 +6543,15 @@ olx.source.TileWMSOptions.prototype.urls;
olx.source.TileWMSOptions.prototype.wrapX;
/**
* Duration of the opacity transition for rendering. To disable the opacity
* transition, pass `transition: 0`.
* @type {number|undefined}
* @api
*/
olx.source.TileWMSOptions.prototype.transition;
/**
* @typedef {{attributions: (ol.AttributionLike|undefined),
* features: (Array.<ol.Feature>|ol.Collection.<ol.Feature>|undefined),
@@ -6630,7 +6707,8 @@ olx.source.VectorOptions.prototype.wrapX;
* tileClass: (function(new: ol.ImageTile, ol.TileCoord,
* ol.TileState, string, ?string,
* ol.TileLoadFunctionType)|undefined),
* wrapX: (boolean|undefined)}}
* wrapX: (boolean|undefined),
* transition: (number|undefined)}}
*/
olx.source.WMTSOptions;
@@ -6814,6 +6892,15 @@ olx.source.WMTSOptions.prototype.urls;
olx.source.WMTSOptions.prototype.wrapX;
/**
* Duration of the opacity transition for rendering. To disable the opacity
* transition, pass `transition: 0`.
* @type {number|undefined}
* @api
*/
olx.source.WMTSOptions.prototype.transition;
/**
* @typedef {{attributions: (ol.AttributionLike|undefined),
* cacheSize: (number|undefined),
@@ -6831,7 +6918,8 @@ olx.source.WMTSOptions.prototype.wrapX;
* tileUrlFunction: (ol.TileUrlFunctionType|undefined),
* url: (string|undefined),
* urls: (Array.<string>|undefined),
* wrapX: (boolean|undefined)}}
* wrapX: (boolean|undefined),
* transition: (number|undefined)}}
*/
olx.source.XYZOptions;
@@ -6987,6 +7075,16 @@ olx.source.XYZOptions.prototype.urls;
*/
olx.source.XYZOptions.prototype.wrapX;
/**
* Duration of the opacity transition for rendering. To disable the opacity
* transition, pass `transition: 0`.
* @type {number|undefined}
* @api
*/
olx.source.XYZOptions.prototype.transition;
/**
* @typedef {{attributions: (ol.AttributionLike|undefined),
* cacheSize: (number|undefined),
@@ -7111,7 +7209,8 @@ olx.source.CartoDBOptions.prototype.account;
* reprojectionErrorThreshold: (number|undefined),
* url: !string,
* tierSizeCalculation: (string|undefined),
* size: ol.Size}}
* size: ol.Size,
* transition: (number|undefined)}}
*/
olx.source.ZoomifyOptions;
@@ -7202,6 +7301,15 @@ olx.source.ZoomifyOptions.prototype.tierSizeCalculation;
olx.source.ZoomifyOptions.prototype.size;
/**
* Duration of the opacity transition for rendering. To disable the opacity
* transition, pass `transition: 0`.
* @type {number|undefined}
* @api
*/
olx.source.ZoomifyOptions.prototype.transition;
/**
* Namespace.
* @type {Object}

5
src/ol/imagetile.js
View File

@@ -16,10 +16,11 @@ goog.require('ol.events.EventType');
* @param {string} src Image source URI.
* @param {?string} crossOrigin Cross origin.
* @param {ol.TileLoadFunctionType} tileLoadFunction Tile load function.
* @param {olx.TileOptions=} opt_options Tile options.
*/
ol.ImageTile = function(tileCoord, state, src, crossOrigin, tileLoadFunction) {
ol.ImageTile = function(tileCoord, state, src, crossOrigin, tileLoadFunction, opt_options) {
ol.Tile.call(this, tileCoord, state);
ol.Tile.call(this, tileCoord, state, opt_options);
/**
* Image URI

12
src/ol/renderer/canvas/tilelayer.js
View File

@@ -183,7 +183,8 @@ ol.renderer.canvas.TileLayer.prototype.prepareFrame = function(frameState, layer
if (this.isDrawableTile_(tile)) {
if (tile.getState() == ol.TileState.LOADED) {
tilesToDrawByZ[z][tile.tileCoord.toString()] = tile;
if (!newTiles && (this.renderedTiles.indexOf(tile) === -1 || tile.getAlpha(ol.getUid(this), frameState.time) !== 1)) {
var inTransition = tile.getAlpha && tile.getAlpha(ol.getUid(this), frameState.time) !== 1;
if (!newTiles && (this.renderedTiles.indexOf(tile) === -1 || inTransition)) {
newTiles = true;
}
}
@@ -294,16 +295,18 @@ ol.renderer.canvas.TileLayer.prototype.prepareFrame = function(frameState, layer
* @param {number} gutter Tile gutter.
*/
ol.renderer.canvas.TileLayer.prototype.drawTileImage = function(tile, frameState, layerState, x, y, w, h, gutter) {
var image = tile.getImage(this.getLayer());
if (!image) {
return;
}
var alpha = tile.getAlpha(ol.getUid(this), frameState.time);
if (alpha === 1 && !this.getLayer().getSource().getOpaque(frameState.viewState.projection)) {
this.context.clearRect(x, y, w, h);
}
var image = tile.getImage(this.getLayer());
if (image) {
var alphaChanged = alpha !== this.context.globalAlpha;
if (alphaChanged) {
this.context.save();
this.context.globalAlpha = alpha;
this.context.globalAlpha = Math.min(0.5, alpha);
}
this.context.drawImage(image, gutter, gutter,
image.width - 2 * gutter, image.height - 2 * gutter, x, y, w, h);
@@ -314,7 +317,6 @@ ol.renderer.canvas.TileLayer.prototype.drawTileImage = function(tile, frameState
if (alpha !== 1) {
frameState.animate = true;
}
}
};

3
src/ol/reproj/tile.js
View File

@@ -34,8 +34,7 @@ goog.require('ol.reproj.Triangulation');
ol.reproj.Tile = function(sourceProj, sourceTileGrid,
targetProj, targetTileGrid, tileCoord, wrappedTileCoord,
pixelRatio, gutter, getTileFunction,
opt_errorThreshold,
opt_renderEdges) {
opt_errorThreshold, opt_renderEdges) {
ol.Tile.call(this, tileCoord, ol.TileState.IDLE);
/**

3
src/ol/source/bingmaps.js
View File

@@ -38,7 +38,8 @@ ol.source.BingMaps = function(options) {
state: ol.source.State.LOADING,
tileLoadFunction: options.tileLoadFunction,
tilePixelRatio: this.hidpi_ ? 2 : 1,
wrapX: options.wrapX !== undefined ? options.wrapX : true
wrapX: options.wrapX !== undefined ? options.wrapX : true,
transition: options.transition
});
/**

6
src/ol/source/tile.js
View File

@@ -71,6 +71,12 @@ ol.source.Tile = function(options) {
*/
this.key_ = '';
/**
* @protected
* @type {olx.TileOptions}
*/
this.tileOptions = {transition: options.transition};
};
ol.inherits(ol.source.Tile, ol.source.Source);

3
src/ol/source/tilearcgisrest.js
View File

@@ -39,7 +39,8 @@ ol.source.TileArcGISRest = function(opt_options) {
tileLoadFunction: options.tileLoadFunction,
url: options.url,
urls: options.urls,
wrapX: options.wrapX !== undefined ? options.wrapX : true
wrapX: options.wrapX !== undefined ? options.wrapX : true,
transition: options.transition
});
/**

8
src/ol/source/tileimage.js
View File

@@ -39,7 +39,8 @@ ol.source.TileImage = function(options) {
tileUrlFunction: options.tileUrlFunction,
url: options.url,
urls: options.urls,
wrapX: options.wrapX
wrapX: options.wrapX,
transition: options.transition
});
/**
@@ -52,7 +53,7 @@ ol.source.TileImage = function(options) {
/**
* @protected
* @type {function(new: ol.ImageTile, ol.TileCoord, ol.TileState, string,
* ?string, ol.TileLoadFunctionType)}
* ?string, ol.TileLoadFunctionType, olx.TileOptions=)}
*/
this.tileClass = options.tileClass !== undefined ?
options.tileClass : ol.ImageTile;
@@ -222,7 +223,8 @@ ol.source.TileImage.prototype.createTile_ = function(z, x, y, pixelRatio, projec
tileUrl !== undefined ? ol.TileState.IDLE : ol.TileState.EMPTY,
tileUrl !== undefined ? tileUrl : '',
this.crossOrigin,
this.tileLoadFunction);
this.tileLoadFunction,
this.tileOptions);
tile.key = key;
ol.events.listen(tile, ol.events.EventType.CHANGE,
this.handleTileChange, this);

3
src/ol/source/tilejson.js
View File

@@ -43,7 +43,8 @@ ol.source.TileJSON = function(options) {
reprojectionErrorThreshold: options.reprojectionErrorThreshold,
state: ol.source.State.LOADING,
tileLoadFunction: options.tileLoadFunction,
wrapX: options.wrapX !== undefined ? options.wrapX : true
wrapX: options.wrapX !== undefined ? options.wrapX : true,
transition: options.transition
});
if (options.url) {

3
src/ol/source/tilewms.js
View File

@@ -47,7 +47,8 @@ ol.source.TileWMS = function(opt_options) {
tileLoadFunction: options.tileLoadFunction,
url: options.url,
urls: options.urls,
wrapX: options.wrapX !== undefined ? options.wrapX : true
wrapX: options.wrapX !== undefined ? options.wrapX : true,
transition: options.transition
});
/**

3
src/ol/source/urltile.js
View File

@@ -29,7 +29,8 @@ ol.source.UrlTile = function(options) {
state: options.state,
tileGrid: options.tileGrid,
tilePixelRatio: options.tilePixelRatio,
wrapX: options.wrapX
wrapX: options.wrapX,
transition: options.transition
});
/**

6
src/ol/source/vectortile.js
View File

@@ -51,7 +51,8 @@ ol.source.VectorTile = function(options) {
tileUrlFunction: options.tileUrlFunction,
url: options.url,
urls: options.urls,
wrapX: options.wrapX === undefined ? true : options.wrapX
wrapX: options.wrapX === undefined ? true : options.wrapX,
transition: options.transition
});
/**
@@ -125,7 +126,8 @@ ol.source.VectorTile.prototype.getTile = function(z, x, y, pixelRatio, projectio
this.format_, this.tileLoadFunction, urlTileCoord, this.tileUrlFunction,
this.tileGrid, this.getTileGridForProjection(projection),
this.sourceTiles_, pixelRatio, projection, this.tileClass,
this.handleTileChange.bind(this));
this.handleTileChange.bind(this),
this.tileOptions);
this.tileCache.set(tileCoordKey, tile);
return tile;

3
src/ol/source/wmts.js
View File

@@ -166,7 +166,8 @@ ol.source.WMTS = function(options) {
tilePixelRatio: options.tilePixelRatio,
tileUrlFunction: tileUrlFunction,
urls: urls,
wrapX: options.wrapX !== undefined ? options.wrapX : false
wrapX: options.wrapX !== undefined ? options.wrapX : false,
transition: options.transition
});
this.setKey(this.getKeyForDimensions_());

3
src/ol/source/xyz.js
View File

@@ -54,7 +54,8 @@ ol.source.XYZ = function(opt_options) {
tileUrlFunction: options.tileUrlFunction,
url: options.url,
urls: options.urls,
wrapX: options.wrapX !== undefined ? options.wrapX : true
wrapX: options.wrapX !== undefined ? options.wrapX : true,
transition: options.transition
});
};

8
src/ol/source/zoomify.js
View File

@@ -139,7 +139,8 @@ ol.source.Zoomify = function(opt_options) {
reprojectionErrorThreshold: options.reprojectionErrorThreshold,
tileClass: ol.source.Zoomify.Tile_,
tileGrid: tileGrid,
tileUrlFunction: tileUrlFunction
tileUrlFunction: tileUrlFunction,
transition: options.transition
});
};
@@ -154,12 +155,13 @@ ol.inherits(ol.source.Zoomify, ol.source.TileImage);
* @param {string} src Image source URI.
* @param {?string} crossOrigin Cross origin.
* @param {ol.TileLoadFunctionType} tileLoadFunction Tile load function.
* @param {olx.TileOptions=} opt_options Tile options.
* @private
*/
ol.source.Zoomify.Tile_ = function(
tileCoord, state, src, crossOrigin, tileLoadFunction) {
tileCoord, state, src, crossOrigin, tileLoadFunction, opt_options) {
ol.ImageTile.call(this, tileCoord, state, src, crossOrigin, tileLoadFunction);
ol.ImageTile.call(this, tileCoord, state, src, crossOrigin, tileLoadFunction, opt_options);
/**
* @private

25
src/ol/tile.js
View File

@@ -1,8 +1,8 @@
goog.provide('ol.Tile');
goog.require('ol');
goog.require('ol.easing');
goog.require('ol.TileState');
goog.require('ol.easing');
goog.require('ol.events.EventTarget');
goog.require('ol.events.EventType');
@@ -16,11 +16,13 @@ goog.require('ol.events.EventType');
* @extends {ol.events.EventTarget}
* @param {ol.TileCoord} tileCoord Tile coordinate.
* @param {ol.TileState} state State.
* @param {olx.TileOptions=} opt_options Tile options.
*/
ol.Tile = function(tileCoord, state) {
ol.Tile = function(tileCoord, state, opt_options) {
ol.events.EventTarget.call(this);
var options = opt_options ? opt_options : {};
/**
* @type {ol.TileCoord}
*/
@@ -48,17 +50,12 @@ ol.Tile = function(tileCoord, state) {
*/
this.key = '';
/**
* The timing function to apply to any opacity transition.
* @type {function(number):number}
*/
this.transitionEasing_ = ol.easing.linear;
/**
* The duration for the opacity transition.
* @type {number}
*/
this.transitionDuration_ = 250;
this.transition_ = options.transition === undefined ?
250 : options.transition;
/**
* Lookup of start times for rendering transitions.
@@ -188,7 +185,7 @@ ol.Tile.prototype.load = function() {};
* @return {number} A number between 0 and 1.
*/
ol.Tile.prototype.getAlpha = function(id, time) {
if (!this.transitionEasing_) {
if (!this.transition_) {
return 1;
}
@@ -197,9 +194,9 @@ ol.Tile.prototype.getAlpha = function(id, time) {
start = time;
this.transitionStarts_[id] = start;
}
var delta = Date.now() - start + (1000 / 60); // avoid rendering at 0
if (delta >= this.transitionDuration_) {
var delta = time - start + (1000 / 60); // avoid rendering at 0
if (delta >= this.transition_) {
return 1;
}
return this.transitionEasing_(delta / this.transitionDuration_);
return ol.easing.easeIn(delta / this.transition_);
};

6
src/ol/typedefs.js
View File

@@ -580,7 +580,8 @@ ol.SourceSourceOptions;
* projection: ol.ProjectionLike,
* state: (ol.source.State|undefined),
* tileGrid: (ol.tilegrid.TileGrid|undefined),
* wrapX: (boolean|undefined)}}
* wrapX: (boolean|undefined),
* transition: (number|undefined)}}
*/
ol.SourceTileOptions;
@@ -599,7 +600,8 @@ ol.SourceTileOptions;
* tileUrlFunction: (ol.TileUrlFunctionType|undefined),
* url: (string|undefined),
* urls: (Array.<string>|undefined),
* wrapX: (boolean|undefined)}}
* wrapX: (boolean|undefined),
* transition: (number|undefined)}}
*/
ol.SourceUrlTileOptions;

5
src/ol/vectorimagetile.js
View File

@@ -30,12 +30,13 @@ goog.require('ol.featureloader');
* instantiate for source tiles.
* @param {function(this: ol.source.VectorTile, ol.events.Event)} handleTileChange
* Function to call when a source tile's state changes.
* @param {olx.TileOptions=} opt_options Tile options.
*/
ol.VectorImageTile = function(tileCoord, state, src, format, tileLoadFunction,
urlTileCoord, tileUrlFunction, sourceTileGrid, tileGrid, sourceTiles,
pixelRatio, projection, tileClass, handleTileChange) {
pixelRatio, projection, tileClass, handleTileChange, opt_options) {
ol.Tile.call(this, tileCoord, state);
ol.Tile.call(this, tileCoord, state, opt_options);
/**
* @private

5
src/ol/vectortile.js
View File

@@ -13,10 +13,11 @@ goog.require('ol.TileState');
* @param {string} src Data source url.
* @param {ol.format.Feature} format Feature format.
* @param {ol.TileLoadFunctionType} tileLoadFunction Tile load function.
* @param {olx.TileOptions=} opt_options Tile options.
*/
ol.VectorTile = function(tileCoord, state, src, format, tileLoadFunction) {
ol.VectorTile = function(tileCoord, state, src, format, tileLoadFunction, opt_options) {
ol.Tile.call(this, tileCoord, state);
ol.Tile.call(this, tileCoord, state, opt_options);
/**
* @type {number}

18
test/rendering/ol/layer/tile.test.js
View File

@@ -77,7 +77,8 @@ describe('ol.rendering.layer.Tile', function() {
beforeEach(function() {
source = new ol.source.XYZ({
url: 'rendering/ol/data/tiles/osm/{z}/{x}/{y}.png'
url: 'rendering/ol/data/tiles/osm/{z}/{x}/{y}.png',
transition: 0
});
});
@@ -104,10 +105,12 @@ describe('ol.rendering.layer.Tile', function() {
beforeEach(function() {
source1 = new ol.source.XYZ({
url: 'rendering/ol/data/tiles/osm/{z}/{x}/{y}.png'
url: 'rendering/ol/data/tiles/osm/{z}/{x}/{y}.png',
transition: 0
});
source2 = new ol.source.XYZ({
url: 'rendering/ol/data/tiles/stamen-labels/{z}/{x}/{y}.png'
url: 'rendering/ol/data/tiles/stamen-labels/{z}/{x}/{y}.png',
transition: 0
});
});
@@ -176,7 +179,8 @@ describe('ol.rendering.layer.Tile', function() {
beforeEach(function() {
source = new ol.source.XYZ({
url: 'rendering/ol/data/tiles/osm/{z}/{x}/{y}.png'
url: 'rendering/ol/data/tiles/osm/{z}/{x}/{y}.png',
transition: 0
});
});
@@ -205,7 +209,8 @@ describe('ol.rendering.layer.Tile', function() {
url: 'rendering/ol/data/tiles/' + tileSize + '/{z}/{x}/{y}.png',
tileGrid: ol.tilegrid.createXYZ({
tileSize: tileSize.split('x')
})
}),
transition: 0
});
}
@@ -255,7 +260,8 @@ describe('ol.rendering.layer.Tile', function() {
beforeEach(function() {
source = new ol.source.XYZ({
url: 'rendering/ol/data/tiles/osm/{z}/{x}/{y}.png'
url: 'rendering/ol/data/tiles/osm/{z}/{x}/{y}.png',
transition: 0
});
onAddLayer = function(evt) {
evt.element.on('render', function(e) {

3
test/rendering/ol/layer/vectortile.test.js
View File

@@ -65,7 +65,8 @@ describe('ol.rendering.layer.VectorTile', function() {
source = new ol.source.VectorTile({
format: new ol.format.MVT(),
tileGrid: ol.tilegrid.createXYZ(),
url: 'rendering/ol/data/tiles/mvt/{z}-{x}-{y}.vector.pbf'
url: 'rendering/ol/data/tiles/mvt/{z}-{x}-{y}.vector.pbf',
transition: 0
});
});

3
test/rendering/ol/source/tilewms.test.js
View File

@@ -51,7 +51,8 @@ describe('ol.rendering.source.TileWMS', function() {
'LAYERS': 'layer'
},
gutter: gutter,
url: 'rendering/ol/data/tiles/wms/wms' + gutter + '.png'
url: 'rendering/ol/data/tiles/wms/wms' + gutter + '.png',
transition: 0
});
}

4
test/spec/ol/renderer/canvas/vectortilelayer.test.js
View File

@@ -199,7 +199,8 @@ describe('ol.renderer.canvas.VectorTileLayer', function() {
it('re-renders when layer changed', function() {
var layer = new ol.layer.VectorTile({
source: new ol.source.VectorTile({
tileGrid: ol.tilegrid.createXYZ()
tileGrid: ol.tilegrid.createXYZ(),
transition: 0
})
});
var sourceTile = new ol.VectorTile([0, 0, 0], 2);
@@ -209,6 +210,7 @@ describe('ol.renderer.canvas.VectorTileLayer', function() {
return document.createElement('canvas');
};
var tile = new ol.VectorImageTile([0, 0, 0]);
tile.transition_ = 0;
tile.wrappedTileCoord = [0, 0, 0];
tile.setState(ol.TileState.LOADED);
tile.getSourceTile = function() {