graham/prop
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Show 'Best at X UTC' with peak score on forecast graph

Browse source
This commit is contained in:
Graham McIntire 2026-04-01 07:54:14 -05:00
parent d9b309ac6d
commit 376e855217
No known key found for this signature in database
GPG key ID: F4ABF488E6029E59
1 changed files with 8 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
assets/js/propagation_map_hook.js
View file

@ -151,6 +151,11 @@ function buildForecastSvg(forecast) {
else if (diff < -5) trend = `<span style="color:#ff4f4f;">&#9660; Declining</span>`
else trend = `<span style="color:#ffe566;">&#8594; Steady</span>`
// Best time
const bestPt = points.reduce((best, p) => p.score > best.score ? p : best, points[0])
const bestUtc = `${bestPt.time.getUTCHours().toString().padStart(2, "0")}:00 UTC`
const bestTier = scoreTier(bestPt.score)
// Y-axis: score labels
const yLabels = [0, 50, 100].map(s => {
const y = marginT + plotH * (1 - s / 100)
@ -177,7 +182,10 @@ function buildForecastSvg(forecast) {
${xLabels}
<polyline points="${polyline}" fill="none" stroke="#00ffa3" stroke-width="2" stroke-linejoin="round"/>
<circle cx="${nowPt.x}" cy="${nowPt.y}" r="3" fill="#fff" stroke="#00ffa3" stroke-width="1.5"/>
<circle cx="${bestPt.x}" cy="${bestPt.y}" r="3" fill="${bestTier.color}" stroke="#fff" stroke-width="1"/>
<text x="${bestPt.x}" y="${bestPt.y - 6}" font-size="8" fill="${bestTier.color}" text-anchor="middle" font-weight="700">${bestPt.score}</text>
</svg>
<div style="font-size:11px;margin-top:3px;color:${bestTier.color};">Best at ${bestUtc} &mdash; score ${bestPt.score} (${bestTier.label})</div>
</div>`
}