Avoid setting marker opacity twice (#5441)

* avoid setting opacity twice

* updating CHANGELOG

* add PR number and link to CHANGELOG

* setOpacity handles being called from constructor

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 ### ✨ Features and improvements
 
+- Avoid setting marker opacity twice. ([#5441](https://github.com/maplibre/maplibre-gl-js/pull/5441))
 - Fix rendering Japanese symbols which are accidentally ignored. ([#5421](https://github.com/maplibre/maplibre-gl-js/pull/5421)
 - _...Add new stuff here..._
 

src/ui/marker.ts

@@ -168,7 +168,6 @@ export class Marker extends Evented {
         this._rotation = options && options.rotation || 0;
         this._rotationAlignment = options && options.rotationAlignment || 'auto';
         this._pitchAlignment = options && options.pitchAlignment && options.pitchAlignment !== 'auto' ?  options.pitchAlignment : this._rotationAlignment;
-        this.setOpacity(); // set default opacity
         this.setOpacity(options?.opacity, options?.opacityWhenCovered);
 
         if (!options || !options.element) {
@@ -857,16 +856,19 @@ export class Marker extends Evented {
      * @param opacityWhenCovered - Sets the `opacityWhenCovered` property of the marker.
      */
     setOpacity(opacity?: string, opacityWhenCovered?: string): this {
-        if (opacity === undefined && opacityWhenCovered === undefined) {
+        // Reset opacity when called without params or from constructor
+        if (this._opacity === undefined || (opacity === undefined && opacityWhenCovered === undefined)) {
             this._opacity = '1';
             this._opacityWhenCovered = '0.2';
         }
+
         if (opacity !== undefined) {
             this._opacity = opacity;
         }
         if (opacityWhenCovered !== undefined) {
             this._opacityWhenCovered = opacityWhenCovered;
         }
+
         if (this._map) {
             this._updateOpacity(true);
         }