Add wind direction drawing

web/src/harmonie/GribFile.tsx

@@ -5,7 +5,7 @@ import { apiHost } from '../consts'
 import { GribMessage } from './interfaces'
 import { fetchBuffer } from '../helpers/fetch'
 import { drawGrib } from './draw/drawGrib'
-import { fetchWindData } from './draw/windDirection'
+import { fetchWindData, getFakeWindDirection } from './draw/windDirection'
 
 const CROP_BOUNDS = { x: 1906-1-400, y: 950, width: 400, height: 300 }
 
@@ -32,7 +32,11 @@ export const GribFile: Component<{
         if (getGribList().length === 0) {
             fetch(`${apiHost}/api/show/grib/${name}`)
                 .then(re => re.json())
-                .then(setGribList)
+                .then((gribList: GribMessage[]) => {
+                    const windSpeed = gribList.find(m => m.meteo.discipline===0 && m.meteo.category===2 && m.meteo.product===1)
+                    if (windSpeed) gribList.push(getFakeWindDirection(windSpeed))
+                    setGribList(gribList)
+                })
         }
     }
 
@@ -66,7 +70,7 @@ export const GribFile: Component<{
         const binaryOffset = binarySection.offset + 5
         const binaryLength = binarySection.size - 5
         const fetchPromise: Promise<[GribMessage[], ArrayBuffer[], ArrayBuffer[]]> = grib.meteo.discipline === 0 && grib.meteo.category === 2 && grib.meteo.product === 192
-            ? fetchWindData(grib, getGribList())
+            ? fetchWindData(grib, getGribList(), name)
             : Promise.all([
                 Promise.resolve([grib]),
                 fetchBuffer(`${apiHost}/api/grib/binary-chunk/${binaryOffset}/${binaryLength}/${name}`).then(b=>[b]),

web/src/harmonie/draw/windDirection.ts

@@ -141,6 +141,7 @@ export function windSpeedColors(
 export function fetchWindData(
     customMessage: GribMessage,
     gribArr: GribMessage[],
+    fileName: string,
 ): Promise<[GribMessage[], ArrayBuffer[], ArrayBuffer[]]> {
     const windU = gribArr.find(m => m.meteo.discipline===0 && m.meteo.category===2 && m.meteo.product===2 && m.meteo.levelType===103 && m.meteo.levelValue===10)
     const windV = gribArr.find(m => m.meteo.discipline===0 && m.meteo.category===2 && m.meteo.product===3 && m.meteo.levelType===103 && m.meteo.levelValue===10)
@@ -157,8 +158,8 @@ export function fetchWindData(
     const vBinaryLength = section7v.size - 5
 
     return Promise.all([
-        fetchBuffer(`${apiHost}/api/binary-chunk/${uBinaryOffset}/${uBinaryLength}`),
-        fetchBuffer(`${apiHost}/api/binary-chunk/${vBinaryOffset}/${vBinaryLength}`),
+        fetchBuffer(`${apiHost}/api/grib/binary-chunk/${uBinaryOffset}/${uBinaryLength}/${fileName}`),
+        fetchBuffer(`${apiHost}/api/grib/binary-chunk/${vBinaryOffset}/${vBinaryLength}/${fileName}`),
     ]).then(([bufferU, bufferV]) => {
         const buffer = new Uint8Array(bufferU.byteLength + bufferV.byteLength)
         buffer.set(new Uint8Array(bufferU))
@@ -172,3 +173,10 @@ export function fetchWindData(
 function toInt(bytes: Uint8Array): number {
     return bytes.reduce((acc, curr) => acc * 256 + curr)
 }
+
+export function getFakeWindDirection(windSpeed: GribMessage): GribMessage {
+    const modifiedWindSpeed = structuredClone(windSpeed)
+    modifiedWindSpeed.meteo = {...modifiedWindSpeed.meteo, product: 192}
+    modifiedWindSpeed.title = 'meteorology, momentum, wind direction 10m (calc u,v)'
+    return modifiedWindSpeed
+}