Add fetching of NOAA 3-day forecast

This commit is contained in:
Ian Renton
2026-04-03 18:11:45 +01:00
parent 4a6d9da031
commit c10b5e4947
11 changed files with 96 additions and 70 deletions

View File

@@ -4,7 +4,7 @@ from datetime import datetime, timezone
from solarconditionsproviders.http_solar_conditions_provider import HTTPSolarConditionsProvider from solarconditionsproviders.http_solar_conditions_provider import HTTPSolarConditionsProvider
POLL_INTERVAL = 3600 POLL_INTERVAL = 10800 # Every 3 hours
URL = "https://services.swpc.noaa.gov/text/3-day-forecast.txt" URL = "https://services.swpc.noaa.gov/text/3-day-forecast.txt"
@@ -132,17 +132,16 @@ class NOAA3dayForecast(HTTPSolarConditionsProvider):
continue continue
start_hour = int(time_match.group(1)) start_hour = int(time_match.group(1))
raw_values = time_match.group(3).split() # Split on 2 or more spaces so that e.g. "5.67 (G2)" stays as one token per column
raw_values = re.split(r' {2,}', time_match.group(3).strip())
for i, val in enumerate(raw_values): for i, val in enumerate(raw_values):
if i >= len(column_dates): if i >= len(column_dates):
break break
# Discard bracketed values # Take only the leading numeric part, discarding any bracketed section
if val.startswith('(') and val.endswith(')'):
continue
try: try:
kp = float(val) kp = float(val.split()[0])
except ValueError: except (ValueError, IndexError):
continue continue
date = column_dates[i] date = column_dates[i]

View File

@@ -67,7 +67,7 @@
<p>This software is dedicated to the memory of Tom G1PJB, SK, a friend and colleague who sadly passed away around the time I started writing it in Autumn 2025. I was looking forward to showing it to you when it was done.</p> <p>This software is dedicated to the memory of Tom G1PJB, SK, a friend and colleague who sadly passed away around the time I started writing it in Autumn 2025. I was looking forward to showing it to you when it was done.</p>
</div> </div>
<script src="/js/common.js?v=1775234400"></script> <script src="/js/common.js?v=1775236305"></script>
<script>$(document).ready(function() { $("#nav-link-about").addClass("active"); }); <!-- highlight active page in nav --></script> <script>$(document).ready(function() { $("#nav-link-about").addClass("active"); }); <!-- highlight active page in nav --></script>
{% end %} {% end %}

View File

@@ -69,8 +69,8 @@
</div> </div>
<script src="/js/common.js?v=1775234400"></script> <script src="/js/common.js?v=1775236305"></script>
<script src="/js/add-spot.js?v=1775234400"></script> <script src="/js/add-spot.js?v=1775236305"></script>
<script>$(document).ready(function() { $("#nav-link-add-spot").addClass("active"); }); <!-- highlight active page in nav --></script> <script>$(document).ready(function() { $("#nav-link-add-spot").addClass("active"); }); <!-- highlight active page in nav --></script>
{% end %} {% end %}

View File

@@ -56,8 +56,8 @@
</div> </div>
<script src="/js/common.js?v=1775234400"></script> <script src="/js/common.js?v=1775236305"></script>
<script src="/js/alerts.js?v=1775234400"></script> <script src="/js/alerts.js?v=1775236305"></script>
<script>$(document).ready(function() { $("#nav-link-alerts").addClass("active"); }); <!-- highlight active page in nav --></script> <script>$(document).ready(function() { $("#nav-link-alerts").addClass("active"); }); <!-- highlight active page in nav --></script>
{% end %} {% end %}

View File

@@ -62,9 +62,9 @@
<script> <script>
let spotProvidersEnabledByDefault = {% raw json_encode(web_ui_options["spot-providers-enabled-by-default"]) %}; let spotProvidersEnabledByDefault = {% raw json_encode(web_ui_options["spot-providers-enabled-by-default"]) %};
</script> </script>
<script src="/js/common.js?v=1775234400"></script> <script src="/js/common.js?v=1775236305"></script>
<script src="/js/spotsbandsandmap.js?v=1775234400"></script> <script src="/js/spotsbandsandmap.js?v=1775236305"></script>
<script src="/js/bands.js?v=1775234400"></script> <script src="/js/bands.js?v=1775236305"></script>
<script>$(document).ready(function() { $("#nav-link-bands").addClass("active"); }); <!-- highlight active page in nav --></script> <script>$(document).ready(function() { $("#nav-link-bands").addClass("active"); }); <!-- highlight active page in nav --></script>
{% end %} {% end %}

View File

