3個解析度預報結果網頁之串連

背景

• 不同解析度預報結果要在同一個畫面顯示，有其困難度，如下列2個方案：
  1. 如果仿照地圖png畫面，切換不同的zoom、x及y，即對照到不同目錄(預存不同解析度)的png檔，需事先將圖形進行切割，以產生所需png檔案，且放棄earth系統，改採地圖系統。(參…)
  2. 在js中偵測zoom值達到某一等級，則自動切換讀取不同目錄之檔案
• 此處以一較容易的作法(參考about的作法)，放棄同一畫面的堅持，以超連結啟動其他解析度的網頁。
  1. 如以手機查閱，可以避免以放大動作控制zoom的切換。
  2. 雖然切換其他網頁，但在本地仍暫存畫面，可以快速切換。
  3. 切換過程會以黑屏呈現，而不是漸變。以避免來自不同模擬結果、不合理突變的情形。

html檔的增修

解析度45k

• earthFcst45/public/index.html

<a href="http://125.229.149.182:8085" class="internal-link">South-Eastern China | </a>
<a href="http://125.229.149.182:8086" class="internal-link">Taiwan Island | </a>

解析度09k

• earthFcst09/public/index.html

<a href="http://125.229.149.182:8086" class="internal-link">Taiwan Island | </a>
<a href="http://125.229.149.182:8084" class="internal-link">Eastern Asia | </a> 

解析度03k

• earthFcst03/public/index.html

<a href="http://125.229.149.182:8084" class="internal-link">Eastern Asia | </a> 
<a href="http://125.229.149.182:8085" class="internal-link">South-Eastern China | </a>

滑鼠位置

• 左下角為展開earth之控制文字。因此展開後之左下角設計為切換下一解析度的預設位置。
• 切換循環：由綜觀尺度一直到局布尺度的過程
  • 45k → 09k → 03k → 45k

earth index.html的增修效果，切換不同解析度預報結果在畫面的左下方