|
 Protovis是一款免費(fèi)和開源的可視化的圖表工具，由斯坦福大學(xué)可視化組（Stanford University's Visualization Group）的 Mike Bostock and Jeff Heer 開發(fā)，基于JavaScript 和 SVG （Scalable Vector Graphics，可伸縮向量圖形）技術(shù)。
尤為值得一提的是，其“Examples”一欄為我們提供了超過60多個精彩的案例，即使我們不會使用此工具進(jìn)行數(shù)據(jù)視覺化處理，這些案例本身的風(fēng)格和思路也是值得學(xué)習(xí)的，它可以為我們使用其它工具繪制圖表提供很好的借鑒。小博“圖表匯”特意將其整理出來，推薦給大家，一起學(xué)習(xí)！
1、常規(guī)圖表（Conventional）
Protovis通過使用例如條形及點(diǎn)等簡單標(biāo)記將自定義數(shù)據(jù)視圖組合起來，創(chuàng)建標(biāo)準(zhǔn)化的圖表。與一般繪圖庫不同， Protovis不會顯得太過單調(diào)，它可以通過動態(tài)屬性定義標(biāo)記。這些屬性通過對數(shù)據(jù)編碼，繼承，形變及布局以簡化結(jié)構(gòu)。
包括：（1）面積圖（Area Chart）；（2）條形圖和柱形圖（Bar & Column Charts）；（3）散點(diǎn)圖（Scatterplots）；（4）餅圖和圓環(huán)圖（Pie & Donut Charts）；（5）階梯線圖表（Line & Step Charts）；（6）堆疊面積圖（Stacked Charts）；（7）分組圖表（Grouped Charts）。
2、自定義圖表（Custom）
?。?）安德森鳶尾花卉數(shù)據(jù)集散布圖（Anderson's Iris data set），也稱鳶尾花卉數(shù)據(jù)集（Iris flower data set）或費(fèi)雪鳶尾花卉數(shù)據(jù)集（Fisher's Iris data set），是一類多重變量分析的數(shù)據(jù)集。它最初是埃德加·安德森（Edgar Anderson）從加拿大加斯帕半島（Gaspé Peninsula）上的鳶尾屬花朵中提取的地理變異數(shù)據(jù)，后由羅納德·費(fèi)雪（Sir Ronald Aylmer Fisher）作為判別分析的一個例子，運(yùn)用到統(tǒng)計(jì)學(xué)中。
其數(shù)據(jù)集包含了50個樣本，都屬于鳶尾屬下的三個亞屬，分別是山鳶尾（Iris setosa）、變色鳶尾（Iris versicolor）和維吉尼亞鳶尾（Iris virginica）。四個特征被用作樣本的定量分析，它們分別是花萼和花瓣的長度和寬度?；谶@四個特征的集合，費(fèi)雪發(fā)展了一個線性判別分析以確定其屬種。
?。?）貝克爾格子圖（Becker's Barley，Trellis display），這張圖表應(yīng)該算是“滑珠圖”（Excelpro的圖表博客）的原型圖，比較有名的改進(jìn)版為“Obama vs. McCain美國大選”的“滑珠圖”。
?。?）（Bertin's Hotel），這張圖的作者是圖形學(xué)理論的創(chuàng)始人Jacques Bertin，用來描述旅店客流量的季節(jié)性變化。
?。?）（Streamgraphs），由堆積面積圖（Stacked Charts）演變而來，區(qū)別在于其基線不是固定的。
 （5）波形圖（Sparklines），是一種文字大小數(shù)據(jù)視覺化圖形，如下圖紅框所示。
