Simplify scoring view
Browse files- index.html +5 -6
index.html
CHANGED
|
@@ -21,12 +21,11 @@ tr.dw td{background:var(--dw);font-weight:600}tr.first td:first-child{color:var(
|
|
| 21 |
<label>Period<select id="period"><option value="day">Single day</option><option value="7">Last 7 days</option><option value="14" selected>Last 14 days</option></select></label>
|
| 22 |
<label>Verification date<select id="date"></select></label>
|
| 23 |
<label>City<select id="city"><option value="-1">All 24 cities</option></select></label>
|
| 24 |
-
<label>Scoring<select id="mode"><option value="raw">Model output as issued</option><option value="bc">With local bias correction</option></select></label>
|
| 25 |
</div>
|
| 26 |
<div id="status">Loading forecasts and observations…</div>
|
| 27 |
<div class="card"><h2 id="t1">Ranking</h2><table id="tbl"></table></div>
|
| 28 |
<div class="card"><h2>How it is scored</h2>
|
| 29 |
-
<p style="margin:0;color:var(--mut)">Each model's forecast issued N days earlier is compared with the ERA5 daily maximum for the same UTC day at each city. Lower RMSE ranks higher. ERA5 is published about five days after the fact, so the latest verification date trails today.
|
| 30 |
<footer>Weather data by <a href="https://open-meteo.com/">Open-Meteo.com</a> (CC BY 4.0). Verification: ERA5, Copernicus Climate Change Service. Model sources: ECMWF, NOAA NCEP, DWD, JMA, ECCC, MET Norway. Engine: <a href="https://huggingface.co/FINAL-Bench/Darwin-Prediction-Weather">Darwin-Prediction-Weather</a>.</footer>
|
| 31 |
</main><script>
|
| 32 |
const CITIES={"Seoul":[37.57,126.98],"Busan":[35.18,129.08],"Tokyo":[35.68,139.69],"Beijing":[39.90,116.40],"Singapore":[1.35,103.82],"Delhi":[28.61,77.21],"Dubai":[25.20,55.27],"Moscow":[55.76,37.62],"Berlin":[52.52,13.40],"London":[51.51,-0.13],"Paris":[48.86,2.35],"Madrid":[40.42,-3.70],"Cairo":[30.04,31.24],"Nairobi":[-1.29,36.82],"Johannesburg":[-26.20,28.05],"New York":[40.71,-74.01],"Chicago":[41.88,-87.63],"Los Angeles":[34.05,-118.24],"Mexico City":[19.43,-99.13],"Sao Paulo":[-23.55,-46.63],"Buenos Aires":[-34.60,-58.38],"Sydney":[-33.87,151.21],"Anchorage":[61.22,-149.90],"Reykjavik":[64.15,-21.94]};
|
|
@@ -59,12 +58,12 @@ function fit(li,D,t){const ms=MK.filter(m=>F[m]),w0=Math.max(0,t-30),t1=t-D;cons
|
|
| 59 |
mse[m]=n2?s2/n2:NaN}
|
| 60 |
return{ms,bias,mse}}
|
| 61 |
function render(){
|
| 62 |
-
const D=+$("lead").value,li=LEADS.indexOf(D),per=$("period").value,ci=+$("city").value
|
| 63 |
const t1=dates.indexOf($("date").value),n=per==="day"?1:+per,se={},cnt={};const add=(k,e)=>{if(fin(e)){se[k]=(se[k]||0)+e*e;cnt[k]=(cnt[k]||0)+1}};
|
| 64 |
const t0=Math.max(MIN,t1-n+1);
|
| 65 |
for(let t=t0;t<=t1;t++){const {ms,bias,mse}=fit(li,D,t);const good=ms.filter(m=>fin(mse[m])&&mse[m]>0);let ws=0;good.forEach(m=>ws+=1/mse[m]);
|
| 66 |
for(let c=0;c<NAMES.length;c++){if(ci>=0&&c!==ci)continue;const o=num(O[c][t]);if(!fin(o))continue;let fu=0,ok=good.length>=3;
|
| 67 |
-
for(const m of ms){const x=num(F[m][li][c][t]);add(m,
|
| 68 |
for(const m of good){const x=num(F[m][li][c][t])-bias[m][c];if(!fin(x)){ok=false;break}fu+=(1/mse[m])/ws*x}
|
| 69 |
if(ok)add("darwin",fu-o)}}
|
| 70 |
const rows=MK.filter(m=>cnt[m]).map(m=>({m,r:Math.sqrt(se[m]/cnt[m]),n:cnt[m]})).sort((a,b)=>a.r-b.r);
|
|
@@ -75,8 +74,8 @@ function render(){
|
|
| 75 |
h+=`<tr class="${rk===1?"first":""}"><td>${rk}</td><td>${MODELS[x.m][0]}</td><td>${MODELS[x.m][1]}</td><td>${x.r.toFixed(2)}</td><td>${i?"+"+((x.r/best-1)*100).toFixed(1)+"%":"best"}</td><td>${x.n}</td></tr>`});
|
| 76 |
$("tbl").innerHTML=h;
|
| 77 |
$("t1").textContent=`Ranking: ${D}-day forecasts, ${t0===t1?dates[t1]:dates[t0]+" to "+dates[t1]}, ${ci<0?"24 cities":NAMES[ci]}`;
|
| 78 |
-
$("status").textContent=rows.length?`Verified through ${dates[dates.length-1]} (ERA5).
|
| 79 |
load().then(()=>{NAMES.forEach((c,i)=>$("city").insertAdjacentHTML("beforeend",`<option value="${i}">${c}</option>`));
|
| 80 |
for(let i=dates.length-1;i>=MIN;i--)$("date").insertAdjacentHTML("beforeend",`<option>${dates[i]}</option>`);
|
| 81 |
-
["lead","period","date","city"
|
| 82 |
</script></body></html>
|
|
|
|
| 21 |
<label>Period<select id="period"><option value="day">Single day</option><option value="7">Last 7 days</option><option value="14" selected>Last 14 days</option></select></label>
|
| 22 |
<label>Verification date<select id="date"></select></label>
|
| 23 |
<label>City<select id="city"><option value="-1">All 24 cities</option></select></label>
|
|
|
|
| 24 |
</div>
|
| 25 |
<div id="status">Loading forecasts and observations…</div>
|
| 26 |
<div class="card"><h2 id="t1">Ranking</h2><table id="tbl"></table></div>
|
| 27 |
<div class="card"><h2>How it is scored</h2>
|
| 28 |
+
<p style="margin:0;color:var(--mut)">Each model's forecast issued N days earlier is compared with the ERA5 daily maximum for the same UTC day at each city. Lower RMSE ranks higher. ERA5 is published about five days after the fact, so the latest verification date trails today. <b>Darwin-Prediction-Weather</b> is VIDRAFT's fusion engine: local bias correction plus skill-weighted fusion of the eight models, fitted only on days before the one being scored. It is shown alongside the ranking and is not ranked among the public models.</p></div>
|
| 29 |
<footer>Weather data by <a href="https://open-meteo.com/">Open-Meteo.com</a> (CC BY 4.0). Verification: ERA5, Copernicus Climate Change Service. Model sources: ECMWF, NOAA NCEP, DWD, JMA, ECCC, MET Norway. Engine: <a href="https://huggingface.co/FINAL-Bench/Darwin-Prediction-Weather">Darwin-Prediction-Weather</a>.</footer>
|
| 30 |
</main><script>
|
| 31 |
const CITIES={"Seoul":[37.57,126.98],"Busan":[35.18,129.08],"Tokyo":[35.68,139.69],"Beijing":[39.90,116.40],"Singapore":[1.35,103.82],"Delhi":[28.61,77.21],"Dubai":[25.20,55.27],"Moscow":[55.76,37.62],"Berlin":[52.52,13.40],"London":[51.51,-0.13],"Paris":[48.86,2.35],"Madrid":[40.42,-3.70],"Cairo":[30.04,31.24],"Nairobi":[-1.29,36.82],"Johannesburg":[-26.20,28.05],"New York":[40.71,-74.01],"Chicago":[41.88,-87.63],"Los Angeles":[34.05,-118.24],"Mexico City":[19.43,-99.13],"Sao Paulo":[-23.55,-46.63],"Buenos Aires":[-34.60,-58.38],"Sydney":[-33.87,151.21],"Anchorage":[61.22,-149.90],"Reykjavik":[64.15,-21.94]};
|
|
|
|
| 58 |
mse[m]=n2?s2/n2:NaN}
|
| 59 |
return{ms,bias,mse}}
|
| 60 |
function render(){
|
| 61 |
+
const D=+$("lead").value,li=LEADS.indexOf(D),per=$("period").value,ci=+$("city").value;
|
| 62 |
const t1=dates.indexOf($("date").value),n=per==="day"?1:+per,se={},cnt={};const add=(k,e)=>{if(fin(e)){se[k]=(se[k]||0)+e*e;cnt[k]=(cnt[k]||0)+1}};
|
| 63 |
const t0=Math.max(MIN,t1-n+1);
|
| 64 |
for(let t=t0;t<=t1;t++){const {ms,bias,mse}=fit(li,D,t);const good=ms.filter(m=>fin(mse[m])&&mse[m]>0);let ws=0;good.forEach(m=>ws+=1/mse[m]);
|
| 65 |
for(let c=0;c<NAMES.length;c++){if(ci>=0&&c!==ci)continue;const o=num(O[c][t]);if(!fin(o))continue;let fu=0,ok=good.length>=3;
|
| 66 |
+
for(const m of ms){const x=num(F[m][li][c][t]);add(m,x-o)}
|
| 67 |
for(const m of good){const x=num(F[m][li][c][t])-bias[m][c];if(!fin(x)){ok=false;break}fu+=(1/mse[m])/ws*x}
|
| 68 |
if(ok)add("darwin",fu-o)}}
|
| 69 |
const rows=MK.filter(m=>cnt[m]).map(m=>({m,r:Math.sqrt(se[m]/cnt[m]),n:cnt[m]})).sort((a,b)=>a.r-b.r);
|
|
|
|
| 74 |
h+=`<tr class="${rk===1?"first":""}"><td>${rk}</td><td>${MODELS[x.m][0]}</td><td>${MODELS[x.m][1]}</td><td>${x.r.toFixed(2)}</td><td>${i?"+"+((x.r/best-1)*100).toFixed(1)+"%":"best"}</td><td>${x.n}</td></tr>`});
|
| 75 |
$("tbl").innerHTML=h;
|
| 76 |
$("t1").textContent=`Ranking: ${D}-day forecasts, ${t0===t1?dates[t1]:dates[t0]+" to "+dates[t1]}, ${ci<0?"24 cities":NAMES[ci]}`;
|
| 77 |
+
$("status").textContent=rows.length?`Verified through ${dates[dates.length-1]} (ERA5). Public models scored as issued.${rows[0].n<30?" Small sample: results for a single day or city vary widely.":""}`:"No verified cases for this selection."}
|
| 78 |
load().then(()=>{NAMES.forEach((c,i)=>$("city").insertAdjacentHTML("beforeend",`<option value="${i}">${c}</option>`));
|
| 79 |
for(let i=dates.length-1;i>=MIN;i--)$("date").insertAdjacentHTML("beforeend",`<option>${dates[i]}</option>`);
|
| 80 |
+
["lead","period","date","city"].forEach(id=>$(id).onchange=render);render()}).catch(e=>{$("status").textContent="Could not load data. Please reload in a moment."});
|
| 81 |
</script></body></html>
|