npm - @opengeoweb/soundings - Versions diffs - 12.2.0 → 12.3.0 - Mend

@opengeoweb/soundings 12.2.0 → 12.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (30) hide show

package/index.esm.js CHANGED Viewed

@@ -1,15 +1,95 @@
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import React, { useRef, useEffect, useState, Fragment as Fragment$1, useMemo } from 'react';
+import { jsx, jsxs, Fragment as Fragment$1 } from 'react/jsx-runtime';
+import React, { useRef, useEffect, useState, Fragment, useMemo } from 'react';
 import * as d3 from 'd3';
-import { Card, List, ListItem, ListItemIcon, Checkbox, MenuItem, Box, ListItemText, ListSubheader, ListItemButton, Collapse, Button } from '@mui/material';
-import { useSetupDialog, uiTypes, uiSelectors, uiActions } from '@opengeoweb/store';
-import { ToolContainerDraggable, StyledSelect, dateUtils } from '@opengeoweb/shared';
-import 'i18next';
-import { useTranslation } from 'react-i18next';
+import { Card, List, ListItem, ListItemIcon, Checkbox, MenuItem, Box, ListItemText, Typography, ListSubheader, ListItemButton, Collapse, Stack, LinearProgress } from '@mui/material';
+import { selectorMemoizationOptions, useSetupDialog, uiTypes, uiSelectors, uiActions, uiReducer, mapReducer } from '@opengeoweb/store';
+import { useDispatch, useSelector } from 'react-redux';
+import { ToolContainerDraggable, StyledSelect, dateUtils, CustomToggleButton, AlertBanner } from '@opengeoweb/shared';
+import i18n from 'i18next';
+export { default as i18n } from 'i18next';
+import { useTranslation, initReactI18next } from 'react-i18next';
 import { getHeaders, handleResponse } from '@opengeoweb/api';
-import { useQueries } from '@tanstack/react-query';
+import { createSlice, createSelector, combineReducers, configureStore } from '@reduxjs/toolkit';
+import { useQueries, useQuery } from '@tanstack/react-query';
 import { ChevronDown, Sources } from '@opengeoweb/theme';