?。?）子彈圖（Bullet Charts），由Stephen Few設(shè)計(jì)，“在有限的空間內(nèi)表達(dá)豐富的數(shù)據(jù)信息”（有點(diǎn)高密小型化的意思，呵呵），從條形圖發(fā)展變化而來。一般由文字標(biāo)簽和主體條柱、刻度量表、主要標(biāo)記標(biāo)識、用于對比的標(biāo)識（可選）、定性范圍標(biāo)識構(gòu)成。
（7）氣泡圖（Bubble Charts），氣泡圖作為散點(diǎn)圖的一種變體，雖然從視知覺的角度看沒有條形圖表達(dá)的精準(zhǔn)，但是它可以在有限的空間內(nèi)展示大量的信息，這種形式也常用在數(shù)據(jù)地圖中。
?。?span lang="EN-US" xml:lang="EN-US">8）地平線圖（Horizon Graphs），基于一種壓縮空間展示數(shù)據(jù)信息的圖表形式，具體繪制原理可參考下圖。
 
（9）K線圖（Candlestick Charts），起源于日本十八世紀(jì)德川幕府時代（1603～1867年）的米市交易，用來計(jì)算米價每天的漲跌?，F(xiàn)已經(jīng)廣泛應(yīng)用于股票、期貨、外匯，期權(quán)等證券市場。
（10）Burtin抗生素圖 （Burtin’s Antibiotics），第二次世界大戰(zhàn)之后，抗生素被冠以“特效藥”的美名。在此基礎(chǔ)上收集了幾中抗生素治療的效果，繪制了此圖。
?。?1）南丁格爾玫瑰圖（Nightingale's Rose），或稱之為“不等徑扇區(qū)圖”。
?。?2）波雷費(fèi)小麥圖（Playfair's Wheat），這是1822年P(guān)layfair為國會制作的一幅精致圖表，描繪了250年來的小麥價格走勢圖。
?。?3）汽油里程圖（Gas & Driving），這張圖表最早來源于2010年5月2日《New York Times》的一篇文章“Driving Shifts Into Reverse”，用來分析油價與年人均里程數(shù)的關(guān)系，使用方式路線圖的方式表達(dá)，形象易懂。
（14） 西雅圖天氣預(yù)報(bào)圖（Seattle Weather），此圖為西雅圖一周的天氣預(yù)報(bào)，包含了豐富的信息，包括以往的、正常的、真實(shí)的和氣溫預(yù)報(bào)的數(shù)據(jù)范圍。有點(diǎn)類似于K線圖和了彈圖。
?。?5） 加州火車時刻表（Marey's Trains），這張圖表是E. J. Marey重繪另一種風(fēng)格的加州火車時刻表，站臺按地理里程距離按垂直比例排列，斜線表示火車的速度，另外還將普快，快速，高速列車的信息用不同顏色區(qū)別開來，與原版時刻表對比一下，是不是很新穎易讀呢。
?。?6）（Stemplots），接上圖，另一種風(fēng)格的加洲火車時刻表，你看懂了嗎？ （17）歸并排序（Merge Sort），使用角度的變化來表達(dá)信息，還可以通過不同線條的顏色來表達(dá)更為豐富的信息。見下圖第二幅。
3、交互圖表（Interaction）
可視化圖表不僅僅是靜態(tài)的，圖表的交互性使其具有更強(qiáng)大的功能和視覺表現(xiàn)力。
?。?） 索引圖表（Index Charts），某些情況下，數(shù)據(jù)源的真實(shí)值可能沒有它的變化趨勢那么重要。比如對于投資者來說，一支股票的價值變化趨勢比它的價格要重要的多。所以下圖所示的縱坐標(biāo)由真值轉(zhuǎn)為百分比，方便投資者對比多支股票的價格變化趨勢。
?。?）平行坐標(biāo)圖（Parallel Coordinates），可以快速查詢一個單元的多個屬性，并與其它單元進(jìn)行對比。
?。?）工作導(dǎo)航圖（Job Voyager），一個信息單元包含某職業(yè)在某年份所占的比例，以及男女性別比例構(gòu)成等信息，在一個平面圖內(nèi)即展示大量的交互信息。紅色為女性，藍(lán)色為男性。
?。?）明尼蘇達(dá)職業(yè)信息表（Minnesota Employment），另一種平行坐標(biāo)圖，一個單元格內(nèi)，即是一張某職業(yè)的數(shù)據(jù)量豐富的面積圖；而整張圖表又是將各種不同的職業(yè)圖表組合在一起，形成一個動態(tài)數(shù)據(jù)庫。
?。?）全局與局部圖（Focus + Context），包括一張總圖和局部放大圖，這種布局在很多行業(yè)分析軟件都有成熟的應(yīng)用。
（6）（Pan + Zoom），可以通過鼠標(biāo)中輪對數(shù)據(jù)面板進(jìn)行縮放處理，橫-縱坐標(biāo)的刻度也隨之變化。
?。?）（Brush + Link），一個交互版的安德森鳶尾花卉數(shù)據(jù)集散布圖。
?。?）工具提示（Tooltips），
?。?）（Pointing），與之前的散點(diǎn)圖相似。
（10）曲線編輯器（Spline Editor），可單擊空白區(qū)域添加節(jié)點(diǎn)，Delete鍵則刪除節(jié)點(diǎn)。節(jié)點(diǎn)的控制點(diǎn)有多種形式可以選擇。
（11）氣泡圖（Bubbles），很有動感的韻律。
?。?2）眼圖（Eyes），使用與上圖相似的技術(shù)。
4、層級關(guān)系圖表（Hierarchies）
?。?）系統(tǒng)樹圖（Dendrograms）。
?。?）太陽輻射圖（Sunbursts），一種圓環(huán)鑲接圖，可以表達(dá)清晰的層級和歸屬關(guān)系。
（3） 冰柱圖（Icicles）。
?。?）縮進(jìn)樹（Indented Trees）。
?。?）圓形裝填（Circle Packing）， 通過圓圈的大小和歸屬表達(dá)明確的層級關(guān)系。
?。?）節(jié)點(diǎn)樹（Node-Link Trees）。
?。?）樹狀圖（Treemaps）。
5、網(wǎng)絡(luò)關(guān)系圖（Networks）
?。?）弧狀圖（Arc Diagrams），是一種一維布局圖，通過圓弧的兩端表達(dá)連接關(guān)系。
?。?）力導(dǎo)向布局圖（Force-Directed Layouts），當(dāng)拉動一個節(jié)點(diǎn)時，其它節(jié)點(diǎn)也隨之被吸引到相同的方向。
?。?）矩陣圖 （Matrix Diagrams），
6、數(shù)據(jù)地圖（Maps）
（1）（Minard's Napoleon），Charles Minard繪制的拿破侖進(jìn)軍俄國的人員損失圖。
?。?）奧克蘭犯罪地圖（Oakland Crimespotting），使用“Google Maps API”繪制。
（3）地區(qū)分布圖（Choropleth Maps），使用不同的顏色表示不同的數(shù)據(jù)范圍。
?。?）符號圖（Symbol Maps），
?。?）（Dorling Cartograms），將傳統(tǒng)的數(shù)據(jù)地圖背底隱去，只保留關(guān)鍵數(shù)據(jù)。
（6）地圖投影（Map Projections），
?。?）熱圖（Heatmaps），
?。?）（Dymaxion Map），
8、統(tǒng)計(jì)圖（Statistics）
?。?）P-P圖（Q-Q Plots）
（2）箱線圖（Box-and-Whisker Plots）
?。?）柱狀圖（Histograms）
?。?）誤差線圖（Error Bars）
?。?）（Mean & Deviation），08/09賽季，NBA場均比賽的50強(qiáng)得分手。
9、藝術(shù)圖表（Art）
并非所有的信息圖表都需要以數(shù)據(jù)來支撐，有時候以圖表呈現(xiàn)出來的藝術(shù)美感和娛樂氛圍也會給我們帶來深刻的視覺享受。
?。?）康威生命游戲（Conway's Game of Life）
（2）（Automaton Explorer）
?。?）（Belousov–Zhabotinsky）
?。?）（N-Body Problem）
?。?）（PolarClock）
?。?）彩虹蠕蟲（Rainbow Worm）
原文連接：http://vis./protovis/ex/
翻譯整理： “圖表匯”
|
