Merge pull request #9131 from fredj/opacity_cmp

Don't use strict comparison with style.opacity

src/ol/layer/Base.js

@@ -91,7 +91,7 @@ class BaseLayer extends BaseObject {
       layer: this,
       managed: true
     });
-    state.opacity = clamp(this.getOpacity(), 0, 1);
+    state.opacity = clamp(Math.round(this.getOpacity() * 100) / 100, 0, 1);
     state.sourceState = this.getSourceState();
     state.visible = this.getVisible();
     state.extent = this.getExtent();

src/ol/layer/Layer.js

@@ -35,7 +35,7 @@ import SourceState from '../source/State.js';
 /**
  * @typedef {Object} State
  * @property {import("./Base.js").default} layer
- * @property {number} opacity
+ * @property {number} opacity Opacity, the value is rounded to two digits to appear after the decimal point.
  * @property {SourceState} sourceState
  * @property {boolean} visible
  * @property {boolean} managed

src/ol/renderer/canvas/ImageLayer.js

@@ -149,7 +149,7 @@ class CanvasImageLayerRenderer extends CanvasLayerRenderer {
     }
 
     const opacity = layerState.opacity;
-    if (opacity !== canvas.style.opacity) {
+    if (opacity !== parseFloat(canvas.style.opacity)) {
       canvas.style.opacity = opacity;
     }
 

src/ol/renderer/canvas/TileLayer.js

@@ -303,7 +303,7 @@ class CanvasTileLayerRenderer extends CanvasLayerRenderer {
     }
 
     const opacity = layerState.opacity;
-    if (opacity !== canvas.style.opacity) {
+    if (opacity !== parseFloat(canvas.style.opacity)) {
       canvas.style.opacity = opacity;
     }
 

src/ol/renderer/canvas/VectorLayer.js

@@ -180,7 +180,7 @@ class CanvasVectorLayerRenderer extends CanvasLayerRenderer {
     this.postRender(context, frameState);
 
     const opacity = layerState.opacity;
-    if (opacity !== canvas.style.opacity) {
+    if (opacity !== parseFloat(canvas.style.opacity)) {
       canvas.style.opacity = opacity;
     }
 

src/ol/renderer/canvas/VectorTileLayer.js

@@ -508,7 +508,7 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer {
     }
 
     const opacity = layerState.opacity;
-    if (opacity !== canvas.style.opacity) {
+    if (opacity !== parseFloat(canvas.style.opacity)) {
       canvas.style.opacity = opacity;
     }
 

src/ol/renderer/webgl/PointsLayer.js

@@ -252,7 +252,7 @@ class WebGLPointsLayerRenderer extends LayerRenderer {
     const canvas = this.helper_.getCanvas();
 
     const opacity = layerState.opacity;
-    if (opacity !== canvas.style.opacity) {
+    if (opacity !== parseFloat(canvas.style.opacity)) {
       canvas.style.opacity = opacity;
     }