From a2a7cfd744bd4f1d04379a27e2261bcf61fe61e9 Mon Sep 17 00:00:00 2001 From: yarnom Date: Tue, 23 Sep 2025 17:15:42 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E9=9B=B7=E8=BE=BE=E5=8E=86=E5=8F=B2?= =?UTF-8?q?=E6=95=B0=E6=8D=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- templates/radar_guangzhou.html | 16 ++----- templates/radar_nanning.html | 80 +++++++++++----------------------- 2 files changed, 29 insertions(+), 67 deletions(-) diff --git a/templates/radar_guangzhou.html b/templates/radar_guangzhou.html index b6be512..baec20d 100644 --- a/templates/radar_guangzhou.html +++ b/templates/radar_guangzhou.html @@ -103,7 +103,7 @@ let gTileValues = null, gXs = null, gYs = null; let gWindFromDeg = null, gWindSpeedMS = null; let gTimes = []; - let gCurrentIdx = -1; // 在 gTimes 中的索引（倒序：0=最新） + let gCurrentIdx = -1; function toRad(d){ return d * Math.PI / 180; } function toDeg(r){ return r * 180 / Math.PI; } @@ -172,14 +172,12 @@ document.getElementById('east').textContent = fmt5(t.east); document.getElementById('north').textContent = fmt5(t.north); document.getElementById('res').textContent = fmt5(t.res_deg); - // 标题时间与索引同步 document.getElementById('titleDt').textContent = `（${t.dt}）`; const selBox = document.getElementById('timeSelect'); for(let i=0;idBZ=%{customdata[2]:.1f}' }; const layout={ autosize:true, margin:{l:40,r:8,t:8,b:90}, xaxis:{title:'经度',tickformat:'.2f',zeroline:false,constrain:'domain',automargin:true}, yaxis:{title:{text:'纬度',standoff:12},tickformat:'.2f',zeroline:false,scaleanchor:'x',scaleratio:1,constrain:'domain',automargin:true} }; - // 扇形覆盖 const data=[heatTrace]; if(gWindFromDeg!==null && gWindSpeedMS>0){ const half=30, samples=64, start=gWindFromDeg-half, end=gWindFromDeg+half, rangeM=gWindSpeedMS*3*3600; @@ -219,7 +215,6 @@ Plotly.newPlot(plotEl, data, layout, {responsive:true, displayModeBar:false}).then(()=>{ const s=plotEl.clientWidth; Plotly.relayout(plotEl,{height:s}); }); window.addEventListener('resize',()=>{ const s=plotEl.clientWidth; Plotly.relayout(plotEl,{height:s}); Plotly.Plots.resize(plotEl); }); - // 与瓦片时间对齐的10分钟气象 try{ const base = forcedDt ? new Date(forcedDt.replace(/-/g,'/')) : new Date(t.dt.replace(/-/g,'/')); const ceil10=new Date(base); const m=base.getMinutes(); const up=(Math.floor(m/10)*10+10)%60; ceil10.setMinutes(up,0,0); if(up===0){ ceil10.setHours(base.getHours()+1); } @@ -286,7 +281,6 @@ try{ if(!gTileValues || !gXs || !gYs || gWindSpeedMS===null) return; const R=6371000; const rangeM=gWindSpeedMS*3*3600; - // 以站点为中心的正方形（3小时可达半径），作为“细节放大”裁剪窗口 const dLat=(rangeM/R)*(180/Math.PI); const dLon=(rangeM/(R*Math.cos(toRad(ST_LAT))))*(180/Math.PI); const latMin=ST_LAT-dLat, latMax=ST_LAT+dLat, lonMin=ST_LON-dLon, lonMax=ST_LON+dLon; @@ -308,7 +302,6 @@ colorbar:{orientation:'h',x:0.5,y:-0.12,xanchor:'center',yanchor:'top',len:0.8,thickness:16,title:{text:'dBZ',side:'bottom'}, tickmode:'array',tickvals:Array.from({length:15},(_,i)=>i),ticktext:Array.from({length:15},(_,i)=>String(i*5))}, hovertemplate:'lon=%{x:.3f}, lat=%{y:.3f}
dBZ=%{customdata[2]:.1f}' }]; - // 扇形覆盖（同样默认显示） if(gWindFromDeg!==null && gWindSpeedMS>0){ const half=30, samples=64, start=gWindFromDeg-half, end=gWindFromDeg+half, rangeM=gWindSpeedMS*3*3600; const xsFan=[ST_LON], ysFan=[ST_LAT]; @@ -326,7 +319,6 @@ }catch(e){ document.getElementById('squarePlot').innerHTML=`
正方形热力图渲染失败：${e.message}
`; } } - // 启动加载：预填近3小时范围并填充时次 (function initRange(){ const end=new Date(); const start=new Date(end.getTime()-3*3600*1000); document.getElementById('tsStart').value=fmtDTLocal(start); document.getElementById('tsEnd').value=fmtDTLocal(end); })(); const startStr = fromDTLocalInput(document.getElementById('tsStart').value); const endStr = fromDTLocalInput(document.getElementById('tsEnd').value); @@ -340,7 +332,7 @@ }); document.getElementById('tsQuery').addEventListener('click', async ()=>{ const s=fromDTLocalInput(document.getElementById('tsStart').value); const e=fromDTLocalInput(document.getElementById('tsEnd').value); await populateTimes(s,e); }); function updateCountAndButtons(){ - const N=gTimes.length; const k=gCurrentIdx>=0?(gCurrentIdx+1):0; document.getElementById('countInfo').textContent=`共${N}条数据，-${k-1}时刻`; + const N=gTimes.length; const k=gCurrentIdx>=0?(gCurrentIdx+1):0; document.getElementById('countInfo').textContent=`共${N}条数据，-${k-1}时次`; const prev=document.getElementById('btnPrev'); const next=document.getElementById('btnNext'); prev.disabled = !(N>0 && gCurrentIdx>=0 && gCurrentIdx0 && gCurrentIdx>0); @@ -350,7 +342,7 @@ const N = gTimes.length; slider.max = N > 0 ? String(N-1) : '0'; if (N > 0 && gCurrentIdx >= 0) { - const sliderVal = (N - 1) - gCurrentIdx; // 值越大越新 + const sliderVal = (N - 1) - gCurrentIdx; slider.value = String(sliderVal); } slider.disabled = N === 0; @@ -365,7 +357,7 @@ const N = gTimes.length; if (N === 0) return; const raw = parseInt(e.target.value, 10); const sliderVal = Math.max(0, Math.min(N-1, isNaN(raw)?0:raw)); - const idx = (N - 1) - sliderVal; // 反向映射到数组索引（0=最新） + const idx = (N - 1) - sliderVal; if (idx === gCurrentIdx) return; gCurrentIdx = idx; const dt = gTimes[gCurrentIdx]; diff --git a/templates/radar_nanning.html b/templates/radar_nanning.html index 1b0af73..3c161bd 100644 --- a/templates/radar_nanning.html +++ b/templates/radar_nanning.html @@ -87,7 +87,6 @@ -
@@ -101,9 +100,9 @@