@@ -45,11 +45,12 @@
integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI" integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI"
crossorigin="anonymous"></script> crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/tinycolor2@1.6.0/cjs/tinycolor.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/tinycolor2@1.6.0/cjs/tinycolor.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.9/dist/chart.umd.min.js"></script>
<script src="https://misc.ianrenton.com/jsutils/utils.js?v=1775234400"></script> <script src="https://misc.ianrenton.com/jsutils/utils.js?v=1775236305"></script>
<script src="https://misc.ianrenton.com/jsutils/storage.js?v=1775234400"></script> <script src="https://misc.ianrenton.com/jsutils/storage.js?v=1775236305"></script>
<script src="https://misc.ianrenton.com/jsutils/ui-ham.js?v=1775234400"></script> <script src="https://misc.ianrenton.com/jsutils/ui-ham.js?v=1775236305"></script>
<script src="https://misc.ianrenton.com/jsutils/geo.js?v=1775234400"></script> <script src="https://misc.ianrenton.com/jsutils/geo.js?v=1775236305"></script>
</head> </head>
<body> <body>

View File

@@ -136,16 +136,9 @@
</div> </div>
<div class="card-body"> <div class="card-body">
<div class="row mb-4"> <div class="row mb-4">
<div class="col mt-3 px-3"> <div class="col px-3">
<h5>K-index Forecast</h5> <h5>K-index Forecast</h5>
<div class="table-responsive"> <canvas id="forecast-kp-chart" class="mt-3 mb-3"></canvas>
<table id="forecast-kp-table" class="table table-sm mt-2">
<thead>
<tr></tr>
</thead>
<tbody></tbody>
</table>
</div>
</div> </div>
</div> </div>
<div class="row row-cols-1 row-cols-md-2 g-3"> <div class="row row-cols-1 row-cols-md-2 g-3">
@@ -230,8 +223,8 @@
</div> </div>
</div> </div>
<script src="/js/common.js?v=1775234400"></script> <script src="/js/common.js?v=1775236305"></script>
<script src="/js/conditions.js?v=1775234400"></script> <script src="/js/conditions.js?v=1775236305"></script>
<script>$(document).ready(function () { <script>$(document).ready(function () {
$("#nav-link-conditions").addClass("active"); $("#nav-link-conditions").addClass("active");
}); <!-- highlight active page in nav --></script> }); <!-- highlight active page in nav --></script>

View File

@@ -70,9 +70,9 @@
<script> <script>
let spotProvidersEnabledByDefault = {% raw json_encode(web_ui_options["spot-providers-enabled-by-default"]) %}; let spotProvidersEnabledByDefault = {% raw json_encode(web_ui_options["spot-providers-enabled-by-default"]) %};
</script> </script>
<script src="/js/common.js?v=1775234400"></script> <script src="/js/common.js?v=1775236305"></script>
<script src="/js/spotsbandsandmap.js?v=1775234400"></script> <script src="/js/spotsbandsandmap.js?v=1775236305"></script>
<script src="/js/map.js?v=1775234400"></script> <script src="/js/map.js?v=1775236305"></script>
<script>$(document).ready(function() { $("#nav-link-map").addClass("active"); }); <!-- highlight active page in nav --></script> <script>$(document).ready(function() { $("#nav-link-map").addClass("active"); }); <!-- highlight active page in nav --></script>
{% end %} {% end %}

View File

@@ -87,9 +87,9 @@
<script> <script>
let spotProvidersEnabledByDefault = {% raw json_encode(web_ui_options["spot-providers-enabled-by-default"]) %}; let spotProvidersEnabledByDefault = {% raw json_encode(web_ui_options["spot-providers-enabled-by-default"]) %};
</script> </script>
<script src="/js/common.js?v=1775234400"></script> <script src="/js/common.js?v=1775236305"></script>
<script src="/js/spotsbandsandmap.js?v=1775234400"></script> <script src="/js/spotsbandsandmap.js?v=1775236305"></script>
<script src="/js/spots.js?v=1775234400"></script> <script src="/js/spots.js?v=1775236305"></script>
<script>$(document).ready(function() { $("#nav-link-spots").addClass("active"); }); <!-- highlight active page in nav --></script> <script>$(document).ready(function() { $("#nav-link-spots").addClass("active"); }); <!-- highlight active page in nav --></script>
{% end %} {% end %}

View File

@@ -59,8 +59,8 @@
</div> </div>
</div> </div>
<script src="/js/common.js?v=1775234400"></script> <script src="/js/common.js?v=1775236305"></script>
<script src="/js/status.js?v=1775234400"></script> <script src="/js/status.js?v=1775236305"></script>
<script> <script>
$(document).ready(function() { $("#nav-link-status").addClass("active"); }); <!-- highlight active page in nav --> $(document).ready(function() { $("#nav-link-status").addClass("active"); }); <!-- highlight active page in nav -->
</script> </script>

View File

