Fix background opacity adjustment

src/app/map/gisaf-mapbox/gisaf-mapbox.component.ts

@@ -197,9 +197,18 @@ export class GisafMapboxComponent implements OnInit, OnDestroy {
   }
 
   _getNewSingleOpacity(layerId: string, originalOpacity: number | object): number | object {
-    if (typeof (originalOpacity) === 'number') {
+    if (originalOpacity === undefined) {
+      return undefined
+    }
+    else if (typeof originalOpacity === 'number') {
       return originalOpacity * this._baseStyleOpacity
     }
+    else if (typeof originalOpacity === 'object') {  // Also matches array
+      if (originalOpacity[0] == 'interpolate') {
+        // Change the last interpolation point
+        originalOpacity[Object.values(originalOpacity).length - 1] = this._baseStyleOpacity
+        return originalOpacity
+      }
       else {
         let newOpacity = {}
         for (const k in originalOpacity) {
@@ -214,30 +223,40 @@ export class GisafMapboxComponent implements OnInit, OnDestroy {
         return newOpacity
       }
     }
+    else {
+      console.log(`Cannot process opacity of layer ${layerId}, unknown type ${typeof originalOpacity}`)
+      return originalOpacity
+    }
+  }
 
   _getNewOpacity(layer: object): object {
     let originalStyle = this.originalBaseStyle.style['layers'].find(
       (_layer: object) => layer['id'] == _layer['id']
     )
-    if (!('paint' in originalStyle)) {
+    let originalPaint = originalStyle['paint'] || {}
-      originalStyle['paint'] = {}
+    if (layer['type'] == 'symbol') {
-    }
-    if (['raster', 'background', 'fill', 'line'].indexOf(layer['type']) != -1) {
-      let prop = layer['type'] + '-opacity'
-      return {
-        [prop]: this._getNewSingleOpacity(layer['id'], originalStyle['paint'][prop] || 1.0)
-      }
-    }
-    else {
       let prop1 = 'text-opacity'
       let prop2 = 'icon-opacity'
-      let newOpacity1 = this._getNewSingleOpacity(layer['id'], originalStyle['paint'][prop1] || 1.0)
+      let newOpacity1 = this._getNewSingleOpacity(layer['id'], originalPaint[prop1] || 1.0)
-      let newOpacity2 = this._getNewSingleOpacity(layer['id'], originalStyle['paint'][prop2] || 1.0)
+      let newOpacity2 = this._getNewSingleOpacity(layer['id'], originalPaint[prop2] || 1.0)
       return {
         [prop1]: newOpacity1,
         [prop2]: newOpacity2,
       }
     }
+    else if (layer['type'] == 'line') {
+      let prop = layer['type'] + '-opacity'
+      return {
+        [prop]: this._getNewSingleOpacity(layer['id'], originalPaint[prop] || 1.0)
+      }
+    }
+    else {
+      // layer['type'] in ['raster', 'background', 'fill', 'line', 'fill-extrusion']
+      let prop = layer['type'] + '-opacity'
+      return {
+        [prop]: this._getNewSingleOpacity(layer['id'], originalPaint[prop] || 1.0),
+      }
+    }
   }
 
   applyBaseStyleOpacity() {
@@ -247,10 +266,12 @@ export class GisafMapboxComponent implements OnInit, OnDestroy {
         continue
       }
       for (const [key, value] of Object.entries(this._getNewOpacity(bsLayer))) {
+        if (value !== undefined) {
           this.map.setPaintProperty(bsLayer.id, key, value)
         }
       }
     }
+  }
 
   /*
    * For reference: