Line Chart Types/Area & Stacked/Confidence Band

信賴帶折線圖

在中心趨勢線周圍加入上下界陰影帶，清楚表達預測不確定性與信賴區間。適合天氣、財務、醫療與各種含誤差範圍的趨勢圖。

Intermediate信賴帶折線圖信賴區間預測區間不確定性視覺化

Example

Guide

概述

當你不只要回答「趨勢往哪走」，還要回答「這個趨勢有多不確定」時，就應該使用信賴帶折線圖。帶狀陰影會呈現中心估計值周圍的可能範圍（例如 95% 信賴區間），讓讀者同時看到方向與可信度。

何時使用

  • 在預測模型中呈現預測不確定性
  • 顯示統計信賴區間
  • 視覺化量測誤差範圍
  • 呈現可能結果的範圍
  • 在資料科學場景傳達模型不確定性

不適用

  • 不確定性可忽略或與決策無關時
  • 面向不熟悉統計概念的受眾且無法提供解釋時
  • 當「精確上下界」比趨勢更重要時

關鍵變體

  • 單一信賴水準 vs 多個水準（例如 50%、90%、95%）
  • 對稱 vs 非對稱信賴帶
  • 信賴帶寬度固定 vs 隨時間變化
  • 與「實際值 vs 預測值」的區分一起呈現

使用情境

  • 天氣預報：溫度預測區間
  • 財務預測：含信賴上下界的營收預測
  • 機器學習：帶不確定性的模型預測
  • 臨床試驗：含信賴區間的治療效果估計
  • 銷售預測：上下界情境分析

在 Line Graph Maker 的快速設定

  1. 資料至少包含三條序列：Lower、Upper、Value。
  2. 用 Value 當主折線。
  3. 用 Lower 與 Upper 形成陰影帶，表達不確定範圍。
  4. 在副標或圖例明確標示「Band = 95% CI」。

資料（CSV）

date,Lower,Upper,Value
2012-08-28,-0.282,0.240,-0.162
2012-08-29,-0.042,0.060,-0.012
2012-08-30,-0.027,0.060,0.003
2012-08-31,-0.040,0.060,-0.010
2012-09-01,-0.038,0.060,-0.008
2012-09-02,-0.034,0.060,-0.004
2012-09-03,-0.038,0.060,-0.008
2012-09-04,-0.035,0.060,-0.005
2012-09-05,-0.039,0.060,-0.009
2012-09-06,-0.037,0.060,-0.007
2012-09-07,-0.035,0.060,-0.005
2012-09-08,-0.030,0.060,0.000
2012-09-09,-0.037,0.060,-0.007
2012-09-10,-0.033,0.060,-0.003
2012-09-11,-0.031,0.060,-0.001
2012-09-12,-0.030,0.060,0.000
2012-09-13,-0.033,0.060,-0.003
2012-09-14,-0.032,0.060,-0.002
2012-09-15,-0.029,0.060,0.001
2012-09-16,-0.027,0.060,0.003
2012-09-17,-0.021,0.060,0.009
2012-09-18,-0.052,0.060,-0.022
2012-09-19,-0.039,0.060,-0.009
2012-09-20,-0.030,0.060,0.000
2012-09-21,0.019,0.040,0.039
2012-09-22,-0.017,0.060,0.013
2012-09-23,-0.030,0.060,0.000
2012-09-24,-0.036,0.060,-0.006
2012-09-25,-0.036,0.060,-0.006
2012-09-26,-0.036,0.060,-0.006
2012-09-27,-0.034,0.060,-0.004
2012-09-28,-0.043,0.060,-0.013
2012-09-29,-0.039,0.060,-0.009
2012-09-30,-0.039,0.060,-0.009
2012-10-01,-0.043,0.060,-0.013
2012-10-02,-0.041,0.060,-0.011
2012-10-03,-0.041,0.060,-0.011
2012-10-04,-0.041,0.060,-0.011
2012-10-05,-0.040,0.060,-0.010
2012-10-06,-0.037,0.060,-0.007
2012-10-07,-0.034,0.060,-0.004
2012-10-08,-0.032,0.060,-0.002
2012-10-09,0.047,0.060,0.077
2012-10-10,0.094,0.060,0.124
2012-10-11,0.080,0.060,0.110
2012-10-12,0.057,0.060,0.087
2012-10-13,0.038,0.060,0.068
2012-10-14,0.030,0.060,0.060
2012-10-15,-0.042,0.060,-0.012
2012-10-16,-0.051,0.060,-0.021
2012-10-17,-0.042,0.060,-0.012
2012-10-18,-0.040,0.060,-0.010
2012-10-19,-0.038,0.060,-0.008
2012-10-20,-0.037,0.060,-0.007
2012-10-21,-0.034,0.060,-0.004
2012-10-22,-0.034,0.060,-0.004
2012-10-23,-0.036,0.060,-0.006
2012-10-24,-0.035,0.060,-0.005
2012-10-25,-0.035,0.060,-0.005
2012-10-26,-0.035,0.060,-0.005
2012-10-27,-0.034,0.060,-0.004
2012-10-28,-0.031,0.060,-0.001
2012-10-29,-0.033,0.060,-0.003
2012-10-30,-0.031,0.060,-0.001
2012-10-31,-0.030,0.060,0.000
2012-11-01,-0.032,0.060,-0.002
2012-11-02,-0.032,0.060,-0.002
2012-11-03,-0.030,0.060,0.000
2012-11-04,-0.031,0.060,-0.001
2012-11-05,-0.029,0.060,0.001
2012-11-06,-0.028,0.060,0.002
2012-11-07,-0.029,0.060,0.001
2012-11-08,-0.029,0.060,0.001
2012-11-09,-0.027,0.060,0.003
2012-11-10,-0.028,0.060,0.002
2012-11-11,-0.028,0.060,0.002
2012-11-12,-0.026,0.060,0.004
2012-11-13,-0.027,0.060,0.003
2012-11-14,-0.027,0.060,0.003
2012-11-15,-0.026,0.060,0.004
2012-11-16,-0.027,0.060,0.003
2012-11-17,-0.025,0.060,0.005
2012-11-18,-0.025,0.060,0.005
2012-11-19,-0.024,0.060,0.006
2012-11-20,-0.023,0.060,0.007
2012-11-21,-0.025,0.060,0.005
2012-11-22,-0.025,0.060,0.005
2012-11-23,-0.023,0.060,0.007
2012-11-24,-0.022,0.060,0.008
2012-11-25,-0.022,0.060,0.008
2012-11-26,0.004,0.060,0.034
2012-11-27,0.029,0.060,0.059
2012-11-28,0.049,0.060,0.079

