Render tiles with an opacity transition
This commit is contained in:
@@ -183,7 +183,7 @@ 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) {
|
||||
if (!newTiles && (this.renderedTiles.indexOf(tile) === -1 || tile.getAlpha(ol.getUid(this), frameState.time) !== 1)) {
|
||||
newTiles = true;
|
||||
}
|
||||
}
|
||||
@@ -225,7 +225,6 @@ ol.renderer.canvas.TileLayer.prototype.prepareFrame = function(frameState, layer
|
||||
canvas.width = width;
|
||||
canvas.height = height;
|
||||
} else {
|
||||
context.clearRect(0, 0, width, height);
|
||||
oversampling = this.oversampling_;
|
||||
}
|
||||
}
|
||||
@@ -295,13 +294,26 @@ 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) {
|
||||
if (!this.getLayer().getSource().getOpaque(frameState.viewState.projection)) {
|
||||
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.drawImage(image, gutter, gutter,
|
||||
image.width - 2 * gutter, image.height - 2 * gutter, x, y, w, h);
|
||||
|
||||
if (alphaChanged) {
|
||||
this.context.restore();
|
||||
}
|
||||
if (alpha !== 1) {
|
||||
frameState.animate = true;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user