-import { useDispatch, useSelector } from 'react-redux';
+var en = {
+	sources: "Sources",
+	latest: "Latest",
+	noInstancesAvailable: "No instances found",
+	noServicesFound: "No source available",
+	locations: "Locations",
+	"locations-menu-warning": "You have to choose your sources in the sources menu"
+};
+var no = {
+	sources: "Kilder",
+	latest: "Siste",
+	noInstancesAvailable: "Ingen instanser funnet",
+	noServicesFound: "Ingen tjenester funnet",
+	locations: "Lokasjoner",
+	"locations-menu-warning": "Du må velge kilder i kilde-menyen"
+};
+var nl = {
+	sources: "Bronnen",
+	latest: "Nieuwste",
+	noInstancesAvailable: "Geen exemplaren gevonden",
+	noServicesFound: "Geen bron beschikbaar",
+	locations: "Locaties",
+	"locations-menu-warning": "Selecteer eerst een bron in het bron menu"
+};
+var fi = {
+	sources: "Lähteet",
+	latest: "Viimeisin",
+	noInstancesAvailable: "Tapauksia ei löytynyt",
+	noServicesFound: "Lähdettä ei ole saatavilla",
+	locations: "Locations",
+	"locations-menu-warning": "Valitse ensin lähde lähdevalikosta"
+};
+var soundingsTranslations = {
+	en: en,
+	no: no,
+	nl: nl,
+	fi: fi
+};
+/* *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Copyright 2025 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2025 - Finnish Meteorological Institute (FMI)
+ * Copyright 2025 - The Norwegian Meteorological Institute (MET Norway)
+ * */
+const isobarValues = [200, 300, 400, 500, 700, 850, 925, 1000];
+const drawIsobars = ({
+  minTemperature,
+  maxTemperature,
+  xScale,
+  yScale,
+  svg
+}) => {
+  // Calculate X and Y coordinates for each pressure level
+  for (const pressureVal of isobarValues) {
+    const Px = [];
+    const tempBounds = [minTemperature, maxTemperature];
+    for (const bound of tempBounds) {
+      Px.push([xScale(bound), yScale(pressureVal)]);
+    }
+    const lineGenerator = d3.line();
+    const isoPathString = lineGenerator(Px);
+    const strID = `${pressureVal}textId`;
+    svg.append('path').attr('id', strID).attr('type', 'isobar').attr('d', isoPathString).style('fill', 'none').style('stroke-width', 1.5).style('stroke', '#B5B51F').style('stroke-opacity', 0.5);
+  }
+};
 /* *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -38,20 +118,33 @@ const initializeSvg = ({
 }) => {
   const svg = d3.select(svgRef.current).attr('width', width + (margin.left + margin.right)).attr('height', height + (margin.top + margin.bottom)).attr('id', 'skewT').attr('data-testid', 'skewT').append('g').attr('transform', `translate(${margin.left + margin.right},${margin.top})`);
   svg.append('clipPath').attr('id', 'clip-skewTd3').append('rect').attr('width', width).attr('height', height).attr('x', 0).attr('y', 0);
-  svg.append('rect').attr('height', height).attr('width', width).attr('fill', 'white').attr('opacity', 1).attr('id', 'skewTd3').attr('clip-path', 'url(#clip-skewTd3)');
+  svg.append('rect').attr('height', height).attr('width', width).attr('fill', 'none').attr('opacity', 1).attr('id', 'skewTd3').attr('clip-path', 'url(#clip-skewTd3)');
   return svg;
 };
 const drawAxes = ({
   svg,
   xScale,
   yScale,
-  height,
-  width
+  height
 }) => {
   // Create x-axis with intervals
-  svg.append('g').attr('transform', `translate(0,${height})`).call(d3.axisBottom(xScale).ticks(10)).append('text').attr('fill', '#000').attr('x', `${width - 8}px`).attr('y', `${12}px`).attr('dy', '1em').attr('font-size', '12px').attr('text-anchor', 'middle').text('°C');
+  const xTicks = xScale.ticks(10);
+  const xMiddleValue = xTicks[Math.floor(xTicks.length / 2)];
+  svg.append('g').attr('type', 'x-axis').attr('transform', `translate(0,${height})`).call(d3.axisBottom(xScale).tickValues(xTicks).tickSizeInner(0).tickSizeOuter(0));
+  // Reformat in the case of the middle tick label
+  // to add the unit part
+  svg.selectAll('g[type="x-axis"] .tick').filter(function () {
+    return parseInt(d3.select(this).select('text').text(), 10) === xMiddleValue;
+  }).each(function () {
+    const unitPart = '°C';
+    d3.select(this).select('text')
+    // tspan necessary to use a different font-size
+    .append('tspan').text(unitPart).attr('font-size', '11px').attr('dy', '0.04em');
+  });
   // Create y-axis with intervals
-  svg.append('g').call(d3.axisLeft(yScale).ticks(0, '')).append('text').attr('fill', '#000').attr('transform', 'translate(0)').attr('y', `${0}px`).attr('x', `${ -16}px`).attr('font-size', '12px').attr('dy', '1em').attr('text-anchor', 'middle').text('hPa');
+  // Make sure all zeroes are printed (1000 vs 1k)
+  const formatTicks = d3.format('.0f');
+  svg.append('g').call(d3.axisLeft(yScale).tickValues(isobarValues).tickFormat(formatTicks).tickSizeInner(0).tickSizeOuter(0)).call(g => g.select('.domain').remove()).append('text').attr('fill', 'currentColor').attr('x', '0').attr('y', yScale(400)).attr('font-size', '11px').attr('dy', '-0.9em').attr('text-anchor', 'left').text('hPa');
 };
 const addLegends = ({
   svg,
@@ -81,6 +174,493 @@ const plotSounding = ({
   svg.append('path').attr('d', pathString).attr('x', 0).attr('y', 0).style('fill', 'none').style('stroke-width', 2).style('stroke', color).style('stroke-opacity', 1).style('stroke-dasharray', lineStyle).attr('clip-path', 'url(#clip-skewTd3)');
 };
+/* *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Copyright 2025 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2025 - Finnish Meteorological Institute (FMI)
+ * Copyright 2025 - The Norwegian Meteorological Institute (MET Norway)
+ * */
+const windSymbolDefinitions = {
+  calm: `<svg width="50" height="50" viewBox="0 0 50 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M25 45C36.0456 45 45 36.0456 45 25C45 13.9543 36.0456 5 25 5C13.9543 5 5 13.9543 5 25C5 36.0456 13.9543 45 25 45Z" stroke="black" stroke-width="1.8"/>
+</svg>
+`,
+  lightAir: `<svg width="14" height="48" viewBox="0 0 14 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.22656 4.89307V48.0001M7.22656 43.0262V44.6842" stroke="black" stroke-width="1.8"/>
+</svg>
+`,
+  fiveKnots: `<svg width="15" height="49" viewBox="0 0 15 49" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.26953 5.57324V48.608M8.26953 40.5757L0.269531 42.2309" stroke="black" stroke-width="1.8"/>
+</svg>`,
+  tenKnots: `<svg width="24" height="49" viewBox="0 0 24 49" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17.0781 4.64502V44.9031L1.07812 47.9999" stroke="black" stroke-width="1.8"/>
+</svg>`,
+  fifteenKnots: `<svg width="23" height="50" viewBox="0 0 23 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.4727 5.55469V45.8128L0.472656 48.9095M16.4727 38.0708L9.61551 39.6192" stroke="black" stroke-width="1.8"/>
+</svg>
+`,
+  twentyKnots: `<svg width="24" height="49" viewBox="0 0 24 49" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.8555 4.71924V44.9773L0.855469 48.0741M16.8555 38.4093L0.855469 41.5061" stroke="black" stroke-width="1.8"/>
+</svg>`,
+  twentyFiveKnots: `<svg width="23" height="51" viewBox="0 0 23 51" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.2383 4.94434V46.1541L0.238281 49.3241M16.2383 40.3787L0.238281 43.5486M16.2383 33.9801L9.38114 35.5651" stroke="black" stroke-width="1.8"/>
+</svg>`,
+  thirtyKnots: `<svg width="23" height="50" viewBox="0 0 23 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.1914 5.64502V45.9031L0.191406 48.9999M16.1914 40.3459L0.191406 43.4427M16.1914 34.9407L0.191406 38.0375" stroke="black" stroke-width="1.8"/>
+</svg>`,
+  thirtyFiveKnots: `<svg width="19" height="50" viewBox="0 0 19 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.0028 4.96729V45.2253L1.16406 48.3221M12.0028 39.6443L1.16406 42.7411M12.0028 34.4793L1.16406 37.576M12.0028 29.2735L7.35761 30.8219" stroke="black" stroke-width="1.8"/>
+</svg>`,
+  fortyKnots: `<svg width="24" height="50" viewBox="0 0 24 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.5391 5.40311V45.6612L0.539062 48.7579M16.5391 40.4525L0.539062 43.5493M16.5391 35.0449L0.539062 38.1417M16.5391 30.2009L0.539062 33.2976" stroke="black" stroke-width="1.8"/>
+</svg>`,
+  fortyFiveKnots: `<svg width="23" height="50" viewBox="0 0 23 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.4492 5.4043V45.6624L0.449219 48.7591M16.4492 40.1513L0.449219 43.2481M16.4492 34.7124L0.449219 37.8091M16.4492 29.2013L0.449219 32.2981M16.4492 24.3066L9.59208 25.855" stroke="black" stroke-width="1.8"/>
+</svg>`,
+  fiftyKnots: `<svg width="24" height="49" viewBox="0 0 24 49" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.9062 5.27002V45.5281L0.90625 48.6249L16.9062 37.7861" fill="black"/>
+<path d="M16.9053 5.27002V45.5281L4.35132 47.2337L16.9053 37.7861" stroke="black" stroke-width="1.8"/>
+</svg>
+`,
+  fiftyFiveKnots: `<svg width="24" height="49" viewBox="0 0 24 49" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.728 5.55371V45.8118L0.894531 48.9085L16.728 38.0698" fill="black"/>
+<path d="M16.73 5.55371V45.8118L4.33984 47.5245L16.73 38.0698" stroke="black" stroke-width="1.8"/>
+<path d="M16.7292 32.7358C13.6376 33.3406 8.8125 34.2842 8.8125 34.2842" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>`,
+  sixtyKnots: `<svg width="23" height="49" viewBox="0 0 23 49" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.2891 5.27051V45.5286L0.289062 48.6253L16.2891 37.7866" fill="black"/>
+<path d="M16.2897 5.27051V45.5286L3.7422 47.2478L16.2897 37.7866" stroke="black" stroke-width="1.8"/>
+<path d="M16.2891 34.6899L0.289062 37.7867" stroke="black" stroke-width="1.8"/>
+</svg>`,
+  sixtyFiveKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V43.5261L4.35938 45.2985L16.9984 35.7842" stroke="black" stroke-width="1.8"/>
+<path d="M17 32.0788L1 35.1756M17 26.8862L9.5 28.5" stroke="black" stroke-width="1.8"/>
+</svg>`,
+  seventyKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V43.5261L4.35938 45.2985L16.9984 35.7842" stroke="black" stroke-width="1.8"/>
+<path d="M17 32.0788L1 35.1756M17 26.8862L1 29.983" stroke="black" stroke-width="1.8"/>
+</svg>`,
+  seventyFiveKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V43.5261L4.35938 45.2985L16.9984 35.7842" stroke="black" stroke-width="1.8"/>
+<path d="M17 32.0788L1 35.1756M17 26.8862L1 29.983" stroke="black" stroke-width="1.8"/>
+<path d="M16.9167 22C13.8251 22.6048 9 23.5484 9 23.5484" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>`,
+  eightyKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V43.5261L4.35938 45.2985L16.9984 35.7842" stroke="black" stroke-width="1.8"/>
+<path d="M17 32.0788L1 35.1756M17 26.8862L1 29.983" stroke="black" stroke-width="1.8"/>
+<path d="M17 22C10.7518 23.1718 1 25 1 25" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>`,
+  eightyFiveKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V43.5261L4.35938 45.2985L16.9984 35.7842" stroke="black" stroke-width="1.8"/>
+<path d="M16.9167 17C13.8251 17.6048 9 18.5484 9 18.5484" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 32.0788L1 35.1756M17 26.8862L1 29.983" stroke="black" stroke-width="1.8"/>
+<path d="M17 22C10.7518 23.1718 1 25 1 25" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>
+`,
+  ninetyKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V43.5261L4.35938 45.2985L16.9984 35.7842" stroke="black" stroke-width="1.8"/>
+<path d="M17 32.0788L1 35.1756M17 26.8862L1 29.983" stroke="black" stroke-width="1.8"/>
+<path d="M17 22C10.7518 23.1718 1 25 1 25" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 17C10.7518 18.1718 1 20 1 20" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>
+`,
+  ninetyFiveKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V43.5261L4.35938 45.2985L16.9984 35.7842" stroke="black" stroke-width="1.8"/>
+<path d="M17 32.0788L1 35.1756M17 26.8862L1 29.983" stroke="black" stroke-width="1.8"/>
+<path d="M17 22C10.7518 23.1718 1 25 1 25" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 17C10.7518 18.1718 1 20 1 20" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M16.9167 12C13.8251 12.6048 9 13.5484 9 13.5484" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>`,
+  hundredKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V23.3971V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V28M16.9984 35.7842L4.35938 45.2985L16.9984 43.5261V35.5M16.9984 28C16.9984 28 5.67406 35.7842 4 37M16.9984 28V29.5M4 37C9.07621 36.4142 16.9984 35.5 16.9984 35.5M4 37C9.07621 34.0711 16.9984 29.5 16.9984 29.5M4 37C9.07682 34.6569 17 31 17 31M4 37C9.07621 35.2426 16.9984 32.5 16.9984 32.5M4 37C9.07621 35.8284 16.9984 34 16.9984 34M16.9984 35.5V34M16.9984 29.5V32.5M16.9984 32.5V34" stroke="black" stroke-width="1.8"/>
+</svg>
+`,
+  hundredFiveKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V23.3971V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V28M16.9984 35.7842L4.35938 45.2985L16.9984 43.5261V35.5M16.9984 28C16.9984 28 5.67406 35.7842 4 37M16.9984 28V29.5M4 37C9.07621 36.4142 16.9984 35.5 16.9984 35.5M4 37C9.07621 34.0711 16.9984 29.5 16.9984 29.5M4 37C9.07682 34.6569 17 31 17 31M4 37C9.07621 35.2426 16.9984 32.5 16.9984 32.5M4 37C9.07621 35.8284 16.9984 34 16.9984 34M16.9984 35.5V34M16.9984 29.5V32.5M16.9984 32.5V34" stroke="black" stroke-width="1.8"/>
+<path d="M16.9167 25C13.8251 25.6048 9 26.5484 9 26.5484" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>
+`,
+  hundredTenKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V23.3971V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V28M16.9984 35.7842L4.35938 45.2985L16.9984 43.5261V35.5M16.9984 28C16.9984 28 5.67406 35.7842 4 37M16.9984 28V29.5M4 37C9.07621 36.4142 16.9984 35.5 16.9984 35.5M4 37C9.07621 34.0711 16.9984 29.5 16.9984 29.5M4 37C9.07682 34.6569 17 31 17 31M4 37C9.07621 35.2426 16.9984 32.5 16.9984 32.5M4 37C9.07621 35.8284 16.9984 34 16.9984 34M16.9984 35.5V34M16.9984 29.5V32.5M16.9984 32.5V34" stroke="black" stroke-width="1.8"/>
+<path d="M17 25C10.7518 26.1718 1 28 1 28" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>`,
+  hundredFifteenKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V23.3971V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V28M16.9984 35.7842L4.35938 45.2985L16.9984 43.5261V35.5M16.9984 28C16.9984 28 5.67406 35.7842 4 37M16.9984 28V29.5M4 37C9.07621 36.4142 16.9984 35.5 16.9984 35.5M4 37C9.07621 34.0711 16.9984 29.5 16.9984 29.5M4 37C9.07682 34.6569 17 31 17 31M4 37C9.07621 35.2426 16.9984 32.5 16.9984 32.5M4 37C9.07621 35.8284 16.9984 34 16.9984 34M16.9984 35.5V34M16.9984 29.5V32.5M16.9984 32.5V34" stroke="black" stroke-width="1.8"/>
+<path d="M17 25C10.7518 26.1718 1 28 1 28" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M16.9167 21C13.8251 21.6048 9 22.5484 9 22.5484" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>`,
+  hundredTwentyKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V23.3971V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V28M16.9984 35.7842L4.35938 45.2985L16.9984 43.5261V35.5M16.9984 28C16.9984 28 5.67406 35.7842 4 37M16.9984 28V29.5M4 37C9.07621 36.4142 16.9984 35.5 16.9984 35.5M4 37C9.07621 34.0711 16.9984 29.5 16.9984 29.5M4 37C9.07682 34.6569 17 31 17 31M4 37C9.07621 35.2426 16.9984 32.5 16.9984 32.5M4 37C9.07621 35.8284 16.9984 34 16.9984 34M16.9984 35.5V34M16.9984 29.5V32.5M16.9984 32.5V34" stroke="black" stroke-width="1.8"/>
+<path d="M17 25C10.7518 26.1718 1 28 1 28" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 21C10.7518 22.1718 1 24 1 24" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>`,
+  hundredTwentyFiveKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V23.3971V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V28M16.9984 35.7842L4.35938 45.2985L16.9984 43.5261V35.5M16.9984 28C16.9984 28 5.67406 35.7842 4 37M16.9984 28V29.5M4 37C9.07621 36.4142 16.9984 35.5 16.9984 35.5M4 37C9.07621 34.0711 16.9984 29.5 16.9984 29.5M4 37C9.07682 34.6569 17 31 17 31M4 37C9.07621 35.2426 16.9984 32.5 16.9984 32.5M4 37C9.07621 35.8284 16.9984 34 16.9984 34M16.9984 35.5V34M16.9984 29.5V32.5M16.9984 32.5V34" stroke="black" stroke-width="1.8"/>
+<path d="M17 25C10.7518 26.1718 1 28 1 28" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 21C10.7518 22.1718 1 24 1 24" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M16.9167 17C13.8251 17.6048 9 18.5484 9 18.5484" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>
+`,
+  hundredThirtyKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V23.3971V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V28M16.9984 35.7842L4.35938 45.2985L16.9984 43.5261V35.5M16.9984 28C16.9984 28 5.67406 35.7842 4 37M16.9984 28V29.5M4 37C9.07621 36.4142 16.9984 35.5 16.9984 35.5M4 37C9.07621 34.0711 16.9984 29.5 16.9984 29.5M4 37C9.07682 34.6569 17 31 17 31M4 37C9.07621 35.2426 16.9984 32.5 16.9984 32.5M4 37C9.07621 35.8284 16.9984 34 16.9984 34M16.9984 35.5V34M16.9984 29.5V32.5M16.9984 32.5V34" stroke="black" stroke-width="1.8"/>
+<path d="M17 25C10.7518 26.1718 1 28 1 28" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 21C10.7518 22.1718 1 24 1 24" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 17C10.7518 18.1718 1 20 1 20" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>`,
+  hundredThirtyFiveKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V23.3971V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V28M16.9984 35.7842L4.35938 45.2985L16.9984 43.5261V35.5M16.9984 28C16.9984 28 5.67406 35.7842 4 37M16.9984 28V29.5M4 37C9.07621 36.4142 16.9984 35.5 16.9984 35.5M4 37C9.07621 34.0711 16.9984 29.5 16.9984 29.5M4 37C9.07682 34.6569 17 31 17 31M4 37C9.07621 35.2426 16.9984 32.5 16.9984 32.5M4 37C9.07621 35.8284 16.9984 34 16.9984 34M16.9984 35.5V34M16.9984 29.5V32.5M16.9984 32.5V34" stroke="black" stroke-width="1.8"/>
+<path d="M17 25C10.7518 26.1718 1 28 1 28" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 21C10.7518 22.1718 1 24 1 24" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 17C10.7518 18.1718 1 20 1 20" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M16.9167 13C13.8251 13.6048 9 14.5484 9 14.5484" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>`,
+  hundredFortyKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V23.3971V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V28M16.9984 35.7842L4.35938 45.2985L16.9984 43.5261V35.5M16.9984 28C16.9984 28 5.67406 35.7842 4 37M16.9984 28V29.5M4 37C9.07621 36.4142 16.9984 35.5 16.9984 35.5M4 37C9.07621 34.0711 16.9984 29.5 16.9984 29.5M4 37C9.07682 34.6569 17 31 17 31M4 37C9.07621 35.2426 16.9984 32.5 16.9984 32.5M4 37C9.07621 35.8284 16.9984 34 16.9984 34M16.9984 35.5V34M16.9984 29.5V32.5M16.9984 32.5V34" stroke="black" stroke-width="1.8"/>
+<path d="M17 25C10.7518 26.1718 1 28 1 28" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 21C10.7518 22.1718 1 24 1 24" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 17C10.7518 18.1718 1 20 1 20" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 13C10.7518 14.1718 1 16 1 16" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>`,
+  hundredFortyFiveKnots: `<svg width="24" height="49" viewBox="0 0 24 49" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 5.26807V25.3971V45.5261L1 48.6229L17 37.7842" fill="black"/>
+<path d="M16.9984 5.26807V30M16.9984 37.7842L4.35938 47.2985L16.9984 45.5261V37.5M16.9984 30C16.9984 30 5.67406 37.7842 4 39M16.9984 30V31.5M4 39C9.07621 38.4142 16.9984 37.5 16.9984 37.5M4 39C9.07621 36.0711 16.9984 31.5 16.9984 31.5M4 39C9.07682 36.6569 17 33 17 33M4 39C9.07621 37.2426 16.9984 34.5 16.9984 34.5M4 39C9.07621 37.8284 16.9984 36 16.9984 36M16.9984 37.5V36M16.9984 31.5V34.5M16.9984 34.5V36" stroke="black" stroke-width="1.8"/>
+<path d="M16.9167 12C13.8251 12.6048 9 13.5484 9 13.5484" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 27C10.7518 28.1718 1 30 1 30" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 23C10.7518 24.1718 1 26 1 26" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 19C10.7518 20.1718 1 22 1 22" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+<path d="M17 15C10.7518 16.1718 1 18 1 18" stroke="black" stroke-width="1.8" stroke-miterlimit="16"/>
+</svg>`,
+  hundredFiftyKnots: `<svg width="24" height="47" viewBox="0 0 24 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 3.26807V23.3971V43.5261L1 46.6229L17 35.7842" fill="black"/>
+<path d="M16.9984 3.26807V19M16.9984 35.7842L4.35938 45.2985L16.9984 43.5261V35.5M16.9984 28C16.9984 28 5.67406 35.7842 4 37M16.9984 28V29.5M16.9984 28V26.5M4 37C9.07621 36.4142 16.9984 35.5 16.9984 35.5M4 37C9.07621 34.0711 16.9984 29.5 16.9984 29.5M4 37C9.07682 34.6569 17 31 17 31M4 37C9.07621 35.2426 16.9984 32.5 16.9984 32.5M4 37C9.07621 35.8284 16.9984 34 16.9984 34M16.9984 35.5V34M16.9984 29.5V32.5M16.9984 32.5V34M16.9984 19C16.9984 19 8 25.5 4 29M16.9984 19V20.5M4 29C9.07621 28.0237 16.9984 26.5 16.9984 26.5M4 29C9.07621 25.6805 16.9984 20.5 16.9984 20.5M4 29C9.07621 26.4616 16.9984 22.5 16.9984 22.5M4 29C9.07621 27.0474 16.9984 24 16.9984 24M4 29C9.07621 27.5355 16.9984 25.25 16.9984 25.25M16.9984 26.5V25.25M16.9984 20.5V22.5M16.9984 22.5V24M16.9984 24V25.25" stroke="black" stroke-width="1.8"/>
+</svg>`
+};
+const windSpeedRanges = [{
+  min: 0,
+  max: 1,
+  symbol: windSymbolDefinitions.calm
+}, {
+  min: 1,
+  max: 4.5,
+  symbol: windSymbolDefinitions.lightAir
+}, {
+  min: 4.5,
+  max: 7.5,
+  symbol: windSymbolDefinitions.fiveKnots
+}, {
+  min: 7.5,
+  max: 12.5,
+  symbol: windSymbolDefinitions.tenKnots
+}, {
+  min: 12.5,
+  max: 17.5,
+  symbol: windSymbolDefinitions.fifteenKnots
+}, {
+  min: 17.5,
+  max: 22.5,
+  symbol: windSymbolDefinitions.twentyKnots
+}, {
+  min: 22.5,
+  max: 27.5,
+  symbol: windSymbolDefinitions.twentyFiveKnots
+}, {
+  min: 27.5,
+  max: 32.5,
+  symbol: windSymbolDefinitions.thirtyKnots
+}, {
+  min: 32.5,
+  max: 37.5,
+  symbol: windSymbolDefinitions.thirtyFiveKnots
+}, {
+  min: 37.5,
+  max: 42.5,
+  symbol: windSymbolDefinitions.fortyKnots
+}, {
+  min: 42.5,
+  max: 47.5,
+  symbol: windSymbolDefinitions.fortyFiveKnots
+}, {
+  min: 47.5,
+  max: 52.5,
+  symbol: windSymbolDefinitions.fiftyKnots
+}, {
+  min: 52.5,
+  max: 57.5,
+  symbol: windSymbolDefinitions.fiftyFiveKnots
+}, {
+  min: 57.5,
+  max: 62.5,
+  symbol: windSymbolDefinitions.sixtyKnots
+}, {
+  min: 62.5,
+  max: 67.5,
+  symbol: windSymbolDefinitions.sixtyFiveKnots
+}, {
+  min: 67.5,
+  max: 72.5,
+  symbol: windSymbolDefinitions.seventyKnots
+}, {
+  min: 72.5,
+  max: 77.5,
+  symbol: windSymbolDefinitions.seventyFiveKnots
+}, {
+  min: 77.5,
+  max: 82.5,
+  symbol: windSymbolDefinitions.eightyKnots
+}, {
+  min: 82.5,
+  max: 87.5,
+  symbol: windSymbolDefinitions.eightyFiveKnots
+}, {
+  min: 87.5,
+  max: 92.5,
+  symbol: windSymbolDefinitions.ninetyKnots
+}, {
+  min: 92.5,
+  max: 97.5,
+  symbol: windSymbolDefinitions.ninetyFiveKnots
+}, {
+  min: 97.5,
+  max: 102.5,
+  symbol: windSymbolDefinitions.hundredKnots
+}, {
+  min: 102.5,
+  max: 107.5,
+  symbol: windSymbolDefinitions.hundredFiveKnots
+}, {
+  min: 107.5,
+  max: 112.5,
+  symbol: windSymbolDefinitions.hundredTenKnots
+}, {
+  min: 112.5,
+  max: 117.5,
+  symbol: windSymbolDefinitions.hundredFifteenKnots
+}, {
+  min: 117.5,
+  max: 122.5,
+  symbol: windSymbolDefinitions.hundredTwentyKnots
+}, {
+  min: 122.5,
+  max: 127.5,
+  symbol: windSymbolDefinitions.hundredTwentyFiveKnots
+}, {
+  min: 127.5,
+  max: 132.5,
+  symbol: windSymbolDefinitions.hundredThirtyKnots
+}, {
+  min: 132.5,
+  max: 137.5,
+  symbol: windSymbolDefinitions.hundredThirtyFiveKnots
+}, {
+  min: 137.5,
+  max: 142.5,
+  symbol: windSymbolDefinitions.hundredFortyKnots
+}, {
+  min: 142.5,
+  max: 147.5,
+  symbol: windSymbolDefinitions.hundredFortyFiveKnots
+}, {
+  min: 147.5,
+  max: 152,
+  symbol: windSymbolDefinitions.hundredFiftyKnots
+}];
+/* *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Copyright 2025 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2025 - Finnish Meteorological Institute (FMI)
+ * Copyright 2025 - The Norwegian Meteorological Institute (MET Norway)
+ * */
+const metersPerSecondToKnots = metersPerSecond => metersPerSecond * 1.94384;
+const extendIsoBar = (path, horizontalBarbMargin) => {
+  const match = path.match(/^M([\d.-]+),([\d.-]+)\s*L([\d.-]+),([\d.-]+)/);
+  if (match) {
+    const startX = parseFloat(match[1]);
+    const startY = parseFloat(match[2]);
+    const endX = parseFloat(match[3]);
+    const endY = parseFloat(match[4]);
+    return `M${startX},${startY}L${endX + horizontalBarbMargin * 3},${endY}`;
+  }
+  return path;
+};
+const extendXAxis = (path, horizontalBarbMargin) => {
+  const match = path.match(/^M([\d.-]+),([\d.-]+)H([\d.-]+)/);
+  if (match) {
+    const endX = parseFloat(match[3]);
+    return path.replace(/H[\d.-]+/, `H${endX + horizontalBarbMargin * 3}`);
+  }
+  return path;
+};
+const drawWindBarbs = ({
+  svgRef,
+  data,
+  width,
+  height,
+  margin,
+  minPressure,
+  maxPressure,
+  barbColor = 'black'
+}) => {
+  const barbsSize = 25;
+  const scalingFactor = 0.5;
+  const horizontalBarbMargin = barbsSize * scalingFactor;
+  const visibleItems = removeItemsByGrowthType(data.reverse(), GrowthType.EXPONENTIAL, 1.15, 1).filter(item => item.pressure >= 150);
+  // Measure width and height and make extra room for one column
+  // of windbarbs
+  const svg = d3.select(svgRef.current);
+  const currentWidth = svg.node()?.getBoundingClientRect().width;
+  if (!currentWidth) {
+    return;
+  }
+  // Add extra width to all isobars needed for the windbarbs
+  d3.selectAll('path[type="isobar"]').each(function () {
+    const path = d3.select(this).attr('d');
+    const newD = extendIsoBar(path, horizontalBarbMargin);
+    d3.select(this).attr('d', newD).attr('clip-path', null);
+  });
+  // Add extra width to x-axis needed for the windbarbs
+  d3.select('g[type="x-axis"] path.domain').each(function () {
+    const path = d3.select(this).attr('d');
+    const newD = extendXAxis(path, horizontalBarbMargin);
+    d3.select(this).attr('d', newD);
+  });
+  svg.attr('width', currentWidth + margin.right + margin.left + barbsSize);
+  const pressureScale = d3.scaleLog().domain([maxPressure, minPressure]).range([height, 0]).clamp(true);
+  const barbGroup = svg.append('g').attr('class', 'wind-group').attr('transform',
+  // This translation should be revisited when implementing
+  // the plotting of several datasets at once
+  `translate(${(currentWidth ?? width) + horizontalBarbMargin}, ${margin.top})`);
+  barbGroup.selectAll('g').data(visibleItems).enter().append('g').attr('id', 'wind-barb').each(function handleBarb(data) {
+    const group = d3.select(this);
+    const windSymbol = getWindSymbol(data.windSpeed);
+    if (windSymbol) {
+      // Inner group will have rotation and scaling applied to it
+      const innerGroup = group.append('g');
+      innerGroup.node()?.appendChild(windSymbol);
+      // Update stroke color
+      innerGroup.selectAll('*').attr('stroke', barbColor);
+      // Only update the fill for the paths that already used a fill
+      // in their original svg form.
+      innerGroup.selectAll('*').each(function () {
+        const el = d3.select(this);
+        const currentFill = el.attr('fill');
+        if (currentFill && currentFill !== 'none') {
+          el.attr('fill', barbColor);
+        }
+      });
+      const bbox = windSymbol.getBBox();
+      // Central point
+      const cx = bbox.x + bbox.width / 2;
+      const cy = bbox.y + bbox.height / 2;
+      const rotation = 180 + data.windDirection;
+      const y = pressureScale(data.pressure);
+      // Place items in the correct vertical position
+      // Correcting for barbSize
+      group.attr('transform', `translate(0, ${y - barbsSize * scalingFactor / 8})`);
+      // Rotate accordingly, and scale
+      innerGroup.attr('transform', `rotate(${rotation}) scale(${scalingFactor}) translate(${-cx}, ${-cy})`);
+    }
+  });
+};
+const GrowthType = {
+  LINEAR: 'LINEAR',
+  EXPONENTIAL: 'EXPONENTIAL',
+  CUBIC: 'CUBIC'
+};
+const removeItemsByGrowthType = (array, growthType = 'LINEAR', base = 2, initial = 1) => {
+  if (!Object.values(GrowthType).includes(growthType)) {
+    throw new Error('Unsupported growth type');
+  }
+  if (!Array.isArray(array) || array.length === 0) {
+    return [];
+  }
+  if (growthType === GrowthType.LINEAR && base === 0) {
+    throw new Error('Base must be greater than 0');
+  }
+  if (growthType === GrowthType.EXPONENTIAL && base <= 1) {
+    throw new Error('Base must be greater than 1');
+  }
+  if (growthType === GrowthType.CUBIC && base <= 0) {
+    throw new Error('Base must be greater than 0');
+  }
+  const indicesToKeep = [];
+  let i = 0;
+  let nextIndex = 0;
+  while (nextIndex < array.length) {
+    switch (growthType) {
+      case GrowthType.LINEAR:
+        nextIndex = initial + i * base;
+        break;
+      case GrowthType.EXPONENTIAL:
+        nextIndex = Math.floor(initial * base ** i);
+        break;
+      case GrowthType.CUBIC:
+        nextIndex = initial + Math.floor(i ** 3 * base);
+        break;
+    }
+    if (nextIndex < array.length) {
+      indicesToKeep.push(nextIndex);
+    }
+    i += 1;
+  }
+  return array.filter((_, index) => indicesToKeep.includes(index));
+};
+const getWindSymbol = value => {
+  const valueKts = metersPerSecondToKnots(value);
+  const matchedRange = windSpeedRanges.find(({
+    min,
+    max
+  }) => valueKts >= min && valueKts < max);
+  // Out of range
+  if (!matchedRange) {
+    return null;
+  }
+  // SVG string to actual SVG element
+  const parser = new DOMParser();
+  const svgDoc = parser.parseFromString(matchedRange.symbol, 'image/svg+xml');
+  const svgNode = svgDoc.documentElement;
+  // Return the parsed SVG node
+  return svgNode;
+};
 /* *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -133,48 +713,6 @@ const drawDryAdiabats = ({
   }
 };
-/* *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- *
- * Copyright 2025 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
- * Copyright 2025 - Finnish Meteorological Institute (FMI)
- * Copyright 2025 - The Norwegian Meteorological Institute (MET Norway)
- * */
-const isobarValues = [200, 300, 400, 500, 700, 850, 925, 1000];
-const drawIsobars = ({
-  minTemperature,
-  maxTemperature,
-  xScale,
-  yScale,
-  svg
-}) => {
-  // Calculate X and Y coordinates for each pressure level
-  for (const pressureVal of isobarValues) {
-    const Px = [];
-    const tempBounds = [minTemperature, maxTemperature];
-    const Ppx = yScale(pressureVal);
-    for (const bound of tempBounds) {
-      Px.push([xScale(bound), yScale(pressureVal)]);
-    }
-    const lineGenerator = d3.line();
-    const isoPathString = lineGenerator(Px);
-    const strID = `${pressureVal}textId`;
-    svg.append('path').attr('id', strID).attr('d', isoPathString).style('fill', 'none').style('stroke-width', 1.5).style('stroke', '#B5B51F').style('stroke-opacity', 0.5).attr('clip-path', 'url(#clip-skewTd3)');
-    svg.append('text').text(pressureVal).attr('text-anchor', 'middle').attr('x', `${ -24}px`).attr('y', Ppx + 5) // Y-coordinate of the label
-    .attr('fill', '#000').attr('font-size', '12px');
-  }
-};
 /* *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -474,7 +1012,7 @@ const Soundings = ({
     const staticPressureArray = [maxPressure];
     const dp = -5;
     const minTemperature = -40;
-    const maxTemperature = 40;
+    const maxTemperature = 40.6;
     let pressure = maxPressure;
     while (pressure > minPressure) {
       pressure += dp;
@@ -488,8 +1026,7 @@ const Soundings = ({
       svg,
       xScale,
       yScale,
-      height,
-      width
+      height
     });
     // Draw static lines
     drawStaticLines({
@@ -535,13 +1072,30 @@ const Soundings = ({
       height,
       svg
     });
+    const windData = features.map(feature => ({
+      windDirection: feature.properties.windDirection,
+      windSpeed: feature.properties.windSpeed,
+      pressure: feature.properties.pressure
+    }));
+    drawWindBarbs({
+      svgRef,
+      data: windData,
+      width,
+      height,
+      margin,
+      minPressure,
+      maxPressure,
+      barbColor: SOUNDING_COLORS[0]
+    });
+    const svgRefCur = svgRef.current;
     // eslint-disable-next-line consistent-return
     return () => {
+      d3.select(svgRefCur).selectAll('.wind-group').remove();
       svg.selectAll('*').remove();
       // svg.on('mousemove', null)
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+  }, [features]);
   return jsx(Card, {
     children: jsx("svg", {
       ref: svgRef
@@ -567,80 +1121,55 @@ const Soundings = ({
  * Copyright 2024 - The Norwegian Meteorological Institute (MET Norway)
  * */
 const SOUNDINGS_NAMESPACE = 'soundings';
