Interpolate also alpha channel

web/src/helpers/interpolateColors.ts

@@ -1,16 +1,15 @@
 import { ColorEntry } from '../pages/harmonie/draw/constants'
 
-type RGBu8 = [number, number, number]
 type RGBAu8 = [number, number, number, number]
 
-export function interpolateColors(value: number, a: RGBu8, b: RGBu8): RGBAu8 {
+export function interpolateColors(value: number, a: RGBAu8, b: RGBAu8): RGBAu8 {
     const color = a.slice(0).map((from, i) => {
         const to = b[i]
         const delta = (to - from) * (value/255)
         return from + delta
     })
 
-    return [...color, 255] as RGBAu8
+    return [...color] as RGBAu8
 }
 
 export function valueToColorThreshold(value: number, colorArr: ColorEntry[]): [number, number, number, number] {
@@ -37,8 +36,8 @@ export function valueToColorInterpolated(value: number, colorArr: ColorEntry[]):
         }
     }
 
-    const maxDeg = closeMax.color.slice(0, 3) as [number, number, number]
-    const minDeg = closeMin.color.slice(0, 3) as [number, number, number]
+    const maxDeg = closeMax.color
+    const minDeg = closeMin.color
     const scale = Math.abs(closeMax.value - closeMin.value)
     const delta = 255*(value - closeMin.value)/scale
     const rgba = interpolateColors(delta, minDeg, maxDeg)

web/src/pages/harmonie/draw/constants.ts

@@ -24,8 +24,7 @@ export const PRECIPITATION: ColorEntry[] = [
     { value: 1, color: [40, 109, 246, 255] },
     { value: 0.5, color: [80, 162, 248, 255] },
     { value: 0.2, color: [118, 202, 249, 255] },
-    { value: 0.1, color: [152, 233, 252, 255] },
-    { value: 0.05, color: [255, 255, 255, 255] },
+    { value: 0.1, color: [152, 233, 252, 0] },
 ]
 
 // from ltv

web/src/pages/harmonie/draw/drawGrib.ts

@@ -221,15 +221,16 @@ function drawContour(
 }
 
 
-function rgbHexToU8(hex: string): RGBu8 {
+function rgbHexToU8(hex: string): RGBAu8 {
     return [
         parseInt(`0x${hex.slice(1, 3)}`),
         parseInt(`0x${hex.slice(3, 5)}`),
         parseInt(`0x${hex.slice(5, 7)}`),
+        255,
     ]
 }
 
-type RGBu8 = [number, number, number]
+type RGBAu8 = [number, number, number, number]
 
 export function isMeteoEqual(meteo: MeteoParam, arr: number[]): boolean {
     const arr2 = [meteo.discipline, meteo.category, meteo.product]