圖表設定（JSON）

這張圖會透過堆疊兩條「不可見折線」（Lower 與 Upper 邊界）形成陰影區域，並將 Value 折線清楚地顯示在上方，從而構成信賴帶效果。

重要的資料格式說明： 為了讓堆疊技巧正確運作，CSV 裡的 "Upper" 欄位應填入 上界與下界的差值（Upper - Lower），而不是上界的絕對值。因為 ECharts 的堆疊是加法：Lower + (Upper - Lower) = 實際上界。例如：

  • 若下界為 -0.282，上界為 -0.042
  • CSV 應寫：Lower = -0.282、Upper = 0.240（也就是 -0.042 - (-0.282)）

效能提示

  • 信賴帶建議使用低不透明度的面積填色
  • 清楚標示信賴水準
  • 可考慮在滑鼠懸停時弱化/隱藏信賴帶，以便更清楚讀取線條數值

常見問題

不同線條各自代表什麼？ 在信賴帶圖中：

  • 中心線代表最佳估計或預測
  • 上界代表在某個信賴水準下可能的最大值
  • 下界代表在某個信賴水準下可能的最小值
  • 上下界之間的陰影帶狀區域用來視覺化不確定範圍

應該使用哪個信賴水準？ 95% 在科研情境最常見；90% 可用於初步分析；99% 代表更高確定性。無論選擇哪個水準，都應清楚標示。

信賴帶和預測區間有什麼差別？ 信賴帶通常描述「平均趨勢估計值」的不確定性；預測區間描述「未來單次觀測值」可能落入的範圍。預測區間通常更寬。請務必在圖上清楚標示你使用的是哪一種。

如何向非技術受眾解釋信賴帶？ 可用更直白的說法：

  • 「灰色區域表示真實值可能出現的位置」
  • 「陰影區域代表我們的不確定性」
  • 「線是最可能的預測，帶是可能的範圍」

除非受眾具備統計背景，否則盡量避免使用「信賴區間」「標準誤」等術語。

為什麼信賴帶寬度會隨時間變化？ 帶寬反映不確定性程度的變化，常見原因：

  • 資料較少 → 信賴帶更寬（不確定性更高）
  • 波動較大 → 信賴帶更寬
  • 時間序列的開頭/結尾通常更不確定
  • 事件或介入可能暫時提高不確定性

需要顯示多個信賴水準嗎？ 一般不建議。多條帶（例如 50%、90%、95%）容易讓非技術受眾困惑。通常只顯示一個符合領域標準的水準；研究論文可在附錄補充其他水準。

如何處理非對稱信賴區間？ 在資料中分別提供上界與下界欄位即可。非對稱信賴帶常見於：

  • 非常態分布
  • 計數資料（Poisson 模型）
  • 接近 0 或 1 的比例資料
  • 經過對數轉換的資料

信賴帶用什麼顏色比較合適？ 灰色最常見也最中性，不會傳達好/壞的價值判斷。若需符合品牌色，建議使用很淡的色調並降低不透明度（約 20–30%），避免蓋過主折線。

Open in Line Graph Maker