+const defaultLanguage = 'en';
+const initSoundingsI18n = () => {
+  void i18n.use(initReactI18next).init({
+    lng: defaultLanguage,
+    ns: SOUNDINGS_NAMESPACE,
+    interpolation: {
+      escapeValue: false
+    },
+    resources: {
+      en: {
+        [SOUNDINGS_NAMESPACE]: soundingsTranslations.en
+      },
+      nl: {
+        [SOUNDINGS_NAMESPACE]: soundingsTranslations.nl
+      },
+      fi: {
+        [SOUNDINGS_NAMESPACE]: soundingsTranslations.fi
+      },
+      no: {
+        [SOUNDINGS_NAMESPACE]: soundingsTranslations.no
+      }
+    }
+  });
+};
+const translateKeyOutsideComponents = (key, params = undefined) => i18n.t(key, {
+  ns: [SOUNDINGS_NAMESPACE],
+  ...params
+});
 const useSoundingsTranslation = () => useTranslation(SOUNDINGS_NAMESPACE);
 const SoundingsSourceMenu = ({
   soundingsCollections,
   isOpen = false,
-  handleClose
+  handleClose,
+  updateCollection,
+  sourceSelections
 }) => {
   const {
     t
   } = useSoundingsTranslation();
-  const [currentSelection, setCurrentSelection] = React.useState({});
-  React.useEffect(() => {
-    const initialSelection = {};
-    soundingsCollections?.forEach(collection => {
-      const initialInstanceId = collection.instances.length > 0 ? collection.instances[0].id : undefined;
-      initialSelection[collection.id] = {
-        isChecked: false,
-        selectedInstanceId: initialInstanceId
-      };
-    });
-    setCurrentSelection(initialSelection);
-  }, [soundingsCollections]);
-  // TODO move to redux
   const handleSelectionChange = (collectionId, update) => {
-    setCurrentSelection(prev => {
-      const currentCollectionState = prev[collectionId] || {};
-      return {
-        ...prev,
-        [collectionId]: {
-          ...currentCollectionState,
-          ...update
-        }
-      };
-    });
+    updateCollection(collectionId, update);
   };
-  const getDisplayValue = (collection, instanceId) => {
+  const getDisplayValue = instanceId => {
     if (!instanceId) {
-      return jsx(Fragment, {
-        children: t('noInstancesAvailable')
-      });
-    }
-    const instanceIndex = collection.instances.findIndex(i => i.id === instanceId);
-    if (instanceIndex === 0) {
-      return jsxs(Box, {
-        display: "flex",
-        children: [jsx(Box, {
-          sx: {
-            minWidth: 200
-          },
-          children: collection.name
-        }), jsx(Box, {
-          sx: {
-            textOverflow: 'ellipsis',
-            overflow: 'hidden'
-          },
-          children: t('latest')
-        })]
-      });
+      return t('noInstancesAvailable');
     }
-    return jsxs(Box, {
-      display: "flex",
-      children: [jsx(Box, {
-        sx: {
-          minWidth: 200
-        },
-        children: collection.name
-      }), jsx(Box, {
-        sx: {
-          textOverflow: 'ellipsis',
-          overflow: 'hidden'
-        },
-        children: dateUtils.dateToIsoString(dateUtils.isoStringToDate(instanceId))
-      })]
-    });
+    const instanceAsDate = dateUtils.isoStringToDate(instanceId);
+    return instanceAsDate ? dateUtils.dateToIsoString(instanceAsDate) : instanceId;
   };
   return jsx(ToolContainerDraggable, {
     startSize: {
@@ -656,10 +1185,12 @@ const SoundingsSourceMenu = ({
         pr: 1
       },
       children: soundingsCollections && soundingsCollections.length > 0 ? soundingsCollections.map(collection => {
-        const currentCollectionState = currentSelection[collection.id];
-        const isChecked = currentCollectionState?.isChecked ?? false;
-        const selectedInstanceId = currentCollectionState?.selectedInstanceId ?? ''; // Use empty string for Select value if undefined
+        const {
+          isChecked,
+          instanceId
+        } = sourceSelections[collection.id] || {};
         const hasInstances = collection.instances.length > 0;
+        const selectedInstanceId = instanceId || collection.instances[0].id;
         return jsxs(ListItem, {
           disablePadding: true,
           children: [jsx(ListItemIcon, {
@@ -667,25 +1198,43 @@ const SoundingsSourceMenu = ({
               minWidth: 42
             },
             children: jsx(Checkbox, {
-              checked: isChecked,
+              checked: !!isChecked,
               onChange: event => handleSelectionChange(collection.id, {
-                isChecked: event.target.checked
+                isChecked: event.target.checked,
+                instanceId: selectedInstanceId
               }),
               disableRipple: true
             })
           }), jsxs(StyledSelect, {
             isEnabled: true,
+            additionalStyling: {
+              width: 'calc(100% - 24px)'
+            },
             skipLocalStyling: false,
             value: selectedInstanceId,
             onChange: event => handleSelectionChange(collection.id, {
-              selectedInstanceId: event.target.value
+              instanceId: event.target.value
             }),
             renderValue: value => jsx(Box, {
               sx: {
                 textOverflow: 'ellipsis',
                 overflow: 'hidden'
               },
-              children: getDisplayValue(collection, value)
+              children: jsxs(Box, {
+                display: "flex",
+                children: [jsx(Box, {
+                  sx: {
+                    minWidth: 200
+                  },
+                  children: collection.name
+                }), jsx(Box, {
+                  sx: {
+                    textOverflow: 'ellipsis',
+                    overflow: 'hidden'
+                  },
+                  children: getDisplayValue(value)
+                })]
+              })
             }),
             children: [!hasInstances && jsx(MenuItem, {
               value: "",
@@ -694,9 +1243,9 @@ const SoundingsSourceMenu = ({
                 fontSize: 12
               },
               children: t('noInstancesAvailable')
-            }), collection.instances.map((instance, index) => jsx(MenuItem, {
+            }), collection.instances.map(instance => jsx(MenuItem, {
               value: instance.id,
-              children: index === 0 ? t('latest') : dateUtils.dateToIsoString(dateUtils.isoStringToDate(instance.id)) || instance.id
+              children: getDisplayValue(instance.id)
             }, instance.id))]
           })]
         }, collection.id);
@@ -736,15 +1285,131 @@ const getCollectionLocations = collectionId => fetch(`${BASE_URL}/collections/${
 const getCollectionInstance = (baseURL, collectionId) => fetch(`${baseURL}/collections/${collectionId}/instances`, {
   headers: getHeaders()
 }).then(handleResponse);
+const getEdrCollectionForLocation = (collectionId, instanceId, locationId, parameters, datetime) => {
+  const url = new URL(`${BASE_URL}/collections/${collectionId}${instanceId ? `/instances/${instanceId}` : ''}/locations/${locationId}`);
+  url.searchParams.append('parameter-name', parameters.join(','));
+  url.searchParams.append('datetime', datetime);
+  url.searchParams.append('f', 'CoverageJSON');
+  return fetch(url.toString(), {
+    headers: getHeaders()
+  }).then(handleResponse);
+};
+const getEdrCollectionForPosition = (collectionId, instanceId, coordinates, parameters, datetime) => {
+  const url = new URL(`${BASE_URL}/collections/${collectionId}${instanceId ? `/instances/${instanceId}` : ''}/position`);
+  url.searchParams.append('coords', `POINT(${coordinates[0]} ${coordinates[1]})`);
+  url.searchParams.append('parameter-name', parameters.join(','));
+  url.searchParams.append('datetime', datetime);
+  url.searchParams.append('f', 'CoverageJSON');
+  return fetch(url.toString(), {
+    headers: getHeaders()
+  }).then(handleResponse);
+};
+/* *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Copyright 2025 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2025 - Finnish Meteorological Institute (FMI)
+ * Copyright 2025 - The Norwegian Meteorological Institute (MET Norway)
+ * */
+const initialSoundingsState = {
+  selectedSources: {},
+  selectedLocations: {}
+};
+const slice = createSlice({
+  initialState: initialSoundingsState,
+  name: 'soundings',
+  reducers: {
+    updateSelectedSource: (draft, payloadAction) => {
+      const {
+        sourceId,
+        value
+      } = payloadAction.payload;
+      draft.selectedSources[sourceId] = {
+        ...draft.selectedSources[sourceId],
+        ...value
+      };
+    },
+    updateSelectedLocation: (draft, payloadAction) => {
+      const {
+        sourceId,
+        locationId
+      } = payloadAction.payload;
+      draft.selectedLocations[sourceId] = locationId;
+    }
+  }
+});
+const {
+  reducer: soundingsReducer,
+  actions: soundingsActions
+} = slice;
+/* *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Copyright 2025 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2025 - Finnish Meteorological Institute (FMI)
+ * Copyright 2025 - The Norwegian Meteorological Institute (MET Norway)
+ * */
+const getSoundingsStore = store => store?.soundings || initialSoundingsState;
+const getSourceSelections = createSelector(getSoundingsStore, store => {
+  return store.selectedSources;
+}, selectorMemoizationOptions);
+const getLocationSelections = createSelector(getSoundingsStore, store => store.selectedLocations, selectorMemoizationOptions);
+const getSelectedSources = createSelector(getSoundingsStore, store => {
+  const sources = store.selectedSources;
+  const activeSources = Object.keys(sources).reduce((list, key) => {
+    const value = sources[key];
+    if (value.isChecked === true) {
+      return list.concat({
+        collectionId: key,
+        instanceId: value.instanceId
+      });
+    }
+    return list;
+  }, []);
+  return activeSources;
+}, selectorMemoizationOptions);
+const getSelectedSourcesAmount = createSelector(getSelectedSources, activeSources => {
+  return activeSources.length;
+}, selectorMemoizationOptions);
 const SoundingsSourceDialogConnect = ({
   soundingsCollections
 }) => {
   const [soundingsCollectionsWithInstances, setSoundingsCollectionsWithInstances] = React.useState();
+  const dispatch = useDispatch();
   const {
     isDialogOpen,
     onCloseDialog
   } = useSetupDialog(uiTypes.DialogTypes.SoundingsSources);
+  const updateCollection = React.useCallback((sourceId, value) => {
+    dispatch(soundingsActions.updateSelectedSource({
+      sourceId,
+      value
+    }));
+  }, [dispatch]);
+  const sourceSelections = useSelector(getSourceSelections);
   React.useEffect(() => {
     if (soundingsCollections && isDialogOpen) {
       try {
@@ -763,36 +1428,45 @@ const SoundingsSourceDialogConnect = ({
   return jsx(SoundingsSourceMenu, {
     soundingsCollections: soundingsCollectionsWithInstances,
     isOpen: isDialogOpen,
+    updateCollection: (sourceId, value) => updateCollection(sourceId, value),
+    sourceSelections: sourceSelections,
     handleClose: () => onCloseDialog()
   });
 };
 const LocationsMenu = ({
   services,
+  selectedLocations,
   isOpen,
-  onClose
+  onClose,
+  updateSelectedLocation
 }) => {
   const [collapseMap, setCollapseMap] = useState({});
   const {
     t
   } = useSoundingsTranslation();
+  const isChecked = (sourceId, locationId) => selectedLocations[sourceId] === locationId;
   return jsx(ToolContainerDraggable, {
     startSize: {
       width: 320,
       height: 500
     },
     title: t('locations'),
-    headerSize: "medium",
     isOpen: isOpen,
     onClose: () => onClose(),
     bounds: "parent",
-    children: jsx(List, {
+    children: jsxs(List, {
       disablePadding: true,
       sx: {
         maxHeight: '100%',
         overflowY: 'auto'
       },
-      children: services.map(service => jsxs(Fragment$1, {
+      children: [services.length === 0 && jsx(Typography, {
+        sx: {
+          marginLeft: 1
+        },
+        children: t('locations-menu-warning')
+      }), services.map(service => jsxs(Fragment, {
         children: [jsx(ListSubheader, {
           disableGutters: true,
           sx: {
@@ -819,14 +1493,32 @@ const LocationsMenu = ({
               overflow: 'hidden'
             },
             children: service.features?.map(location => jsx(ListItem, {
-              sx: {
-                pl: 4
-              },
-              children: location.properties.name
+              disablePadding: true,
+              disableGutters: true,
+              children: jsxs(ListItemButton, {
+                onClick: () => {
+                  updateSelectedLocation(service.id, isChecked(service.id, location.id) ? undefined : location.id);
+                },
+                dense: true,
+                children: [jsx(ListItemIcon, {
+                  children: jsx(Checkbox, {
+                    edge: "start",
+                    checked: isChecked(service.id, location.id),
+                    tabIndex: -1,
+                    disableRipple: true,
+                    inputProps: {
+                      'aria-labelledby': location.id
+                    }
+                  })
+                }), jsx(ListItemText, {
+                  id: location.id,
+                  primary: location.properties.name
+                })]
+              })
             }, `${service.id}-${location.id}`))
           })
         })]
-      }, service.id))
+      }, service.id))]
     })
   });
 };
@@ -834,10 +1526,14 @@ const LocationsMenu = ({
 const LocationsMenuConnect = ({
   soundingsCollections
 }) => {
+  const dispatch = useDispatch();
   const {
     isDialogOpen,
     onCloseDialog
   } = useSetupDialog(uiTypes.DialogTypes.soundingsLocations);
+  const locationSelections = useSelector(getLocationSelections);
+  const sourceSelections = useSelector(getSourceSelections);
+  const selectedSourceIds = useMemo(() => Object.keys(sourceSelections).filter(key => sourceSelections[key].isChecked), [sourceSelections]);
   const edrQueries = useMemo(() => soundingsCollections.map(collection => ({
     queryKey: ['edr-locations', collection.id],
     queryFn: async () => {
@@ -855,206 +1551,57 @@ const LocationsMenuConnect = ({
   return jsx(LocationsMenu, {
     isOpen: isDialogOpen,
     onClose: onCloseDialog,
-    services: services
+    services: services.filter(service => selectedSourceIds.includes(service.id)),
+    selectedLocations: locationSelections,
+    updateSelectedLocation: (sourceId, locationId) => void dispatch(soundingsActions.updateSelectedLocation({
+      sourceId,
+      locationId
+    }))
   });
 };
-var SoundingFeatures = [
-	{
-		type: "Feature",
-		geometry: {
-			type: "Point",
-			coordinates: [
-				24.9727,
-				60.3294
-			]
-		},
-		properties: {
-			time: "2025-02-05T00:00:00Z",
-			temp: -4.74961,
-			dewpoint: -5.646749999999998,
-			pressure: 1000,
-			windSpeed: 9.291457267156751,
-			windDirection: -18.803465916723095
-		}
-	},
-	{
-		type: "Feature",
-		geometry: {
-			type: "Point",
-			coordinates: [
-				24.9727,
-				60.3294
-			]
-		},
-		properties: {
-			time: "2025-02-05T00:00:00Z",
-			temp: -5.72214,
-			dewpoint: -5.740760000000001,
-			pressure: 925,
-			windSpeed: 11.482972536081412,
-			windDirection: 18.797638010822038
-		}
-	},
-	{
-		type: "Feature",
-		geometry: {
-			type: "Point",
-			coordinates: [
-				24.9727,
-				60.3294
-			]
-		},
-		properties: {
-			time: "2025-02-05T00:00:00Z",
-			temp: -5.94461,
-			dewpoint: -6.284489999999999,
-			pressure: 850,
-			windSpeed: 10.355155067433804,
-			windDirection: 46.95919904362452
-		}
-	},
-	{
-		type: "Feature",
-		geometry: {
-			type: "Point",
-			coordinates: [
-				24.9727,
-				60.3294
-			]
-		},
-		properties: {
-			time: "2025-02-05T00:00:00Z",
-			temp: -7.85121,
-			dewpoint: -7.903229999999999,
-			pressure: 700,
-			windSpeed: 10.216260991987234,
-			windDirection: 125.33681135255785
-		}
-	},
-	{
-		type: "Feature",
-		geometry: {
-			type: "Point",
-			coordinates: [
-				24.9727,
-				60.3294
-			]
-		},
-		properties: {
-			time: "2025-02-05T00:00:00Z",
-			temp: -20.9667,
-			dewpoint: -22.12218,
-			pressure: 500,
-			windSpeed: 14.222681508365433,
-			windDirection: 120.16238041101973
-		}
-	},
-	{
-		type: "Feature",
-		geometry: {
-			type: "Point",
-			coordinates: [
-				24.9727,
-				60.3294
-			]
-		},
-		properties: {
-			time: "2025-02-05T00:00:00Z",
-			temp: -48.8678,
-			dewpoint: -60.802800000000005,
-			pressure: 300,
-			windSpeed: 23.436991331013456,
-			windDirection: 128.0547684118523
-		}
-	},
-	{
-		type: "Feature",
-		geometry: {
-			type: "Point",
-			coordinates: [
-				24.9727,
-				60.3294
-			]
-		},
-		properties: {
-			time: "2025-02-05T00:00:00Z",
-			temp: -58.3,
-			dewpoint: -69.68567999999999,
-			pressure: 250,
-			windSpeed: 28.155356371568097,
-			windDirection: 133.50317473958455
-		}
-	},
-	{
-		type: "Feature",
-		geometry: {
-			type: "Point",
-			coordinates: [
-				24.9727,
-				60.3294
-			]
-		},
-		properties: {
-			time: "2025-02-05T00:00:00Z",
-			temp: -68.6166,
-			dewpoint: -71.9641,
-			pressure: 200,
-			windSpeed: 24.833678713593763,
-			windDirection: 137.492458365928
-		}
-	},
-	{
-		type: "Feature",
-		geometry: {
-			type: "Point",
-			coordinates: [
-				24.9727,
-				60.3294
-			]
-		},
-		properties: {
-			time: "2025-02-05T00:00:00Z",
-			temp: -69.4935,
-			dewpoint: -87.827772,
-			pressure: 50,
-			windSpeed: 35.1450619746217,
-			windDirection: 129.8915278264372
-		}
-	}
-];
 var MenuOptions;
 (function (MenuOptions) {
   MenuOptions["sources"] = "sources";
   MenuOptions["locations"] = "locations";
 })(MenuOptions || (MenuOptions = {}));
+const buttonStyle = {
+  height: '10px !important',
+  width: '130px'
+};
 const SoundingsMenuBar = ({
   handleClick,
-  isOpen
+  isOpen,
+  selectedSourcesAmount = 0
 }) => {
   const {
     t
   } = useSoundingsTranslation();
-  return jsxs(Box, {
-    display: "flex",
-    gap: 1,
-    children: [jsx(Button, {
-      variant: isOpen[MenuOptions.sources] ? 'primary' : 'tertiary',
-      disableRipple: true,
-      "aria-pressed": isOpen[MenuOptions.sources],
+  return jsxs(Stack, {
+    direction: "row",
+    spacing: 1,
+    sx: {
+      marginBottom: '4px'
+    },
+    children: [jsxs(CustomToggleButton, {
+      variant: "tool",
+      selected: isOpen[MenuOptions.sources],
       "data-testid": "soundingsSourcesButton",
       onClick: () => handleClick(MenuOptions.sources),
-      startIcon: jsx(Sources, {}),
       size: "small",
-      children: t('sources')
-    }), jsx(Button, {
-      variant: isOpen[MenuOptions.locations] ? 'primary' : 'tertiary',
-      disableRipple: true,
+      sx: buttonStyle,
+      children: [jsx(Sources, {
+        sx: {
+          marginRight: '4px!important'
+        }
+      }), selectedSourcesAmount ? `${t('sources')} (${selectedSourcesAmount})` : t('sources')]
+    }), jsx(CustomToggleButton, {
+      variant: "tool",
       "data-testid": "soundingsLocationsButton",
-      "aria-pressed": isOpen[MenuOptions.locations],
+      selected: isOpen[MenuOptions.locations],
       onClick: () => handleClick(MenuOptions.locations),
       size: "small",
+      sx: buttonStyle,
       children: t('locations')
     })]
   });
@@ -1068,6 +1615,7 @@ const MenuBarConnect = ({
   const currentActiveMapId = useSelector(store => uiSelectors.getDialogMapId(store, uiTypes.DialogTypes.SoundingsSources));
   const isSourcesOpenInStore = useSelector(store => uiSelectors.getisDialogOpen(store, uiTypes.DialogTypes.SoundingsSources));
   const isLocationsOpenInStore = useSelector(store => uiSelectors.getisDialogOpen(store, uiTypes.DialogTypes.soundingsLocations));
+  const sourcesAmount = useSelector(getSelectedSourcesAmount);
   const dispatchActiveMapId = React.useCallback((dialogType, isOpen) => void dispatch(uiActions.setActiveMapIdForDialog({
     type: dialogType,
     mapId: viewId,
@@ -1090,39 +1638,276 @@ const MenuBarConnect = ({
   };
   return jsx(SoundingsMenuBar, {
     isOpen: isOpen,
-    handleClick: handleClick
+    handleClick: handleClick,
+    selectedSourcesAmount: sourcesAmount
   });
 };
+/* *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Copyright 2025 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2025 - Finnish Meteorological Institute (FMI)
+ * Copyright 2025 - The Norwegian Meteorological Institute (MET Norway)
+ * */
+const epsilon = 0.622; // Ratio of molecular weights of water vapour and dry air
+const e0 = 611.2; // Reference vapor pressure [Pa]
+const aConstant = 17.67;
+const bConstant = 243.5; // Constants for water, b in Celsius
+const tKelvinOffset = 273.15; // To convert Celsius to Kelvin
+const gConstant = 461.5; // Gas constant ratio between water vapour and air [J/(K*kg)]
+const hConstant = 2.5e6; // Latent heat for water vaporization [J/kg]
+// Formula to use when dewpoint is not available
+// Known as Magnus Formula
+// - Calculate vapor pressure
+// - Use inverse of the Clausius-Clapeyron equation
+function dewpointFromSpecificHumidity(specificHumidity,
+// specific humidity [kg/kg]
+pressure) {
+  // Step 1: Calculate vapor pressure (Pa)
+  const vaporPressure = specificHumidity * pressure / (epsilon + (1 - epsilon) * specificHumidity);
+  // Step 2: Calculate dew point in Celsius
+  const lnRatio = Math.log(vaporPressure / e0);
+  const dewpoint = bConstant * lnRatio / (aConstant - lnRatio);
+  return dewpoint; // dew point in Celsius
+}
+// Formula to use when dewpoint is not available
+function dewpointFromRelativeHumidity(tCelsius,
+// air temperature [°C]
+relHumidity) {
+  // Convert to Kelvin
+  const tKelvin = tCelsius + tKelvinOffset;
+  // Calculate dewpoint
+  const dewpoint = tKelvin / (1 - tKelvin * Math.log(relHumidity * 0.01) * gConstant / hConstant);
+  return dewpoint;
+}
+/* *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Copyright 2025 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2025 - Finnish Meteorological Institute (FMI)
+ * Copyright 2025 - The Norwegian Meteorological Institute (MET Norway)
+ * */
+// Parsing and conversion function
+function parseCoverageCollection(response) {
+  const features = [];
+  const {
+    t: tAxis,
+    x: xAxis,
+    y: yAxis,
+    z: zAxis
+  } = response.coverages[0]?.domain.axes || {};
+  if (!tAxis?.values || !xAxis?.values || !yAxis?.values || !zAxis?.values) {
+    return features;
+  }
+  response.coverages.forEach(coverage => {
+    const {
+      ranges
+    } = coverage;
+    const time = coverage.domain.axes.t?.values[0];
+    const xCoord = coverage.domain.axes.x.values[0];
+    const yCoord = coverage.domain.axes.y.values[0];
+    const zValues = coverage.domain.axes.z.values;
+    zValues.forEach((_, zIndex) => {
+      const temp = parseFloat(ranges.temperature?.values[zIndex]);
+      const windums = parseFloat(ranges.windums?.values[zIndex]);
+      const windvms = parseFloat(ranges.windvms?.values[zIndex]);
+      let dewpoint = parseFloat(ranges.dewpoint?.values[zIndex]);
+      const relativeHumidity = parseFloat(ranges.relativehumidity?.values[zIndex]);
+      const specificHumidity = parseFloat(ranges.specifichumidity?.values[zIndex]);
+      let windSpeed = parseFloat(ranges.windSpeed?.values[zIndex]);
+      // Fallback calculations
+      if (Number.isNaN(windSpeed) && !Number.isNaN(windums) && !Number.isNaN(windvms)) {
+        // Fallback calculation
+        windSpeed = Math.sqrt(windums ** 2 + windvms ** 2);
+      }
+      let windDirection = parseFloat(ranges.windDirection?.values[zIndex]);
+      if (Number.isNaN(windDirection) && !Number.isNaN(windums) && !Number.isNaN(windvms)) {
+        // Fallback calculation
+        windDirection = (Math.atan2(-windums, -windvms) * (180 / Math.PI) + 360) % 360;
+      }
+      const pressureFromRange = parseFloat(ranges.pressure?.values[zIndex]);
+      const pressure = !Number.isNaN(pressureFromRange) ? pressureFromRange : parseFloat(zValues[zIndex]);
+      if (dewpoint === null || Number.isNaN(dewpoint)) {
+        // Use dewpoint fallback calculations if not present
+        if (!Number.isNaN(specificHumidity)) {
+          dewpoint = dewpointFromSpecificHumidity(specificHumidity / 1000,
+          // from g/kg to kg/kg
+          pressure * 100);
+        } else if (!Number.isNaN(relativeHumidity)) {
+          dewpoint = dewpointFromRelativeHumidity(temp, relativeHumidity);
+        }
+      }
+      features.push({
+        type: 'Feature',
+        geometry: {
+          type: 'Point',
+          coordinates: [xCoord, yCoord]
+        },
+        properties: {
+          time,
+          temp,
+          dewpoint,
+          pressure,
+          windSpeed,
+          windDirection
+        }
+      });
+    });
+  });
+  return features;
+}
+/* *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Copyright 2025 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2025 - Finnish Meteorological Institute (FMI)
+ * Copyright 2025 - The Norwegian Meteorological Institute (MET Norway)
+ * */
+const sortSoundingFeatures = data => {
+  return data.sort((featureA, featureB) => {
+    // Sort by date (ascending)
+    if (featureA.properties.time !== featureB.properties.time) {
+      return featureA.properties.time > featureB.properties.time ? 1 : -1;
+    }
+    // Sort by pressure (descending)
+    return featureB.properties.pressure - featureA.properties.pressure;
+  });
+};
+const constructQueryParams = (collectionId, instanceId, location, datetime, parameters) => {
+  if (typeof location === 'string') {
+    // LOCATION call
+    return {
+      queryKey: ['edr-soundings-for-location', collectionId, instanceId || '', location, parameters.join(), datetime],
+      queryFn: async () => {
+        // No collection or location selected, don't do EDR call but return empty array
+        if (collectionId === undefined || location === '') {
+          return [];
+        }
+        try {
+          const rawData = await getEdrCollectionForLocation(collectionId, instanceId, location, parameters, datetime);
+          const parsedData = parseCoverageCollection(rawData);
+          return sortSoundingFeatures(parsedData);
+        } catch (err) {
+          throw new Error('Error fetching EDR data collection by location');
+        }
+      }
+    };
+  }
+  // POSITION call
+  return {
+    queryKey: ['edr-soundings-for-position', collectionId, location.join(), parameters.join(), datetime],
+    queryFn: async () => {
+      // No collection or position selected, don't do EDR call but return empty array
+      if (collectionId === undefined || location === undefined) {
+        return [];
+      }
+      try {
+        const rawData = await getEdrCollectionForPosition(collectionId, instanceId, location, parameters, datetime);
+        const parsedData = parseCoverageCollection(rawData);
+        return sortSoundingFeatures(parsedData);
+      } catch (err) {
+        throw new Error('Error fetching EDR data collection by location');
+      }
+    }
+  };
+};
+const useEdrCollectionForLocationPosition = (collectionId, instanceId, location, datetime, parameters = ['temperature', 'WindDirection', 'WindSpeedMS', 'windUMS', 'windVMS', 'Pressure', 'DewPoint', 'humidity', 'specifichumidity']) => {
+  // TODO: Remove once we pass in the datetime coming from the timeslider!
+  const {
+    data
+  } = useQuery({
+    queryKey: ['temporary-instance-call', collectionId, instanceId],
+    queryFn: async () => {
+      return fetch(`https://opendata.fmi.fi/edr/collections/${collectionId}/instances/${instanceId}`, {
+        headers: getHeaders()
+      }).then(handleResponse);
+    }
+  });
+  const datetime2 = collectionId === undefined || data === undefined ? '' : data.extent.temporal.interval[0][0];
+  // Up until here can be removed
+  // If position passed in, call positions hook
+  const queryParams = constructQueryParams(collectionId, instanceId, location, datetime2, parameters);
+  return useQuery(queryParams);
+};
 const SoundingsConnect = ({
   viewId
 }) => {
-  return jsxs(Box, {
-    sx: {
-      padding: 2
-    },
-    children: [jsx(Box, {
-      paddingLeft: 5,
-      children: jsx(MenuBarConnect, {
-        viewId: viewId
-      })
-    }), jsx(Soundings
-    // TODO: use real data
-    , {
-      // TODO: use real data
-      data: {
-        features: SoundingFeatures
+  const sourceSelections = useSelector(getSelectedSources);
+  const locationSelections = useSelector(getLocationSelections);
+  // TODO https://gitlab.com/opengeoweb/opengeoweb/-/issues/5916: Allow multiple sources to be selected
+  // For now, only select the first one
+  const {
+    error,
+    data: soundingData,
+    isPending
+  } = useEdrCollectionForLocationPosition(sourceSelections[0]?.collectionId, sourceSelections[0]?.instanceId, locationSelections[sourceSelections[0]?.collectionId] || '');
+  return jsxs(Fragment$1, {
+    children: [error && jsx(AlertBanner, {
+      title: error.message,
+      shouldClose: true
+    }), isPending && jsx(LinearProgress, {
+      color: "secondary"
+    }), jsxs(Box, {
+      sx: {
+        padding: 2
       },
-      svgDimensions: {
-        width: 600,
-        height: 600,
-        margin: {
-          bottom: 0,
-          left: 0,
-          right: 0,
-          top: 0
+      children: [jsx(Box, {
+        paddingLeft: 5,
+        children: jsx(MenuBarConnect, {
+          viewId: viewId
+        })
+      }), jsx(Soundings
+      // TODO: use real data
+      , {
+        // TODO: use real data
+        data: {
+          features: soundingData || []
+        },
+        svgDimensions: {
+          width: 600,
+          height: 600,
+          margin: {
+            bottom: 0,
+            left: 0,
+            right: 0,
+            top: 0
+          }
         }
-      }
+      })]
     })]
   });
 };
@@ -1137,4 +1922,33 @@ const soundingsLookUp = payload => {
   return null;
 };
-export { LocationsMenuConnect, Soundings, SoundingsSourceDialogConnect, soundingsComponentType, soundingsLookUp };
+/* *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Copyright 2025 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2025 - Finnish Meteorological Institute (FMI)
+ * Copyright 2025 - The Norwegian Meteorological Institute (MET Norway)
+ * */
+const soundingsReducersMap = {
+  soundings: soundingsReducer,
+  webmap: mapReducer,
+  ui: uiReducer
+};
+const soundingsRootReuducer = combineReducers(soundingsReducersMap);
+const createMockStore = mockState => configureStore({
+  reducer: soundingsRootReuducer,
+  preloadedState: mockState,
+  middleware: getDefaultMiddleware => getDefaultMiddleware()
+});
+export { LocationsMenuConnect, SOUNDINGS_NAMESPACE, Soundings, SoundingsSourceDialogConnect, createMockStore, initSoundingsI18n, soundingsComponentType, soundingsLookUp, soundingsReducersMap, soundingsTranslations, translateKeyOutsideComponents, useSoundingsTranslation };