From ae47d3df589666223704c806240cad01eec675af Mon Sep 17 00:00:00 2001 From: ahocevar Date: Wed, 22 May 2019 12:20:34 +0200 Subject: [PATCH] Use opacity from layer state --- src/ol/renderer/canvas/ImageLayer.js | 4 ++-- src/ol/renderer/canvas/Layer.js | 3 ++- src/ol/renderer/canvas/TileLayer.js | 9 +++++---- src/ol/renderer/canvas/VectorImageLayer.js | 2 +- src/ol/renderer/canvas/VectorLayer.js | 8 ++++---- src/ol/renderer/canvas/VectorTileLayer.js | 4 ++-- 6 files changed, 16 insertions(+), 14 deletions(-) diff --git a/src/ol/renderer/canvas/ImageLayer.js b/src/ol/renderer/canvas/ImageLayer.js index 0b7e9a4fa3..bd40b16878 100644 --- a/src/ol/renderer/canvas/ImageLayer.js +++ b/src/ol/renderer/canvas/ImageLayer.js @@ -101,7 +101,7 @@ class CanvasImageLayerRenderer extends CanvasLayerRenderer { ); makeInverse(this.inversePixelTransform_, this.pixelTransform_); - this.useContainer(target, this.pixelTransform_); + this.useContainer(target, this.pixelTransform_, layerState.opacity); const context = this.context; const canvas = context.canvas; @@ -140,7 +140,7 @@ class CanvasImageLayerRenderer extends CanvasLayerRenderer { this.preRender(context, frameState); if (dw >= 0.5 && dh >= 0.5) { - const opacity = this.getLayer().getOpacity(); + const opacity = layerState.opacity; let previousAlpha; if (opacity !== 1) { previousAlpha = this.context.globalAlpha; diff --git a/src/ol/renderer/canvas/Layer.js b/src/ol/renderer/canvas/Layer.js index af036f3c60..568ba6edd8 100644 --- a/src/ol/renderer/canvas/Layer.js +++ b/src/ol/renderer/canvas/Layer.js @@ -74,8 +74,9 @@ class CanvasLayerRenderer extends LayerRenderer { * Get a rendering container from an existing target, if compatible. * @param {HTMLElement} target Potential render target. * @param {import("../../transform").Transform} transform Transform. + * @param {number} opacity Opacity. */ - useContainer(target, transform) { + useContainer(target, transform, opacity) { const layerClassName = this.getLayer().getClassName(); let container, context; if (target) { diff --git a/src/ol/renderer/canvas/TileLayer.js b/src/ol/renderer/canvas/TileLayer.js index a8eaea7205..dd65150e9a 100644 --- a/src/ol/renderer/canvas/TileLayer.js +++ b/src/ol/renderer/canvas/TileLayer.js @@ -233,7 +233,7 @@ class CanvasTileLayerRenderer extends CanvasLayerRenderer { -width / 2, -height / 2 ); - this.useContainer(target, this.pixelTransform_); + this.useContainer(target, this.pixelTransform_, layerState.opacity); const context = this.context; const canvas = context.canvas; @@ -334,7 +334,7 @@ class CanvasTileLayerRenderer extends CanvasLayerRenderer { clips.push(currentClip); clipZs.push(currentZ); } - this.drawTileImage(tile, frameState, x, y, w, h, tileGutter, transition); + this.drawTileImage(tile, frameState, x, y, w, h, tileGutter, transition, layerState.opacity); if (clips) { context.restore(); } @@ -377,14 +377,15 @@ class CanvasTileLayerRenderer extends CanvasLayerRenderer { * @param {number} h Height of the tile. * @param {number} gutter Tile gutter. * @param {boolean} transition Apply an alpha transition. + * @param {number} opacity Opacity. */ - drawTileImage(tile, frameState, x, y, w, h, gutter, transition) { + drawTileImage(tile, frameState, x, y, w, h, gutter, transition, opacity) { const image = this.getTileImage(tile); if (!image) { return; } const uid = getUid(this); - const alpha = this.getLayer().getOpacity() * (transition ? tile.getAlpha(uid, frameState.time) : 1); + const alpha = opacity * (transition ? tile.getAlpha(uid, frameState.time) : 1); const alphaChanged = alpha !== this.context.globalAlpha; if (alphaChanged) { this.context.save(); diff --git a/src/ol/renderer/canvas/VectorImageLayer.js b/src/ol/renderer/canvas/VectorImageLayer.js index f3bc9a5428..c4b6d98c27 100644 --- a/src/ol/renderer/canvas/VectorImageLayer.js +++ b/src/ol/renderer/canvas/VectorImageLayer.js @@ -78,7 +78,7 @@ class CanvasVectorImageLayerRenderer extends CanvasImageLayerRenderer { if (!hints[ViewHint.ANIMATING] && !hints[ViewHint.INTERACTING] && !isEmpty(renderedExtent)) { let skippedFeatures = this.skippedFeatures_; - vectorRenderer.useContainer(null, null); + vectorRenderer.useContainer(null, null, 1); const context = vectorRenderer.context; const imageFrameState = /** @type {import("../../PluggableMap.js").FrameState} */ (assign({}, frameState, { declutterItems: [], diff --git a/src/ol/renderer/canvas/VectorLayer.js b/src/ol/renderer/canvas/VectorLayer.js index ff73140764..5e872c63cc 100644 --- a/src/ol/renderer/canvas/VectorLayer.js +++ b/src/ol/renderer/canvas/VectorLayer.js @@ -70,11 +70,11 @@ class CanvasVectorLayerRenderer extends CanvasLayerRenderer { /** * @inheritDoc */ - useContainer(target, transform) { - if (this.getLayer().getOpacity() < 1) { + useContainer(target, transform, opacity) { + if (opacity < 1) { target = null; } - super.useContainer(target, transform); + super.useContainer(target, transform, opacity); } /** @@ -88,7 +88,7 @@ class CanvasVectorLayerRenderer extends CanvasLayerRenderer { makeScale(this.pixelTransform_, 1 / pixelRatio, 1 / pixelRatio); makeInverse(this.inversePixelTransform_, this.pixelTransform_); - this.useContainer(target, this.pixelTransform_); + this.useContainer(target, this.pixelTransform_, layerState.opacity); const context = this.context; const canvas = context.canvas; diff --git a/src/ol/renderer/canvas/VectorTileLayer.js b/src/ol/renderer/canvas/VectorTileLayer.js index d3b16c63a3..e463b2aff7 100644 --- a/src/ol/renderer/canvas/VectorTileLayer.js +++ b/src/ol/renderer/canvas/VectorTileLayer.js @@ -114,7 +114,7 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer { /** * @inheritDoc */ - useContainer(target, transform) { + useContainer(target, transform, opacity) { let overlayContext; if (target && target.childElementCount === 2) { overlayContext = target.lastElementChild.getContext('2d'); @@ -123,7 +123,7 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer { } } const containerReused = this.containerReused; - super.useContainer(target, transform); + super.useContainer(target, transform, opacity); if (containerReused && !this.containerReused && !overlayContext) { this.overlayContext_ = null; }