前言

今天畫堆疊形式的面積圖，可以看出每一個分類占總數的面積比例。

收集資料

• 到經濟部統計處下載過去一年的能源供給及消費量的資料
  
• 整理資料，換成 utf8 的 csv 檔案
  • 年份改成西元
    

開始畫圖

• 上傳檔案到 observable
  
• 使用 faltMap(), map() 把資料整理成三個欄位

部門 = ["工業", "運輸", "服務", "住宅", "其他"]

energy_consumption = 部門.flatMap( 
  國內能源消費量 => raw_energy_consumption.map (
    d => ({
      年: d.年,
      國內能源消費量,
      千公秉油當量: d[國內能源消費量]
    })
))

• 選擇 stacked area chart，修改傳入參數
  

Plot.plot({
  y: {
    tickFormat: "s"
  },
  marks: [
    Plot.areaY(energy_consumption, {x: "年", y: "千公秉油當量", fill: "國內能源消費量"}),
    Plot.ruleY([0])
  ]
})

• 美化圖片，加上分類標示

Plot.plot({
  y: {
    tickFormat: "s",
    grid: true,
    label: "國內能源消費量(千公秉油當量)",
    domain: [0, 10000]
  },
  // 加上顏色標示
  color: {
    domain: 部門,
    range: ["#fd6246", "#ffca18", "#07a620", "#55affa", "#1f28b9"],
    legend: true,
  },
  marks: [
    Plot.areaY(energy_consumption, {x: "年", y: "千公秉油當量", fill: "國內能源消費量"}),
    Plot.ruleY([0]),
  ]
})

每1桶原油產生的熱值能量就是1桶油當量
公秉油當量(KLOE)= 0.9 公噸油當量(TOE) 。

結論

從面積大小可以直覺的判斷能源消費量主要是工業和其他