diff --git a/src/ol/render/canvas/canvasimmediate.js b/src/ol/render/canvas/canvasimmediate.js index 40a0d795f0..b1be7d6453 100644 --- a/src/ol/render/canvas/canvasimmediate.js +++ b/src/ol/render/canvas/canvasimmediate.js @@ -114,6 +114,12 @@ ol.render.canvas.Immediate = function(context, pixelRatio, extent, transform) { */ this.imageHeight_ = 0; + /** + * @private + * @type {number} + */ + this.imageOpacity_ = 0; + /** * @private * @type {number} @@ -207,6 +213,10 @@ ol.render.canvas.Immediate.prototype.drawImages_ = flatCoordinates, 2, this.transform_, this.pixelCoordinates_); var context = this.context_; var localTransform = this.tmpLocalTransform_; + var alpha = context.globalAlpha; + if (this.imageOpacity_ != 1) { + context.globalAlpha = alpha * this.imageOpacity_; + } var i, ii; for (i = 0, ii = pixelCoordinates.length; i < ii; i += 2) { var x = pixelCoordinates[i] - this.imageAnchorX_; @@ -234,6 +244,9 @@ ol.render.canvas.Immediate.prototype.drawImages_ = if (this.imageRotation_ !== 0 || this.imageScale_ != 1) { context.setTransform(1, 0, 0, 1, 0, 0); } + if (this.imageOpacity_ != 1) { + context.globalAlpha = alpha; + } }; @@ -766,6 +779,7 @@ ol.render.canvas.Immediate.prototype.setImageStyle = function(imageStyle) { var imageAnchor = imageStyle.getAnchor(); // FIXME pixel ratio var imageImage = imageStyle.getImage(1); + var imageOpacity = imageStyle.getOpacity(); var imageRotation = imageStyle.getRotation(); var imageScale = imageStyle.getScale(); var imageSize = imageStyle.getSize(); @@ -777,6 +791,7 @@ ol.render.canvas.Immediate.prototype.setImageStyle = function(imageStyle) { this.imageAnchorY_ = imageAnchor[1]; this.imageHeight_ = imageSize[1]; this.image_ = imageImage; + this.imageOpacity_ = goog.isDef(imageOpacity) ? imageOpacity : 1; this.imageRotation_ = goog.isDef(imageRotation) ? imageRotation : 0; this.imageScale_ = goog.isDef(imageScale) ? imageScale : 1; this.imageSnapToPixel_ = goog.isDef(imageSnapToPixel) ?