@@ -1,6 +1,8 @@
// Cache for the full dxstats API response, so we can reload on the fly if the user changes the value of their continent // Cache for the full dxstats API response, so we can reload on the fly if the user changes the value of their continent
// in the select box // in the select box
let dxStatsData = null; let dxStatsData = null;
// Forecast chart
let kpChart = null;
// Load solar conditions // Load solar conditions
function loadSolarConditions() { function loadSolarConditions() {
@@ -114,7 +116,7 @@ function loadSolarConditions() {
}); });
} }
// Render the K-index forecast table (rows = 3-hour UTC time slots, columns = forecast dates) // Render the K-index forecast as a Chart.js bar chart, one bar per 3-hour UTC period
function renderKIndexForecast(data) { function renderKIndexForecast(data) {
if (!data) return; if (!data) return;
@@ -123,40 +125,71 @@ function renderKIndexForecast(data) {
.sort((a, b) => a.ts - b.ts); .sort((a, b) => a.ts - b.ts);
if (entries.length === 0) return; if (entries.length === 0) return;
// Derive the unique UTC dates from sorted entries // x-axis labels. Show date only on the first bar of each day, time on all bars
const dateSet = new Set(); const labels = entries.map((e, i) => {
entries.forEach(e => dateSet.add(new Date(e.ts * 1000).toISOString().slice(0, 10))); const dt = new Date(e.ts * 1000);
const dates = [...dateSet]; const timeStr = String(dt.getUTCHours()).padStart(2, '0') + ':00';
const dateStr = dt.toLocaleDateString('en-GB', { day: '2-digit', month: 'short', timeZone: 'UTC' });
const kpByTs = {}; const prev = i > 0 ? new Date(entries[i - 1].ts * 1000) : null;
entries.forEach(e => { kpByTs[e.ts] = e.kp; }); const newDay = !prev || prev.toISOString().slice(0, 10) !== dt.toISOString().slice(0, 10);
return newDay ? [timeStr, dateStr] : timeStr;
// Header row
const headRow = $('#forecast-kp-table thead tr').empty().append('<th>Time (UTC)</th>');
dates.forEach(dateStr => {
const label = new Date(dateStr + 'T00:00:00Z')
.toLocaleDateString('en-GB', { day: '2-digit', month: 'short', timeZone: 'UTC' });
headRow.append(`<th>${label}</th>`);
}); });
// Data rows: one per 3-hour slot // Inherit colours from Bootstrap CSS variables so that dark mode inherently works. We want bar colours that are not
const tbody = $('#forecast-kp-table tbody').empty(); // quite as saturated as the Bootstrap success/warning/danger colours but not as desaturated as the "subtle"
[0, 3, 6, 9, 12, 15, 18, 21].forEach(startHour => { // versions, so use tinycolor to apply some transparency.
const endHour = (startHour + 3) % 24; const style = getComputedStyle(document.documentElement);
const timeLabel = String(startHour).padStart(2, '0') + '-' + String(endHour).padStart(2, '0') + 'UT'; const withAlpha = hex => tinycolor(hex).setAlpha(0.8).toRgbString();
const tr = $('<tr>').append(`<td>${timeLabel}</td>`); const colors = entries.map(e =>
dates.forEach(dateStr => { e.kp < 4.5 ? withAlpha(style.getPropertyValue('--bs-success').trim())
const [y, m, d] = dateStr.split('-').map(Number); : e.kp < 6.5 ? withAlpha(style.getPropertyValue('--bs-warning').trim())
const slotTs = Date.UTC(y, m - 1, d, startHour, 0, 0) / 1000; : withAlpha(style.getPropertyValue('--bs-danger').trim())
const td = $('<td>'); );
const kp = kpByTs[slotTs]; const textColor = style.getPropertyValue('--bs-body-color').trim() || '#666';
if (kp !== undefined) { const gridColor = style.getPropertyValue('--bs-border-color').trim() || 'rgba(128,128,128,0.3)';
td.text(kp.toFixed(2));
td.addClass(kp < 5 ? 'bg-success-subtle' : kp < 7 ? 'bg-warning-subtle' : 'bg-danger-subtle'); if (kpChart) { kpChart.destroy(); }
kpChart = new Chart(document.getElementById('forecast-kp-chart'), {
type: 'bar',
data: {
labels,
datasets: [{
data: entries.map(e => e.kp),
backgroundColor: colors,
borderWidth: 0,
}]
},
options: {
responsive: true,
aspectRatio: 3,
plugins: {
legend: {
display: false
},
tooltip: {
enabled: false
}
},
scales: {
x: {
ticks: { color: textColor, maxRotation: 45, minRotation: 0 },
grid: { color: gridColor },
},
y: {
min: 0,
max: 9,
title: { display: true, text: 'Kp', color: textColor },
// Include geomagnetic storm levels (Gx) on the y-axis as well as the Kp index
ticks: {
stepSize: 1,
color: textColor,
callback: v => v > 4 ? `(G${v - 4}) ${v}` : String(v),
},
grid: { color: gridColor },
}
} }
tr.append(td); }
});
tbody.append(tr);
}); });
} }