|
一張好圖勝過千言萬語,。如果可以使用簡單易懂的可視化圖表表達城市研究中各種復雜的對象和數據,，那將會極大地幫助人們更好的認識城市。但如何才能做出一張好圖,？如何表示四維以上的數據,？本期《城市科學文摘》介紹了一般數據的可視化，內容不僅包括柱狀圖,、散點圖等基本圖表,，也包括樹圖、?；鶊D等高級圖表,。本期文摘的大部分插圖及有關“簡潔”可視化的觀點來自于Stephen Thomas 的著作Data Visualization with JavaScript和d3js.org的示例展示。“When you consider the ultimate purpose of data visualization—helping users understand data—simplicity is one of the most important features of an effective visualization.”( “數據可視化的最終目標——是幫助用戶理解數據,，從這個意義上說，‘簡潔’是有效數據可視化的最重要的特征之一,?！?)——Data Visualization with JavaScript by Stephen A. ThomasBar Chart柱狀圖適用場合是二維數據集（每個數據點包括兩個值x和y），但只有一個維度需要比較,。柱狀圖利用柱子的高度,，反映資料的差異。肉眼對高度差異很敏感,，辨識效果非常好,。柱狀圖的局限在于只適用中小規(guī)模的數據集。通常來說,，柱狀圖的X軸是時間維,，用戶習慣性認為存在時間趨勢（圖1a）。如果遇到X軸不是時間維的情況,，建議用顏色區(qū)分每根柱子,，改變用戶對時間趨勢的關注。圖1b是英國足球聯賽某個年度各隊的贏球場數,，X軸代表不同球隊,，Y軸代表贏球數。Line Chart折線圖適合二維的大數據集,，尤其是那些趨勢比單個數據點更重要的場合,。還適合多個二維數據集的比較。圖2是兩個二維數據集（大氣CO2,，地表平均氣溫）的折線圖,。Pie Chart餅圖是一種應該避免使用的圖表，因為肉眼對面積大小不敏感。一般情況下,，總是應該用柱狀圖替代餅圖,。左側餅圖的五個色塊的面積排序，不容易看出來（圖3a),。換成柱狀圖就容易多了（圖3b),。一般情況下，總是應該用柱狀圖替代餅圖,。但是有一個例外,，就是反映某個部分占整體的比重，比如貧窮人口占總人口的百分比（圖3c）,。Scatter Chart散點圖適用于三維數據集,，但其中只有兩維需要比較。圖4a是各國的醫(yī)療支出與預期壽命,，三個維度分別為國家,、醫(yī)療支出、預期壽命,，只有后兩個維度需要比較,。為了識別第三維，可以為每個點加上文字標示,，或者不同顏色（圖4b）,。Bubble Chart氣泡圖是散點圖的一種變體，通過每個點的面積大小,，反映第三維,。因為肉眼對面積大小不敏感。氣泡圖只適用不要求精確辨識第三維的場合,。圖5a是卡特里娜颶風的路徑,，三個維度分別為經度、緯度,、強度,。點的面積越大，就代表強度越大,。如果為氣泡加上不同顏色（或文字卷標）,，氣泡圖就可用來表達四維數據。比如圖5b就是通過顏色,，表示每個點的風力等級,。我們前面講了二維、三維,、四維,，那么如果更高維度呢,？下面是邁阿密熱火隊首發(fā)的五名籃球選手的數據。除了姓名,，每個數據點有五個維度,，分別是得分、籃板,、助攻,、搶斷、封蓋,。 如何可視化成圖,？Radar Chart雷達圖適用于多維數據（四維以上），且每個維度必須可以排序（國籍就不可以排序）,。面積越大的數據點,，就表示越重要（圖6）。但是,，它有一個局限,，就是數據點不宜過多，否則無法辨別,，因此適用場合有限,。
下表是對基本圖表的一個總結。接下來介紹高級圖表,。 圖表類型 | 數據維度 | 注意事項 | 柱狀圖 | 二維 | 只需要比較其中一維 | | 折線圖 | 二維 | 適用于較大的數據集 | 餅圖 | 二維 | 只適用反映部分與整體的關系 | 散點圖 | 二維或三維 | 有兩個維度需要比較 | 氣泡圖 | 三維或四維 | 其中只有兩維能精確辨識，或者說氣泡面積不能精確辨識 | 雷達圖
| 四維以上 | 數據點建議不超過6個 |
Tree map樹圖使用方塊的大小和顏色表達每一個entity的至少兩個屬性的數據,。比如圖7中就顯示了美國各個州的人口數量和人口增長率,。可以發(fā)現加州,、德州都是人口大州,。Scatterplot Matrix散點陣列圖可以表達多個變量之間的關系。這里展出的圖8可以表達4個變量兩兩之間的關系,。圖8 Scatterplot Matrix [注釋3]Parallel Coordinates,。與Scatterplot Matrix的功能類似，Parallel Coordinates可以用來可視化多變量之間的關系,。圖9則表示了7個變量之間的關系,，圖中的每一條線代表了數據表中的一行數據（a single observation）。顯然,，如果在兩個變量之間的連線相互交叉的情況很多,，則表明這兩個變量是負相關的關系。圖9 Parallel Coordinates [注釋4]Sankey diagrams?；鶊D可以可視化網絡中節(jié)點之間的各種“流”,。圖10就表達了2050年英國能量生產和能力消耗的模擬結果,。圖左邊是能量供給，右邊是能量需求,，中間的節(jié)點則表達了能量在最終消耗之前是如何被轉化和傳輸的,。每個條帶的厚度表示了能量“流”的大小。圖10 Sankey diagrams [注釋3]Circos Chart圓圈上各個文字指的是美國的各種political action committee,，為所支持的國會公職候選人籌集資金的政治行動委員會（圖11）,。圓圈內的各個圓圈則是國會的議員，面積大小表現所募集資金的多少,，顏色表示黨派,。外圍圓圈以及圈外的文字則表示募集資金的來源。Arc Diagrams,。Arc Diagram使用弧線連接一維直線上不同節(jié)點來表達信息,。比如圖12就表達了美國因為槍殺而造成的損失。圖中每一條線代表一個人,，橙色部分表示這個人活著的時間,，灰色部分表示這個人因為被槍殺而失去的“歲月”。換句話說,，如果沒有被槍殺,，這個人可以繼續(xù)活灰色部分所表示的時間。Force-directed graph,。圖13表達了悲慘世界中各個角色共同出現的次數,，這樣可以立即定位主角或者核心人物。圖13 Force-directed graph [注釋3]Calendar chart日歷圖,。圖14表示的道瓊斯指數的日際,、月際、年際變化,。一般的折線圖只能表示單一時間尺度的數據,，比如日際、月際,、或者年際變化,。但這個日歷圖則把不同時間尺度的變化放到一起，并且以一種我們日常所常見的日歷的格式表現出來,。這一期對數據可視化類型的介紹到這里就基本講完了,。數據可視化在城市科學中還有很多其他有趣的話題，有機會將在以后的文章中與大家分享,。 文章的最新版本請參見原文鏈接,。 1. Thomas, S. A. (2015). Data Visualization with JavaScript. No Starch press. 2. 編者曾經在香港大學建筑學院城市規(guī)劃與設計系的“Peer Talk at New Urban Researcher Seminar Series”2015年系列講座中講過本期文摘的內容。3. Bostock, M. D3 Gallery. https://bost./mike/sankey/4. Heer, J., Bostock, M., Ogievetsky, V. A tour through the visualization zoo. http://homes.cs./~jheer/files/zoo/. 5. Periscopic. http://guns./?year=2013.香港大學城市規(guī)劃與設計系在讀博士生,、國際中國規(guī)劃學會(IACP)學生理事,，主要研究方向為空氣污染與居民心理健康,。他本科畢業(yè)于華東師范大學地理信息系統(tǒng)專業(yè)；碩士畢業(yè)于北京大學城市與區(qū)域規(guī)劃專業(yè),。他的個人主頁是http://web./~jzliu/,。他曾在香港大學建筑學院城市規(guī)劃與設計系“Peer Talk @ New Urban Researcher Seminar Series”2015年系列講座中介紹過本期文摘的內容,。
|
