 |
| Fig 1. Sankey diagram範例 by Peggy |
因為Peggy手上的專案和big data息息相關，工作常需要運用各種圖表來進行溝通，對於此類的視覺工具看到就會特別感興趣。前幾天，偶然間看到同事使用 Sankey diagram 來呈現表達他的想法時，覺得相當有趣，就花了點時間小研究一下。
一張好圖勝過千言萬語，希望這篇文章對各位朋友的日常生活或工作有些的幫助和靈感啟發，也在思考如何好好表達資料的意義時多一項參考囉。
/// Sankey diagram簡介 ///
Sankey diagram 是一種特定類型的 flow diagram，其特色為從一開始的流量到最後的數個流向的總和是一致的，中間不同的寬度代表比例。
特別適合於描述流向和期間的各個比例，常用於以下場合。1. 金融數據 (ex. budget, cost)2. 能源效益3. 材料成分 ...等等
"A Sankey diagram says more than 1,000 pie charts"
有愛好者說過這句話，表達了一張Sankey diagram可代表的豐富涵義勝過很多張不同的pie chart.
以下是一能源供給和需求的範例。
 |
| Fig 2. Source: Department of Energy & Climate Change, Tom Counsell. |
/// Sankey diagram tool 簡介 ///
在市面上可繪製Sankey diargram的工具有很多，如Tableau、PowerBI等BI工具，R語言、Python、JS等等都有程式庫可以使用。
在這邊Peggy著重分享一個線上免費工具SankeyMATIC (http://sankeymatic.com/)，且運用此工具來繪製每月財務預算。
推薦此工具的原因:
- 很容易上手，不須會寫程式
- 支援中文
- 輸出可以直接拿來加入投影片上使用，目前輸出支援PNG, SVG格式。
接下來一起一步步的來試試看吧。
Step 1: 到SankeyMATIC的首頁 http://sankeymatic.com/，可點選右下角的 "Get started" 或者"Visit the Gallery"。Peggy這次選擇 "Get started"，剛好就是財務預算的範例，改起來很快。
 |
| Fig 3. SankeyMATIC homepage |
選擇Gallery的就如下圖，有四種類型的圖可以參考，且一步步的手把手(英文版囉)。
 |
| Fig 4. SankeyMATIC Gallery |
Step 2: 點 "Get started"，就出現下圖範例。
 |
| Fig 5. SankeyMATIC edit page |
Step 3: 開始預算編列。
項目參考 <有錢人想的和你不一樣> 一書裡面的六個罐子理財法，Peggy也實踐這個系統超過五年了，小有成果，有機會再推薦給各位。
 |
| Fig 6. 家庭財務預算範例by Peggy |
把Input欄位的內容改成以下表示的，
其原理很簡單: SOURCE [AMOUNT] TARGET 表示 源頭[源頭來的數量]流入的標的
也可直接拷貝下段文字。
工作所得[60000] 收入小結
基金配息[10000] 收入小結
收入小結[15000] 儲蓄
收入小結[5000] 教育/自我成長
收入小結[42000] 生活必須
收入小結[5000] 支出用長期儲蓄
收入小結[3000] 捐款/贈與
改完後呈現的樣子，整個概念可以看成有三層結點Node。金錢流動從第一層到第二層，第二層再流到第三層。
第一層Node:工作所得、基金配息
第二層Node:收入小結
第三層Node:儲蓄、教育/自我成長、生活必須、支出用長期儲蓄、捐款/贈與
 |
| Fig 7. SankeyMATIC edit page |
Step 4: 將要強調的部分用不同顏色表示。
顏色一樣有時候看不出重點，讓我們來調整一下吧。
需求1: 想要著重配息基金的部分，以提醒自己記得要投資，這邊用綠色強調(#0A0)。 :基金配息 #0A0 <<
需求2: 想要強調儲蓄額度，以提醒自己未來多提高儲蓄金額，這邊用橘色強調(#FF4000)。:儲蓄 #FF4000<<
 |
| Fig 8. SankeyMATIC edit page |
格式 : 項目名稱 #色號
可以用 << 或 >> 覆蓋掉原本設定的顏色
例如 :儲蓄 #0A0 << 表儲蓄項目的設定的顏色往左覆蓋 (Fig 9)如果是 :儲蓄 #0A0 沒有 << 表示只改變儲蓄這個項目(Fig 10)
 |
| Fig 9. << 表儲蓄項目的設定的顏色往左覆蓋 |
 |
| Fig 10. 沒有 << 表示只改變儲蓄這個項目 (右上角紅色bar) |
簡單的介紹和手把手就到這邊囉，更多細節可以參考以下網頁。
- Sankeymatic的指南: http://sankeymatic.com/manual/
- 色號: https://html-color-codes.info/
完整的範例如下
工作所得[60000] 收入小結
基金配息[10000] 收入小結
收入小結[15000] 儲蓄
收入小結[5000] 教育/自我成長
收入小結[42000] 生活必須
收入小結[5000] 支出用長期儲蓄
收入小結[3000] 捐款/贈與
:基金配息 #0A0
:儲蓄 #FF4000<<
原創文章，若有您轉貼需求，請來信討論。 轉貼時禁止修改內容及標題且保持所有連結。禁止商業使用，請註明原文標題、連結以及作者。
沒有留言:
張貼留言