定義
借助視覺的表達(dá)方式，將數(shù)據(jù)用有趣、淺顯、直觀形式去傳達(dá)給觀眾的一種手段。生成物是信息圖標(biāo)，由信息和圖形組成（Inforgraphics）
最初是紙媒上刊登，目的是幫助人們理解新聞信息的視覺化內(nèi)容。
分類
六大類：圖解（Diagram）、圖表（Chart）、表格（Table）、統(tǒng)計圖（Graph）、地圖（Map）、圖形符號（Picgram）
01.圖解-用插圖對事物進(jìn)行說明
02.圖表-用圖形、線段、插圖等闡述事物的相互關(guān)系，簡化對大量數(shù)據(jù)之間的理解。
用戶通常理解圖表會比理解數(shù)據(jù)快。圖解和圖表的區(qū)別在于前者是用可視化的手段去傳遞信息，圖表使闡述信息之間的關(guān)系。例：流程圖
03.表格-根據(jù)特定的信息標(biāo)準(zhǔn)進(jìn)行區(qū)分，設(shè)置縱軸和橫軸
04.統(tǒng)計圖-通過數(shù)值來表現(xiàn)變化趨勢或者進(jìn)行比較。
05.地圖-描述在特定區(qū)域和空間里的位置關(guān)系
將真實的世界轉(zhuǎn)換為平面，無論在哪種信息地圖，最重要的是讓用戶找到想到要看到的信息。
展示形式包括：將整個區(qū)域的布局或結(jié)構(gòu)完整呈現(xiàn)的地圖；將特定對象突出顯示的地圖。
06.圖形符號-不使用文字，直接用icon傳達(dá)信息
通過用易于用戶理解、與人直覺相符的圖形傳達(dá)信息的一種形式，比如限速標(biāo)識，人們會約定俗稱的用一些符號來代表一些固定的意思。比如男女廁所，不要超出用戶常見的理解范圍。奧運會中圖形符號的應(yīng)用計圖
四個步驟：明確目的、選擇圖標(biāo)、視覺設(shè)計、突出信息
1.明確目的
明確數(shù)據(jù)可視化的目標(biāo),通過可視化展現(xiàn)要解決什么問題，需要探索什么內(nèi)容或陳述什么事實，并選擇合適的圖表。擬定好的圖標(biāo)標(biāo)題，使用戶產(chǎn)生閱讀圖表的興趣。
注意：對于靜態(tài)的數(shù)據(jù)來說，標(biāo)題應(yīng)該是一個結(jié)論，而不是對圖標(biāo)展示內(nèi)容的概括。
2.選擇圖表
Andrew Abela將所有統(tǒng)計圖通過“你想展示什么”分成了四大類：比較、聯(lián)系、分布、構(gòu)成。
常用的六種圖標(biāo)：柱狀圖、條形圖、折線圖、餅圖、散點圖、地圖
選擇合適的圖表需要先對數(shù)據(jù)組的數(shù)量進(jìn)行分類。
a.當(dāng)僅有一組數(shù)據(jù)
標(biāo)簽（Lable）：含有數(shù)據(jù)的標(biāo)簽
進(jìn)度圈圖（Progress Doughnut Chart）
折線/面積圖（Line/Area Chart）
直方圖/密度圖（Histogram/Density Plot）
顯示相同類型的數(shù)據(jù)。直方圖使用以等間隔分布的列，而密度圖具有連續(xù)的曲線。
時間線（Timelines）
用于說明按日期排列的一組事件。垂直時間軸便于移動/滾動
b.2組數(shù)據(jù)類別
強調(diào)數(shù)據(jù)的團(tuán)體關(guān)系
韋恩圖（Venn Diagram）
不是UI中顯示數(shù)據(jù)的一種流行的方式，但通常用于信息圖表設(shè)計。用字啊顯示重疊區(qū)域或突出顯示兩組數(shù)據(jù)內(nèi)容的差異及重疊性。
直方圖/密度圖（Histogram/Density Plot）
如果要在一處顯示多個直方圖，則可以使用“密度圖”。用這種圖表來顯示兩個變量如何相交。
強調(diào)數(shù)據(jù)之間的比較
條形圖（Bar Chart）
用于顯示兩個（或多個）變量之間的差異。
折線圖（Line Chart）
用于顯示變化在X軸上的定量值，比較隨時間變化的兩個值。
面積圖（Area Chart）
比較兩個或多個不同的數(shù)據(jù)集。
強調(diào)數(shù)據(jù)之間的比例大小
餅圖（Pie Chart）&環(huán)形圖（Dougnut Chat）
c.多組數(shù)據(jù)類別
表格（table）
顯示任何數(shù)據(jù)的好辦法，尤其是具有大量變量的數(shù)據(jù)集。
強調(diào)大量數(shù)據(jù)間的比較
條形圖（Bar Chat）&多組條形圖（Multiset bar chart）
用來將兩個或多個數(shù)據(jù)系列并排并按類別分組在一起，置于同一軸上。
線型圖
類似兩個變量的折線圖，曲線和面積也可以應(yīng)用與折線圖
強調(diào)多組數(shù)據(jù)間的相關(guān)性：此類別的三個圖表通常在實踐中很少用于UX項目作為顯示圖表，因為它的易讀性較弱，縮放后很難閱讀。
散點圖（scatterplot）
用于顯示大量元素，將彼此進(jìn)行比較，并發(fā)現(xiàn)與主要趨勢不同的元素。
氣泡圖（bubble chart）
散點圖再多增加變量。
馬賽克圖（mosaic plot）
使用兩個軸的圖，兩個軸具有百分比比例的變量，像一個矩形分成多種碎片
強調(diào)多組數(shù)據(jù)間的比例
餅圖&環(huán)形圖
堆積條形圖（stacked bar graph）
用于顯示如何將較大的類別劃分為較小的類別，以及各個部分與總量的關(guān)系。
地圖（map）
與地理相關(guān)的數(shù)據(jù)
其他圖表類型：這組的大多數(shù)無法根據(jù)移動設(shè)備的大小進(jìn)行擴展
樹形圖（tree chart）
用于顯示元素之間的層次結(jié)構(gòu)和關(guān)系。在交互式系統(tǒng)中，必須垂直和水平滾動。這類圖中很難使用標(biāo)題。
雷達(dá)圖（radar chart）
缺點在于由于名義上是獨立的，所以軸表示的比例大不相同。
和弦圖（chord diagram）
缺點是存在對各交叉點，很難讀取。另外，圖形區(qū)域占用了大量空間，組簽名排列成一個圓圈。這意味著很難將標(biāo)簽移動到圖表之外。
平行組Parallel sets（桑葚圖Sankey chart）
缺點是存在重疊區(qū)域的問題，但由于用戶被迫水平滾動，較長的寬度也會造成問題。
鏡像條形圖（radial bar chart）
缺點在于由于不同的弧度，因此盡管他們代表相同的值，外側(cè)的長條看起來比其他長。
森波斯特圖（sunburst）
具有許多按組劃分的環(huán)，這些環(huán)構(gòu)成扇區(qū)。缺點是在顯示小標(biāo)題時存在問題，易讀性較弱。
晶須圖（whisker plots）
缺點是復(fù)雜，難以理解
燭臺圖（candlestick chart）
用于交易工具來處理價格走勢，衍生工具，貨幣，股票，債券，商品等。
矩陣熱圖（matric heatmap）
缺點是通過表格查找方法分析矩陣熱圖中的數(shù)據(jù)通常是不可行的，因為不可能以足夠的精度推算出與給定顏色相對應(yīng)的數(shù)值。此外，數(shù)據(jù)不是以顯示趨勢的方式聚類的。
3.視覺設(shè)計
a.注意：配色方案的包容性，包容正常模式、紅綠色盲模式、灰度模式。色盲人士難以閱讀低包容性的可視化圖標(biāo)
b.注意：足夠多的顏色種類，至少需要六種顏色的調(diào)色板來進(jìn)行設(shè)計，靈活應(yīng)對圖表中的復(fù)雜信息層級。
4.突出信息
a.重要的內(nèi)容用顏色做區(qū)分。特殊處理包括：添加輔助線，更改顏色，線條粗線等方式，加大與其他數(shù)據(jù)的對比，來引起用戶注意，表明觀點。
b.把不重要的內(nèi)容變?yōu)榛疑?br>
降低層級可以改變顏色對比度，通常用灰色標(biāo)記未被選中的元素或背景。為重要的數(shù)據(jù)點做對比的數(shù)據(jù)。
d.添加必要的輔助說明
對圖表進(jìn)行特殊處理，包括做一些突出某些信息的標(biāo)注
e.添加必要的輔助線
針對柱狀圖和折線圖，當(dāng)呈現(xiàn)變化可以添加輔助線直觀體現(xiàn)
圖標(biāo)制作規(guī)則
1.通用規(guī)則
a.圖標(biāo)線條：有無刻度線。
當(dāng)數(shù)據(jù)數(shù)值非常重要，需要使用刻度線來讓用戶清楚了解數(shù)據(jù)
刻度線的顏色
刻度線屬于背景的一部分，顯示層級要低。不要使用全黑或全白的線條，可以用灰色的點狀線或虛線代替實線。
坐標(biāo)線
坐標(biāo)線應(yīng)該比刻度線，線條更粗，顏色更深，才能讓整個圖表主次區(qū)分
b.選擇合適的坐標(biāo)上下限
下限不設(shè)置為0，可以讓柱狀圖在視覺表現(xiàn)上形成強烈對比，用戶將會感受到不正確的比例關(guān)系。
注意：在觀察柱狀圖的高低趨勢往往不能得出正確結(jié)論，要配合坐標(biāo)軸起始位置來看。
選擇合適的坐標(biāo)上限，如果為了比較各個數(shù)值的數(shù)據(jù)，可以用數(shù)據(jù)的最大值作為坐標(biāo)軸上限。如果需要將數(shù)據(jù)與某個最大值比較，則用此最大值作為上限。
c.刻度值
間隔均勻，如0，5，10，1，20
注意不要使用非水平和豎直的文字標(biāo)注，也不要轉(zhuǎn)行。數(shù)據(jù)可視化的第一要義是簡單易懂，在遇到標(biāo)簽文字過長（國家）可以采取橫向排列等方式處理。
d.數(shù)據(jù)的處理與排列
在繪制圖表前對數(shù)據(jù)進(jìn)行排序，而不是隨機排布。這樣可以在圖表中展示更多信息，即某個數(shù)據(jù)在總的數(shù)據(jù)庫里面的排序。
大小排序
刻意排序，把對比的數(shù)據(jù)從高到低先排序。把數(shù)據(jù)最高的和最低的項單獨放置，并給與特殊顏色單獨顯示。把兩個數(shù)據(jù)放置在最后，再次突出對比，吸引觀眾注意。
e.關(guān)于圖例的設(shè)計
數(shù)字需要四舍五入，數(shù)字取整，讓用戶感受數(shù)據(jù)的概念而非具體數(shù)值。
標(biāo)記圖例的邊界比標(biāo)記圖例的范圍更好，多種顏色做區(qū)分，邊界會提高用戶的閱讀效率。
水平或者豎直方向的圖例。對于數(shù)字刻度，水平更容易閱讀。
但是對于有類別區(qū)分的圖例說，垂直圖例往往效果更好，因為可以右側(cè)放置更長的文本
可以刪除內(nèi)部邊界，只想表達(dá)一個漸進(jìn)的過程，可以嘗試只標(biāo)記圖例的最大值和最小值。
f.圖表上的文字信息，不是用來填充空白，而是強調(diào)相關(guān)信息或拓展額外的背景知識。
最好在圖表中引用消息來源，放置在左下角，采用特殊字體。隨時檢引數(shù)據(jù)來源，增加數(shù)據(jù)的可信度。
用數(shù)字輔助表達(dá)，在圖表中標(biāo)出數(shù)據(jù)值。通常對不太嚴(yán)謹(jǐn)?shù)膱D標(biāo)，我們會對數(shù)據(jù)值進(jìn)行一定程度的處理。
1.小數(shù)的值四舍五入(234.19-234)、
2.在數(shù)據(jù)量非常大時，將一定位數(shù)數(shù)字取整（52,133-52,000）、
3.當(dāng)所有數(shù)據(jù)的量都非常大，將一定位數(shù)的數(shù)字縮進(jìn)單位中（元-億元）、
4.Y軸刻度值盡量轉(zhuǎn)換為千位分隔符，如K，M，B、
5.Y軸最大值取值要恰當(dāng)，保證圖標(biāo)占據(jù)2/3以上
6.使用帶有表格數(shù)字的字體，小數(shù)點需要對齊
g.控制字體的數(shù)量
注意：跳出定式思維，對于字體大小和粗細(xì)外，顏色和透明度同樣可以區(qū)分頁面層級。
2.柱狀圖的制作規(guī)范
注意：更寬的柱子以及窄間距會給人更有力量和保障的感覺
更窄的柱子及更寬的間距會給人更細(xì)膩和高端的感覺
b.盡量不超過7個值
數(shù)據(jù)比較，柱狀圖建議不超過5個數(shù)據(jù)值，條形圖不超過7個數(shù)據(jù)值。
3.折線圖的制作規(guī)范
注意：什么時候用折線圖？
一種數(shù)據(jù)在不同時間下的數(shù)據(jù)值之間的比較，統(tǒng)計結(jié)果的趨勢變化是有意義的時候。
有時候按照時間推進(jìn)的數(shù)據(jù)并不能總用折線圖來表示，需要做一些區(qū)分。比如美國大規(guī)模事件傷亡人數(shù)隨時間推移的圖表，因為本質(zhì)沒有關(guān)系，要用條形圖。而按年份對傷亡人數(shù)進(jìn)行統(tǒng)計，可以使用折線圖。還是看得到的趨勢有無意義
b.把鋸齒狀的線條變平滑。如果上下浮動過于劇烈，那么拉長時間間隔，比如把x軸天數(shù)換成周為單位。鋸齒狀的線條不易閱讀。
c.在折線圖中繪制數(shù)據(jù)點
只有特定數(shù)值特別重要的時候再標(biāo)出來，不然大量的數(shù)據(jù)點會讓界面混亂。
4.餅圖制作規(guī)范
上圖很難去比較兩塊內(nèi)容所占比例的大小，尤其是餅圖變形中，我們直覺更習(xí)慣從面積上而非角度上來判斷。
但是餅圖在強調(diào)構(gòu)成而非比較。在強調(diào)個人與總體的比例關(guān)系方面還是有優(yōu)勢。
避免過度區(qū)分割餅圖，否則會導(dǎo)致無法閱讀。如果很難區(qū)分其中一塊扇形是另一個的2倍大小，可以把較小類歸入到更大的“其他模塊”。參考最大不超過9個，超過建議用條形圖來展示。
c.餅圖的起始位置，一般遵循用戶的閱讀習(xí)慣，從12點開始制作
d.餅圖的順序，先對數(shù)據(jù)進(jìn)行排序處理，一般按從大到小的數(shù)據(jù)排序。但當(dāng)數(shù)據(jù)中包含一個類別“其他”時，無論其他內(nèi)容占比多少，都需要放置在餅圖的最后來展示。
e.切割方式：可以將同一個餅圖進(jìn)行拆解設(shè)計，將他們設(shè)置為同一起點，可以清晰對比出數(shù)據(jù)的大小。
5.散點圖的制作規(guī)范
b.盡量為散點圖添加趨勢線?？梢愿玫刈層脩舾惺軘?shù)據(jù)的變化，人們不愿意接受未處理的數(shù)據(jù)，往往傾向于接受已經(jīng)被處理好的數(shù)據(jù)結(jié)果
6.面積圖的制作規(guī)范
又叫區(qū)域圖，與折線圖很相近，都可以用來展示隨時間的推移數(shù)據(jù)變化的趨勢。區(qū)別在于面積圖在折現(xiàn)于類別數(shù)據(jù)的X軸之間填充顏色或者紋理，形成一個面表示數(shù)據(jù)體積。相對于折現(xiàn)而言，被填充的區(qū)域可以更好的引起人們對總值趨勢的注意，所以面積圖主要用于傳達(dá)趨勢的大小，而非確切的單個數(shù)據(jù)值。
b.不要超過四個類別。面積圖只適合展現(xiàn)少量數(shù)據(jù)
