第一章 緒論
1.4 論文章節架構
國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
4
本論文的研究目的主要為以下三個方向，各部分的內容簡單敘述如下：
群聚相似貼文：針對 Facebook 貼文上的屬性進行降維演算法，將具有相似 屬性的貼文群聚並且放置在散佈圖中。
使用者參與程度：將長時間的 Facebook 貼文資料集切割成相等長度的時間 區間，並且以日期為單位將其貼文資料進行階層化視覺化呈現，呈現出 Facebook 使用者於該時間區間的參與狀況。
探索式互動設計：將上述兩各視覺化進行整合，並且提供互動式的操作達到 探索與分析的功能，成為一款能夠深度探討社群網路行為的探索工具。
1.4 論文章節架構
在第二章中，將會介紹與本論文相關的研究背景知識，第三章為主要的研究 方法與步驟，第四章為實驗結果與分析，第五章為結論與未來展望。
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
5
第二章
相關研究
此章節會介紹本論文相關的研究知識背景的論文並且進行整理，首先介紹與 社群媒體相關的視覺化研究，接者依照視覺化種類分為，時序性資料視覺化以及 多維度資料視覺化三個部分。
2.1 社群媒體資料視覺化
近年來由於社群網站不斷地興起，例如Facebook、Twitter、Google+、Plurk 等網站，已有許多研究針對社群媒體中使用者的行為進行分析。Google 針對 Google+提出了 Ripples 服務[Viégas et al. 2013]，一種節點圖結合 circular treemap 的表示圖，提供一種能直觀地呈現 Google+文章被分享的情形，採用 balloon treemap 除了可有效的利用空間，也能藉由 balloon treemap 也能觀察這篇文章上 每個使用者的影響力範圍，由此可知社群媒體上的文章具有一定的影響力，如圖 2.1。
圖2.1 Google+ Ripples 服務，摘自[Viégas et al. 2013]。
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
6
SentenTree[Hu et al. 2017]將社群媒體 Twitter 上的推文內容進行整理，將一 段時間內最為常見的字詞進行視覺化的呈現，以文字的大小作為出現頻率，文字 與文字之間的連線代表了文字的出現順序，達到傳統文字雲無法表達句子結構的 效果，如圖2.2。
圖2.2 SentenTree，摘自[Hu et al. 2017]。
由於每個人是一個獨立的個體，具有不同的想法導致行為模式會有所不同，
TargetVue[Cao, Nan, et al. 2016]透過視覺化社群媒體上的使用者的行為，以及使 用者之間互動的連結，觀察社群媒體上使用者之間不同的使用習慣，發現社群上 活動模式異常的使用者，如圖2.3。
圖2.3 TargetVue，摘自[Cao, Nan, et al. 2016]。
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
7
2.2 多維度資料視覺化
一個資料集中的每一筆資料，彼此之間會有關係存在，例如都市與都市之間 的距離關係、家族之間的親緣關係，或者是某個會議中作者與作者之間的合作關 係等等…。使用樹狀圖雖然可以有效表現出階層化的結果，對於原始資料中隱藏 的資訊卻比不上Heat Map 等視覺化技術來的明顯。Dendrogramix [Blanch et al.
2015] 透過選定的 Distance 函數將每筆資料間的距離放置在矩陣中，其後將矩陣 進行排序，矩陣中的上三角會和原始的樹狀圖結果一致，如圖 2.4。由於階層化 的資料呈現在螢幕上會佔據視窗的大半部分，可能會導致細節的模糊化，一旦資 料量過於龐大時，透過在 Overview 和 Detail 之間設計互動式操作能夠有效地解 決Overview 和 Detail 之間的縮放問題[Chen et al. 2009]。
圖2.4 Dendrogramix，摘自[Blanch et al. 2015]。
一般來說資料中包含的屬性通常不會只有一個，如果資料隱含兩種屬性可以 透過二維空間去配置資料的位置，三種屬性則可以將資料分佈在三維空間上。一 旦超過三個屬性就沒有辦法直接在我們熟悉的空間 維度進行資料的配置。
Multidimensional scaling (MDS) [Wickelmaier 2003] 演算法是一個經常用來處理 多維度資料的方法之一，原始的多維度資料透過MDS 演算法分析資料之間的相
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
8
似程度，其代表資料與資料之間的關係，再透過相似程度把資料配置在二維空間 上。二維空間上的點和點之間的距離，代表的就是資料與資料之間的相似關係。
Scatterplot matrix[CUI et al. 2006] 則是選擇在多維度的資料中任選兩個維度，
根據被挑選的兩個維度將資料配置在二維空間上，也就是說如果資料集總共有四 個維度，Scatterplot matrix 就會六種組合六種空間的配置。
雖然過多的維度可以透過MDS 演算法將資料配置在二維空間中，如果資料 集裡的資料量過於龐大，配置在二維空間中的資料，很難觀察出資料的細部差異。
Dimension projection matrix/tree[Yuan et al. 2013]一樣利用 MDS 演算法將資料配 置在二維空間上，但允許使用者將二維空間上資料的聚集結果進一步地去探討細 部資料，透過將降低資料集的大小可以有效得觀察到資料的細部差異，如圖2.5。
圖2.5 Dimension projection matrix/tree，摘自[Yuan et al. 2013]。
Dimension Reconstruction[Zhou et al. 2016]透過將降維過後的資料以 classical linear discriminant analysis (LDA) 投影在一條直線上達到將資料分類的效果，進 一步的產生出一個新的維度，由這種方式產生出來的新維度稱為 Reconstructed Dimension，如圖 2.6，透過互動的操作讓使用者能夠尋找出適合的維度或是產生 出合適的維度，使降維過後的散佈圖可以得到更佳的結果。
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
9
圖2.6 Dimension Reconstruction，摘自[ZHOU et al. 2016]。
2.3 時序性資料視覺化
時序性的資料普遍存在於日常生活中，像是每日每個交通幹道的車流量變化、
每年度各個地區的房價變化等等…，都已經有專用的視覺化工具對於各種資料進 行視覺化的分析。目前已經有許多針對時序性資料進行視覺化的視覺化技術，其 中有許多種視覺化技術是定義在特殊的資料集。以Time Curves [Bach et al.2016]，
針對Wikipedia 的文章編輯紀錄、影片中每個影格的變化，或是一段時間的氣候 變化種種的時序性資料，依照每個時間點的相似程度，將相似的時間點聚集起來 形成一條時間曲線。藉由時間點的分佈觀察出時間點的聚集程度以及時間的流向，
了解到整體時間的變化，如圖2.7。
圖2.7 Time Curves，摘自[Bach et al.2016]。
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
10
一般來說，隨時間變化的動態網路的視覺化方法有 Small MultiPiles 或是 Animation，一旦時間點過多使得資料量過於龐大，每個時間點的圖形便會變小，
導致使用者不好觀察每個時間點的差異程度。Small MultiPiles[Bach et al. 2015]提 出將每一個時間點的資料所形成的矩陣，進行相似度的分群，相似的時間點會被 分類到同一個群體中，群體中的時間點之間的差異性，相較於不同群體的時間點 比較起來較小。再透過時間軸把矩陣裡的資料變化呈現出來，如圖2.8。
圖2.8 Small MultiPiles，摘自[Bach et al. 2015]。
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
11
第三章
研究方法與步驟
在第三章的部分，我們將會介紹本論文的研究方法以及實作的步驟；首先第 一小節介紹整個系統的架構、流程以及視覺化設計理念，第二小節介紹Facebook 貼文的架構下具備的多種屬性，以及在時間遞移下的貼文組成結構；第三小節以 及第四小節將會介紹主要的視覺化設計以及呈現方法，最後第五小節針對本系統 所設計的互動機制進行介紹，並且能夠在視覺化的結果上能夠幫助使用者進行探 索以及分析。
3.1 系統架構
圖3.1 系統流程圖
整個系統流程分為三個部分，資料搜集、視覺化設計和呈現以及互動的機制。
在資料搜集的部分，使用者可以針對感興趣的粉絲專頁所發佈的貼文進行資料撈 取的動作，我們透過Facebook Developers 提供的 Facebook Graph API ，搭配上 Node.js 提供的 fbgraph 套件針對 Facebook 上的貼文資料進行撈取；撈取下來的 貼文資料包含該貼文的內容以及按讚、留言以及分享…等屬性，並且將撈取出來
‧
切割成多個時間區塊(Time Block)，縮小觀察範圍，讓使用者可以在一定時 間範圍內找出預期的現象。 個粉絲專頁進行一段時間的資料撈取，例如：Greenpeace 綠色和平(台灣網站)在 2016 年於 Facebook 上發佈的所有貼文。首先，在資料撈取的部分，我們利用本實驗室現有的Pagedata 進行資料的撈
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
13
取以及搜集；Pagedata 是透過 Facebook Graph API 針對 Facebook 上公開的貼文 進行資料的撈取，撈取的資料細節裡包含了貼文的內容、按讚數、留言數、分享 數、發佈時間以及留言內容，並且以表格的方式進行資料的呈現，如圖 3.2；同 時，我們也針對單一篇貼文的留言內容進行了表格化的呈現，如圖3.3。
Facebook 上的一篇貼文具備了多種屬性，根據 Facebook 提供給使用者的三 種主要的行為，按讚、留言以及分享，三者會因為 Facebook 使用者不同的行為 而導致了在Facebook 上每一篇貼文具有不同的特色。對於按讚(Like)總和來說，
為六種不同的情緒(Reaction)的加總，在深入可以了解到這篇貼文中六種不同情 緒個別的數量，分別有按讚、大心、哈哈、哇、傷心以及生氣；針對留言(Comment) 來說，一則留言底下可以有數篇的回應(Reply)。根據上述的分析，我們整理出一 篇在Facebook 上發布的貼文可以擁有按讚總數、六種情緒個別的數量、留言總 數、單一留言平均回應數、分享總數以及貼文內容字數共11 種屬性。
因此，我們將Facebook 的貼文結構視為一種具有多種維度的資料集；另外，
因為 Facebook 上的貼文內容與現實世界上發生的事件會有相互對應的情況也將 其視為一種具有時序性的資料集。所以，以表格方式進行資料呈現無法有效率的 看出資料伴隨著時間流動所產生的特性或是趨勢。
圖3.2 Pagedata：Facebook 粉絲專頁貼文撈取工具
‧ 國
立 政 治 大 學
‧
N a tio na
l C h engchi U ni ve rs it y
14
圖3.3 單一貼文之留言呈現工具
由於Pagedata 撈取下來的 Facebook 貼文資料是以一篇貼文為一個單位，而 我們希望可以得到 Facebook 粉絲專頁單日累積的貼文屬性，但同時又不會失去 每一篇貼文獨自的屬性；因此，我們將撈取下來的貼文資料依照其貼文發布時間 進行階層化的處理，初步分為三個階層，如圖 3.4。第一層為粉絲專頁，第二層 為撈取區間內的所有日期，第三層則為粉絲專頁於當日發布的所有貼文。由於粉 絲專頁不一定會每一天都發布貼文，所以會有第二層日期卻沒有第三層貼文的情 況產生。因此我們得到了以時間為主的階層化的貼文資料集，以提供粉絲專頁進 行視覺化的設計以及呈現。
由於Pagedata 撈取下來的 Facebook 貼文資料是以一篇貼文為一個單位，而 我們希望可以得到 Facebook 粉絲專頁單日累積的貼文屬性，但同時又不會失去 每一篇貼文獨自的屬性；因此，我們將撈取下來的貼文資料依照其貼文發布時間 進行階層化的處理，初步分為三個階層，如圖 3.4。第一層為粉絲專頁，第二層 為撈取區間內的所有日期，第三層則為粉絲專頁於當日發布的所有貼文。由於粉 絲專頁不一定會每一天都發布貼文，所以會有第二層日期卻沒有第三層貼文的情 況產生。因此我們得到了以時間為主的階層化的貼文資料集，以提供粉絲專頁進 行視覺化的設計以及呈現。