如何將枯燥的大數據呈現為可視化的圖和動畫?

在看TED以及很多國外分享的視頻中,會看到許多將大數據轉化成視覺信息的案例。
比如下圖,來看到Youtube上關於各個話題的討論數量和類別以及各個話題的相互關係程度,來按圖的方式呈現。這樣的圖背後有很多的數據和邏輯,但是炫酷的可視化的圖對於把思想傳遞給大眾又是至關重要的。

這類例子還有很多,比如BIG DATA裡面提到的,抓取全美航空公司的航班表,製作出航線的動畫,製作出各個城市的Facebook聯繫程度。非常直觀震撼。
因此,就很想了解,如何將大量數據整理成上述這樣的可視化的圖?
是否有一些技巧?有哪些軟體可以達到這樣的效果?
求解答!


在回答之前,先簡單的介紹我自己,我是澎湃新聞美數課(數據新聞)欄目的課代表,擅長做數據可視化視頻和信息圖。

喂喂喂!憋看到我這個身份,就跑啊,下面有一噸實用乾貨等你~~~

前段時間做了一個關於諾貝爾人才流動的題,包含了可視化視頻和信息圖,所以用這個選題,來分享一些製作過程以及工具使用,希望能夠幫助到題主和其他和對這方面感興趣的知友。

先丟個鏈接一分鐘看百年諾獎人才流動:哪些國家是最強的人才孵化地?

主題:諾貝爾獲獎者的流動

我們想表現的就是諾貝爾獲獎者出生地與獲獎時的居住地的變化,所以想到流線地圖的方式,用地圖直觀的看到某些時間段內人才流動的變化。

數據:如何收集這個數據?

對於這個案例,毫無疑問的數據來源是諾貝爾獎的官網,上面有最詳細的獲獎者信息。

對於其他的選題,首選與主題相關的權威官網。

我們用Import.io工具抓了871條關於諾貝爾獎歷年來的獲獎者信息。

因為最終效果要在地圖上呈現,在源數據的基礎上,表格里還加入了國家的地理坐標,方便下一步的軟體操作。

工具:這是用什麼做的?

最終視頻=Processing+Ocam+Adobe Premiere+Adobe
effect

一個正經的小視頻居然還用到這麼多工具?!

那我們用這些工具分別幹了什麼?

① Processing

本次視頻的流線地圖效果的重要支持軟體!!

我們的編輯寫了298行代碼,去表現諾獎人才流動的變化。

其實Processing也可以直接導出每一幀圖片,但為了更好地和AE對接,所以選擇了錄屏軟體,靈活性更大。

下面是編輯有話要說:

(被抓過來強行說兩句,那我就)簡單粗暴的安利一下Processing。

1.Processing是具有設計背景的團隊,為腦迴路完全不一樣的設計師們或者代碼苦手等麻瓜(喂)人群打造的交互編程語言,上手容易,邏輯就跟使用AI一樣,特別順暢(....至少剛開始是這樣啊喂!)。

2. 對從沒接觸過編程的人來說,Processing會是個好開始,不光是學習Processing,你可以通過學習Processing接觸何為編程,理解編程的邏輯,進而接觸其他編程語言,這也是Processing創始人的初衷之一。

3.氣質不一樣。恩這點有些玄乎...我把這歸結為因為Processing沒有封裝一些常用的數據可視化形式,導致能發揮的自由度更高,形式更奇葩多樣,可以丑到沒下限,也可以很美。設計師背景也會讓氣質不一樣,類似同樣由設計師背景團隊打造的raw,是DensityDesign實驗室的產品,你只要打開DensityDesign的主頁可能就明白為什麼我說氣質不一樣..大概。

當然無論是Processing還是d3.js,chart.js...或是AI,都只是工具而已,能用到什麼程度,還是看使用它的人。數據可視化並不是Processing的核心,Processing可以被叫做創意編程語言,那種感覺就好像它已經從設計師跳脫到藝術家了......很多藝術家都使用processing創造自己的作品。甩個接地氣的例子,日本女子組合Perfume有個國際推廣的項目perfume global website,她們幾場看起來各種酷炫的黑科技演唱會都有Processing的一份功勞哦。

廢話一不小心就這麼多,重要的是,你還不和我一起跳入processing的大坑啊呸知識的海洋么!

②Ocam

一款錄屏軟體,用它來錄製我們的小視頻。

③Adobe Effect和Adobe Premiere

用於錄製視頻的剪輯合成和其他效果的添加。

除了視頻,我們還做了兩張氣質不一樣的信息圖,就是我們的編輯推薦的RAW。

RAW是基於D3.js的開源工具,不用代碼,只需要導入數據,設置一些條件就可快速生成,而且可以導出矢量的圖表!

第一步:導入數據

複製excel表裡的數據到Raw里,

第二步:選擇圖表模式

以環形信息圖做案例,我們選擇Circular Dondrogram。

第三步:選擇條件生成效果圖

拖拽左邊的條件到右邊呈現的項目,右邊的排序會影響最後生成的結構,生成的效果也會根據你的詞條實時更新。

嗯,感覺有了,但作為一名美數課代表。這效果怎麼可以直接發送給我可愛的班主任?

所以先丟給AI,丟給神奇的AI。(噢,這裡AI泛指Adobe Illustrator,不是Artificial Intelligence)

第四步:導出svg,AI中修改,發給班主任,交稿,下班。

題主還有一個疑問:有什麼技巧?

數據可視化的方式和工具有很多:

有人說,「」可視化的很多工具都是一個大坑。「

本課代表否認,「這哪是坑,明明是黑洞!!!洞!!」

按你喂,掌握你所需,然後不斷的練習,用合適的方式清楚地表達準確的信息。

最後再補充幾個我們做的數據可視化的視頻

數據解釋性視頻

紀錄的誕生①|數說百年奧運:人類的極限在哪裡?紀錄的誕生②|基因的秘密:偉大的運動員是上天鑄造的嗎?

動畫視頻

動畫深扒|遙遠太平洋上的厄爾尼諾為什麼會帶來洪水?

Excel-Powermap製作的可視化視頻

數說摩天大樓①|80年來,世界第一高樓長高了510米

想要哪個視頻解析,我一定會在課後時間回答你們的。

最後,好不容易寫了個大回答,我需要你們的鼓勵啊~

這個月的雞腿還得靠你們~


目前有很多工具,在線就可以完成!這裡有一些感覺還不錯的可視化工具,可以看一下:

1、Tableau

Tableau 是一款企業級的大數據可視化工具。Tableau 可以讓你輕鬆創建圖形,表格和地圖。 它不僅提供了PC桌面版,還提供了伺服器解決方案,可以讓您在線生成可視化報告。伺服器解決方案可以提供了雲託管服務。Tableau的客戶包括巴克萊銀行,Pandora和Citrix等企業。

2、ChartBlocks

ChartBlocks是一個易於使用在線工具,它無需編碼,便能從電子表格,資料庫中構建可視化圖表。整個過程可以在圖表嚮導的指導下完成。您的圖表將在HTML5的框架下使用強大的JavaScript庫D3.js創建圖表。你的圖表是響應式的,並且可以和任何的屏幕尺寸及設備兼容。 您還可以將圖表嵌入任何網頁中,分享在Twitter和Facebook上。

3、Datawrapper

Datawrapper是一款專註於新聞和出版的可視化工具。華盛頓郵報,衛報,華爾街日報和Twitter等媒體都使用了這一工具。Datawrapper非常容易使用,不需要任何編程基礎。你只需要上傳你的數據,便能輕鬆地創建和發布圖表,甚至是地圖。Datawrapper提供了眾多的自定義布局及地圖模板。

4、Plotly

Plotly幫助你在短短几分鐘內,從簡單的電子表格中開始創建漂亮的圖表。Plotly已經為谷歌、美國空軍和紐約大學等機構所使用。 Plotly是一個非常人性化的網路工具,讓你在幾分鐘內啟動。如果你的團隊希望為JavaScript和Python等編程語言提供一個API介面的話,Plotly是一款非常人性化的工具。

5、 RAW

RAW彌補了很多工具在電子表格和矢量圖形(SVG)之間的缺失環節。你的大數據可以來自MicrosoftExcel中,谷歌文檔或是一個簡單的逗號分隔的列表。它最厲害的功能是可以很容易地導出可視化結果,因為它和Adobe Illustrator,Sketch 和Inkscape是相容的。

6、http://Visual.ly

http://Visual.ly是一個可視化的內容服務。它提供專門的大數據可視化的服務,用戶包括了VISA,耐克,Twitter,福特和國家地理等。如果你想完全外包可視化文件給第三方。你可以使用非常簡化的在線流程:你只需描述你的項目,服務團隊將在項目的整個持續時間內和你在一起。 http://Visual.ly給您發送所有項目關鍵點的郵件通知,也將讓你不斷給出反饋。

7. D3.js

毋容置疑D3.js是最好的數據可視化工具庫。D3.js運行在JavaScript上,並使用HTML,CSS和SVG。 D3.js是開源工具,使用數據驅動的方式創建漂亮的網頁。 D3.js可實現實時交互。這個庫非常強大和前沿,所以它帶有沒有預置圖表也不支持IE9。

8、NVD3

NVD3運行在d3.js之上, 它可建立可重用的圖表組件。該項目的目標是保持所有的圖表整潔和可定製性。 NVD3是d3.js之上的簡單的介面,保持了d3.js的所有強大功能。 NVD3由Novus Partners前端工程師開發和使其保持了圖表技術洞察力。

9、Google Charts

Google Charts 以HTML5和SVG為基礎,充分考慮了跨瀏覽器的兼容性,並通過VML支持舊版本的IE瀏覽器。所有您將創建的圖表是互動式的,有的還可縮放。Google Charts是非常人性化和他們的網站擁有一個非常好的,全面的模板庫,你可以從中找到所需模板。

10、Highcharts

Highcharts是一個JavaScript API與jQuery的集成,全球最大的100家公司中有61家正在使用它。圖表使用SVG格式,並使用VML支持舊版瀏覽器。它提供了兩個專門的圖表類型:Highstock和Highmaps,並且還配備了一系列的插件。你可以免費使用它,而如果你想建立付費的應用,只須支付少量牌照費用。此外,你還可以使用Highcharts雲服務。

11、Chart.js

對於一個小項目的圖表,chart.js是一個很好的選擇。開源,只有11KB大小,這使得它快速且易於使用,它支持多種圖表類型: 餅圖,線性圖和雷達圖等。12、Leaflet

你是否專註於專業的大數據解決方案?無需餅圖和條形圖?Leafleft 基於Open Street Map數據,使用HTML5 / CSS3繪製互動式可視化圖。您可以使用他們的擴展插件庫添加熱點圖(heatmaps)和動畫標記。 Leaflet 是開源和只有33 KB大小。


可視化之根

多年前讀過一篇非常震撼的文章,叫《Lisp之根》(英文版:The roots of Lisp),大意是Lisp僅僅通過一種數據結構(列表)和有限的幾個函數,就構建出了一門極為簡潔,且極具擴展性的編程語言。當時就深深的被這種設計哲學所震撼:一方面它足夠簡單,每個單獨的函數都足夠簡單,另一方面它有非常複雜,像宏,高階函數,遞歸等機制可以構建出任意複雜的程序,而複雜的機制又是由簡單的組件組成的。

數據的可視化也是一樣,組成一幅內容清晰、表達力強、美觀的可視化信息圖的也僅僅是一些基本的元素,這些元素的不同組合卻可以產生出令人著迷的力量。

要列出「可視化元素之根」很容易:位置、長度、角度、形狀、紋理、面積(體積)、色相、飽和度等幾種有限的元素,邱南森在他的《數據之美》中提供了一張視覺元素的圖,其中包含了大部分常用的元素。

令人振奮的是,這些元素可以自由組合,而且組合往往會產生1+1&>2的效果。

心理學與認知系統

數據可視化其實是基於人類的視覺認知系統的,因此對人類視覺系統的工作方式有一些了解可以幫助我們設計出更為高效(更快的傳遞我們想要表達的信息給讀者)的可視化作品。

心理物理學

在生活中,我們會遇到這樣的場景:一件原價10元的商品,如果降價為5元,則消費者很容易購買;而一件原價100元的商品,降價為95元,則難以刺激消費者產生購買的衝動。這兩個打折的絕對數字都是5元,但是效果是不一樣的。

韋伯-費希納定理描述的正是這種非理性的場景。這個定理的一個比較裝逼的描述是:

感覺量與物理量的對數值成正比,也就是說,感覺量的增加落後於物理量的增加,物理量成幾何級數增長,而心理量成算術級數增長,這個經驗公式被稱為費希納定律或韋伯-費希納定律。
– 摘自百度百科

這個現象由人類的大腦構造而固有,因此在設計可視化作品時也應該充分考慮,比如:

  • 避免使用面積圖作為對比
  • 在做對比類圖形時,當差異不明顯時需要考慮採用非線性的視覺元素
  • 選用多種顏色作為視覺編碼時,差異應該足夠大

比如:

如上圖中,當面積增大之後,肉眼越來越難從形狀的大小中解碼出實際的數據差異,上邊的三組矩形(每行的兩個為一組),背後對應的數據如下,可以看到每組中的兩個矩形的絕對差都是5:

var data = [
{width: 5, height: 5},
{width: 10, height: 10},

{width: 50, height: 50},
{width: 55, height: 55},

{width: 100, height: 100},
{width: 105, height: 105}
];

格式塔學派

格式塔學派是心理學中的一個重要流派,她強調整體認識,而不是結構主義的組成說。格式塔認為,人類在看到畫面時,會優先將其簡化為一個整體,然後再細化到每個部分;而不是先識別出各個部分,再拼接為整體。

比如那條著名的斑點狗:

我們的眼睛-大腦可以很容易的看出陰影中的斑點狗,而不是先識別出狗的四條腿或者尾巴(事實上在這張圖中,人眼無法識別出各個獨立的部分)。

格式塔理論有幾個很重要的原理:

  • 接近性原理
  • 相似性原理
  • 封閉性原理
  • 連續性原理
  • 主體/背景原理

當然,格式塔學派後續還有一些發展,總結出了更多的原理。工程上,這些原理還在大量使用,指導設計師設計各式各樣的用戶界面。鑒於網上已經有眾多的格式塔理論及其應用的文章,這裡就不在贅述。有興趣的同學可以參考這幾篇文章:

優設上的一篇格式塔文章優設上的一篇關於格式塔與Web設計的文章騰訊CDC的一篇格式塔介紹

視覺設計的基本原則

《寫給大家看的設計書》一書中,作者用通俗易懂的方式給出了幾條設計的基本原則,這些原則完全可以直接用在數據可視化中的設計中:

  • 親密性(將有關聯的信息物理上放在一起,而關聯不大的則通過留白等手段分開)
  • 對齊(將元素通過水平,垂直方向對齊,方便視覺識別)
  • 重複(重複使用某一模式,比如標題1的字體顏色,標題2的字體顏色等,保持重複且一致)
  • 對比(通過強烈的對比將不同的信息區分開)

如果稍加留意,就會發現現實世界中在大量的使用這幾個原則。1,2,3三個標題的形式就是重複性的體現;每個標題的內容自成一體是因為組成它的元素(數字,兩行文字)的距離比較近,根據親密性原則,人眼會自動將其歸為一類;超大的數字字體和較小的文字形成了對比;大標題的顏色和其他內容形成了對比等等。

這些原則其實跟上面提到的格式塔學派,以及韋伯-費希納定理事實上是相關的,在理解了這些人類視覺識別的機制之後,使用這些原則就非常自然和得心應手了。

一些例子

  • 淡化圖表的網格(和數據圖形產生對比)
  • 通過深色來強調標尺(強烈的線條和其餘部分產生對比)
  • 離群點的高亮(通過不同顏色產生對比)
  • 使用顏色(通過不同的顏色,利用親密性原則方便讀者對數據分組)
  • 元素顏色和legend(使用重複性原則)
  • 同一個頁面上有多個圖表,採取同樣的圖例,色彩選擇(強調重複性原則)

實例

上篇文章提到我通過一個手機App收集到了女兒成長的一些記錄,包括哺乳信息,換尿布記錄,以及睡眠信息。這個例子中,我會一步步的介紹如何將這些信息可視化出來,並解釋其中使用的視覺原理。

可視化的第一步是要明確你想要從數據中獲取什麼信息,我想要獲取的信息是孩子的睡眠總量以及睡眠時間分布情況。

進階版的條形圖

確定了可視化的目的之後,第二步是選取合適的視覺編碼。上面提到過,對於人眼來說,最精確的視覺編碼方式是長度。我們可以將睡眠時間轉化為長度來展現,最簡單的方式是按天聚合,然後化成柱狀圖。比如:

2016/11/21,768
2016/11/22,760
2016/11/23,700

不過這種圖無法看出時間的分布。我們可以考慮通過條形圖的變體來滿足前面提到的兩個核心訴求。先來在紙上畫一個簡單的草圖。縱軸是24小時,橫軸是日期。和普通的條形圖不一樣的是,每個條形的總長度是固定的,而且條形代表的不是簡單非數據類型,而是24小時。在草稿中,每個畫斜線的方塊表示孩子在睡眠狀態,而虛線部分表示她醒著。

原始數據

name,date,length,note
心心,2016/11/21 19:23,119,
心心,2016/11/21 22:04,211,
心心,2016/11/22 02:03,19,
心心,2016/11/22 02:23,118,
心心,2016/11/22 05:58,242,
心心,2016/11/22 10:57,128,
心心,2016/11/22 14:35,127,
心心,2016/11/22 17:15,127,
心心,2016/11/22 20:02,177,
心心,2016/11/23 01:27,197,

這裡有個問題,我們的縱軸是24小時,如果她晚上23點開始睡覺,睡了3個小時,那麼這個條形就回超出24格的軸。我寫了一個函數來做數據轉換:

require "csv"
require "active_support/all"
require "json"

csv = CSV.read("./visualization/data/sleeping_data_refined.csv", :headers =&> :first_row)

data = []
csv.each do |row|
date = DateTime.parse(row["date"], "%Y/%m/%d %H:%M")

mins_until_end_of_day = date.seconds_until_end_of_day / 60
diff = mins_until_end_of_day - row["length"].to_i

if (diff &>= 0) then
data &<&< { :name =&> row["name"],
:date =&> row["date"],
:length =&> row["length"],
:note =&> row["note"]
}
else
data &<&< { :name =&> row["name"],
:date =&> date.strftime("%Y/%m/%d %H:%M"),
:length =&> mins_until_end_of_day,
:note =&> row["note"]
}

data &<&< { :name =&> row["name"],
:date =&> (date.beginning_of_day + 1.day).strftime("%Y/%m/%d %H:%M"),
:length =&> diff.abs,
:note =&> row["note"]
}
end
end

有了乾淨的數據之後,我們可以編寫一些前端的代碼來繪製條形圖了。畫圖的時候有幾個要注意的點:

  • 每天內的時間段對應的矩形需要有相同的X坐標
  • 不同的睡眠長度要有顏色區分(睡眠時間越長,顏色越深)

var dateRange = _.uniq(data, function(d) {
var date = d.date;
return [date.getYear(), date.getMonth(), date.getDate()].join("/");
});

xScale.domain(dateRange.map(function(d) { return d.date; }));

function getFirstInDomain(date) {
var domain = xScale.domain();

var index = _.findIndex(domain, function(d) {
return date.getYear() === d.getYear()
date.getMonth() === d.getMonth()
date.getDate() === d.getDate();
});

return domain[index];
}

函數getFirstInDomain可以根據一個日期值返回一個X坐標,這樣2016/11/21 19:23和2016/11/21 22:04都會返回一個整數值(藉助d3提供的標尺函數)。

另外,我們根據每次睡覺的分鐘數將睡眠質量劃分為5個等級:

var level = d3.scale.threshold()
.domain([60, 120, 180, 240, 300])
.range(["low", "fine", "medium", "good", "great", "prefect"]);

然後在繪製過程中,根據實際數據值來確定不同的CSS Class

svg.selectAll(".bar")
.data(data)
.enter()
.append("rect")
.attr("class", function(d) {
return level(d.length)+" bar";
})
//...

實現之後,看起來是這個樣子的。事實上這個圖標可以比較清楚的看出大部分睡眠集中在0-6點,而中午的10-13點以及黃昏18-20點基本上只有一些零星的睡眠。

星空圖

上面的圖有一個缺點,是當日期很多的時候(上圖差不多有100天的數據),X軸會比較難畫,如果縮減成按周,或者按月,又會增加很多額外的複雜度。

另外一個嘗試是變形:既然這個統計是和時間相關的,那麼圓形的鐘錶形象是一個很好的隱喻,每天24小時自然的可以映射為一個圓。而睡眠時間可以通過弧長來表示,睡眠時間越長,弧長越大:

角度轉弧度

我們首先將整個圓(360度)按照分鐘劃分,則每分鐘對應的角度數為:360/(24*60),再將角度轉化為弧度:degree * π/180:

var perAngle = (360 / (24 * 60)) * (Math.PI/180);

那麼對於指定的時間,比如10:20,先計算出其分鐘數:10*60+20,再乘以preAngle,就可以得出起始弧度;起始時間的分鐘數加上睡眠時長,再乘以preAngle,就是結束弧度。

function startAngle(date) {
var start = (date.getHours() * 60 + date.getMinutes()) * perAngle;
return Math.floor(start*1000)/1000;
}

function endAngle(date, length) {
var end = (date.getHours() * 60 + date.getMinutes() + length) * perAngle;
return Math.floor(end*1000)/1000;
}

實現的結果是這樣的:

初看起來,它像是星空圖,但是圖中的不同顏色含義沒有那麼直觀,我們需要在圖上補充一個圖例。通過使用d3的線性標尺和定義svg的漸變來實現,定義好漸變和漸變的顏色取值範圍之後,就可以來繪製圖例了。

圖上的每段弧都會有滑鼠移動上去的tooltip,這樣可以很好的和讀者大腦中的鐘錶隱喻對照起來,使得圖表更容易理解。

由於我將整個圓分成了24份,這點和普通的鐘錶事實上有差異,那麼如果加上鐘錶的刻度,會不會更好一些呢?從結果來看,這樣的標線反而有點畫蛇添足,所以我在最後的版本中去掉了鐘錶的標線。

可以看到,我們通過圓形的鐘錶隱喻來體現每一天的睡眠分布,然後用顏色的深淺來表示每次睡眠的時長。由於鐘錶的形象已經深入人心,因此讀者很容易發現0點在圓環群的正上方。中心的黃色實心圓幫助讀者視線先聚焦在最內側的圓上,然後逐漸向外,這和日期的分布方向正好一致。

最終的結果在這裡:心心的睡眠記錄,完整的代碼在這裡。

更進一步

一個完整的可視化作品,不但要運用各種視覺編碼來將數據轉換為視覺元素,背景信息也同樣重要。既然這個星空圖是關於睡眠主題的,那麼一個包含她在睡覺的圖片集合則會加強這種視覺暗示,幫助讀者快速理解。

製作背景圖

我從相冊中選取了很多女兒睡覺時拍的照片,現在需要有個工具將這些照片縮小成合適大小,然後拼接成一個大的圖片。這其中有很多有趣的地方,比如圖片有橫屏、豎屏之分,有的還是正方形的,我需要讓縮放的結果是正方形的,這樣容易拼接一些。

好在有imagemagick這種神器,只需要一條命令就可以做到:

$ montage *.jpg -geometry +0+0 -resize 128x128^
-gravity center -crop 128x128+0+0 xinxin-sleeping.jpg

這條命令將當前目錄下的所有的jpg文件縮放成128x128像素,並從中間開始裁剪-gravity center,+0+0表示圖片之間的縫隙,最後將結果寫入到xinxin-sleeping.jpg中。

拼接好圖片之後,就可以通過CSS或者圖片編輯器為其添加模糊效果,並設置深灰色半透明遮罩。

body {
background-image:url("/xinxin-sleeping.png");
background-size:cover;
background-position:center;
}

當然,背景信息只是補充作用,需要避免喧賓奪主。因此圖片做了模糊處理,且加上了深灰色的半透明Mask(此處應用了格式塔理論中的主體/背景原理)。

小結

這篇文章討論了可視化作品背後的一些視覺元素理論,以及人類的視覺識別機制。在這些機制的基礎上,介紹了如何運用常用的設計原則來進行視覺編碼。最後,通過一個實例來介紹如何運用這些元素 – 以及更重要的,這些元素的組合 – 來製作一個漂亮的、有意義的可視化圖表。

參考資料

這裡有一些關於認知系統和設計原則的書籍,如果你感興趣的話,可以用來參考

《認知與設計》《寫給大家看的設計書》《數據之美》

文/ThoughtWorks @Juntao Qiu 原文請戳:一張漂亮的可視化圖表背後 - ThoughtWorks洞見


推薦tableau
中文網站:Tableau Software
基礎學習視頻:Tableau 培訓與教程

如果

  • 你的數據不那麼完美
  • 你不知道怎麼進行可視化
  • 你的數據是sql、excle、txt、csv等等格式
  • 你想進行一些強大的計算
  • 你想做一些動圖

tableau都可以解決掉

重點是:
如果你是學生的話,還可以免費使用:Tableau 學生版
當然你不是學生的話,你仍然可以免費使用:Tableau Public

唯一的缺點就是國內的教程以及碰到一些問題可能解答比較少,國外比較多。

我也是使用了之後深深的中了毒的~

在之前的文章中也是多次用到了這個軟體,以下是之前做的幾張圖片:


我們實驗室去年寫了一篇綜述,介紹文本可視化的主要方法,僅供參考:文本可視化研究綜述


"A picture is worth a thousand words", 數據可視化這幾年可謂是風生水起,尤其在一些發達國家,各類可視化工具和商務智能軟體百花齊放,不少大公司和政府機構運營已經極度依賴於它們。原因很簡單,人都是圖像敏感而思維趨於懶惰的動物,圖像展現數據的方式使得觀眾可以快速從大數據集里得出有效信息,從而做出決策。

這裡列出個人比較熟悉同時也是市面上最流行的集中可視化工具,可能跟樓上的答案有所重複:

非技術分析人員和非專業數據分析人士:

1. Tableau

Tableau連續幾年一直保持BI市場領頭羊的地位(Gartner2016年BI軟體市場報告 --&> gartner.com 的頁面),Tableau的一大優勢在於簡單易上手, 「導入數據 -&> 關聯數據 -&> 製造圖標 -&> 上傳分享」,滑鼠點擊拖拽一步到位。相比於其競爭者,Tableau的圖形也更美觀大方,給人視覺上的愉悅感。貼幾個連接功大伙兒慢慢欣賞:
50 Years of Crime in the US
Blame The Weather: US Flights Delayed by Precipitation
Domestic Violence in Spain

當然Tableau 也不是全無缺點,比如它的速度就不夠快,當數據很大時,數據引擎每次重新計算和檢索數據需要較長的時間,給用戶造成卡殼的不良體驗,而且Tableau還巨貴,一般小老百姓和初創公司是用不起的,下面是官方定價,大家感受下:
Buy Tableau | Tableau Webstore

大家平時所聽說的Tableau其實是指的Tableau Desktop,這是他們家用於製作圖形的個人桌面客戶端軟體,但其實Tableau的實力遠不止如此,Tableau家族的其他產品還包括:

1) Tableau Public
免費的Tableau圖形發布平台,用戶可以上傳製作好的作品到雲端,所有人都可以在線訪問,但免費的東西從來都不好用,Tableau Public免費的代價是以犧牲大量功能得來的,比如使用Tableau Public時,用戶無法給自己的作品設置訪問許可權,而且支持的數據源也很有限;

2)Tableau Server
企業採用的Tableau中央伺服器,對用戶和數據進行統一管理,比如同一家公司里,不同部門的不同工作人員都可以將自己的數據和製作好的可視化圖形上傳到Tableau Server,然後給同事設置不同的訪問許可權(例如,同一個文件,同事A無訪問許可權,同事B可以訪問但不能修改,同事C既可以看到還能修改,不高興了還能一鍵刪除。。)

3)Tableau Online
Tableau Online說白了就是Tableau Server的官方託管版本,由Tableau提供伺服器和維護服務,客戶只要說明自己的要求和乖乖交錢就好了,當然這在某種程度上也失去了自定義和修改系統的靈活性。

另外Tableau 還提供了豐富的REST API和Javascript API允許程序員自主開發基於Tableau數據引擎和數據倉庫的第三方平台。更多信息移步:
https://onlinehelp.tableau.com/current/server/en-us/rest_api.htm
Tableau JavaSCript API

2. QLIK

QLIK是Garter排行榜前三的另外一家,目前市場佔有率略遜於Tableau(主要歸功於Tableau的容易上手的GUI和美麗大方的動態圖形),但是大有迎頭趕上的趨勢,估計超越Tableau只是時間早晚的事。QLIK旗下有兩個主打產品:QLIK VIEW 和 QLIK SENSE。

剛接觸QLIK的人常常為這兩個產品的功能困惑,好像它們都是干一樣的活,完全可以相互替代,為什麼已經有了QLIK VIEW還要QLIK SENSE?其實,這兩個產品還是有重要區別滴! QLIK SENSE的出現是為了彌補QLIK VIEW存在的不足,官方的解釋是,QLIK VIEW主要用於『Guided Analytics』,通俗地講,如果你想深挖數據,探索變數與變數之間的聯繫,那就選擇QLIK VIEW吧。而如果你已經對數據有一定了解,只是想基於數據創建酷炫的圖形,那麼你應該選擇QLIK SENSE。

QLIK相對於Tableau的優勢主要有:
1) 價格相對便宜;
2) QLIK使用In memory的存儲計算方式,將數據存放於主機的內存中,使得計算速度大大提高(不過好像現在Tableau也在用這個技術);
3) QLIK提供非常全面的SDK和API支持,簡直讓人眼花繚亂,這使得開發人員能夠進行深度定製開發,比如藉助D3這類的Javascrit可視化庫擴展開發QLIK本身不自帶的圖形,這樣一來,QLIK支持任意可視化圖形成為可能,這也是我更看好QLIK的一個重要原因。


總的來講,QLIK有一個好的長遠規劃,前途還是很美好滴。

3. Powerful BI

三巨頭的另外一個產品,老東家是佔據PC半邊天的大名鼎鼎的微軟,Powerful BI作為一個新產品,能在短短几年內迅速擠進BI市場前三,可見微軟在它身上下了不少心血。不過因為本人沒有多少使用Powerful BI的經驗,因此其優缺點不在這裡詳述。

專業數據分析員和開發人員


以上BI工具因其方便的圖形界面使得非專業人員也能快速開發出美觀的動態圖形,但對於具有編程能力的分析人員而言,一款強大靈活地開發工具仍舊不可替代,這類工具具有很多BI軟體所不具有的優點,比如足夠靈活,速度非常快,而且免費!!免費啊!!

1. D3.js

樓上已經有許多答案都提到了D3, D3全稱Data Driven Document,即數據驅動創建圖形,創始人是Mike Bostock。 D3是一個很底層的數據可視化Javascript庫,這也註定了它具有很強的可擴展性(現在已經有很多基於D3開發的第三方數據可視化插件,比如上面有人提到的DC.js),不過隨之而來的是其較為陡峭的學習曲線。

D3相對於Tableau和QLIK的優勢和劣勢都一目了然:
優點:
1) 快速: Javascript直接運行於瀏覽器,速度非常快,也可以很方便地調用各類API獲取數據;
2) 靈活: D3是一款非常底層的數據可視化庫,可以直接操作SVG,理論上,你想要的任何圖形D3都可以實現(前面就提到可以用D3擴展QLIK的圖形支持);
3) 免費:相信價格是用戶非常關注的一個問題,而D3的一個殺手鐧是 它!是!免!費!的!

缺點:
1) 難: 所有學習D3的人都說它難,它的那一套 "Data Driving" 邏輯常常讓人懵圈,因此不少人感嘆D3真是聰明人才用的來的;
2) 開發周期長: 手動敲代碼自然比不上簡單的滑鼠拖拽 ,BI軟體的圖形開發周期常常在幾個小時不等,而用d3手敲代碼,根據圖形的複雜程度,開發周期常在五天到兩個星期不等。
A Day in the Life
nytimes.com 的頁面
http://biovisualize.github.io/d3visualization/
sensortower.com 的頁面

2. R

R在數據分析領域的地位不言而喻,其豐富而強大的擴展包支持使得幾乎一切數據層面的分析和操作成為可能,這些支持中就包括數據可視化。在眾多可視化包裡面,最受歡迎莫過於ggplot2和Rshiny,ggplot2的圖形與前面那些動態圖形都不一樣,是靜態的,但想一想只要兩三行代碼就可以生成複雜的可視化圖形和地圖,想想是不是還有點小激動呢。如果花點時間學習Rshiny,動態圖形也是完全沒問題地哦!


瀉藥。。我基本沒怎麼做過Data Visualization的事情,只能胡亂說說。
這個叫數據可視化。我工作過的公司是用很老土的方式做的:手動跑MapReducer Job然後讓Reporting組的人清理數據並用d3庫做顯示。
D3是個很神的庫,現在在數據可視化方面很熱很熱:
Gallery · mbostock/d3 Wiki · GitHub
一般數據量很大的話,無非就是根據某種方式做聚合再篩選。
比如Word Cloud圖,一般用來顯示熱搜關鍵字之類的信息,越大的字說明頻率約高。真正的關鍵字會有千萬甚至上億,你要顯示的無非也就是幾十個。
如果跑類似Hive的SQL-On-Hadoop系統,你大致可以這麼寫:

SELECT keyword, COUNT(*) AS cnt
FROM search_log
GROUP BY keyword
ORDER BY cnt DESC
LIMIT 50;

這樣你就得到了最熱關鍵字的前50個,並按照頻度排序。
然後調用預封裝的d3介面,這個介面會接受一個關鍵字加詞頻的數據文件,並按照Word Cloud的方式顯示,你就會得到類似這個例子的效果:

而類似百度春運圖的東西,也是經過聚合運算和刪選過濾。
百度遷徙
可以想像,上面的圖是按照兩地之間的遷徙作為聚合條件,然後篩選出最熱的幾百條遷徙路線再在地圖數據上畫邊。
比如:

SELECT 始發地,目的地, count(*) as cnt
FROM 春運購票數據
GROUP BY 始發地,目的地
ORDER BY cnt DESC
LIMIT 500;

然後d3也有類似這樣的例子可以顯示地圖信息:
http://mbostock.github.io/d3/talk/20111116/airports.html

至於上面問題里的話題相關度可視化,雖然也是聚合篩選,但是從原始數據計算相關度並聚類(Clustering)本身,可能就是個很麻煩的問題,是數據挖掘信息獲取中專門的一個話題。要處理這個東西可能要寫複雜的MapReduce Job才能得到好看的圖,而不是向上面兩個例子那樣幾行Hive Query就解決了。

這是老土手動的方式處理並顯示數據的。
高帥富也可以選擇商業解決方案,比如
Datameer | Big Data Analytics
http://www.pentaho.com/


巴西的新聞網站Visualoop,這是一家彙集來自互聯網的信息圖表和數據為中心的可視化網站,今年,他們繼續評選出這一年最優秀的大數據可視化相關工具。

「我們很艱難的選出這20個新的平台或工具—如果你是我們每周數據新聞報道的忠實讀者,你可能記得我們列表中的幾個。」在這個榜單中他們忽略了新的版本和現有工具的更新,例如:CartoDB, Mapbox, Tableau, D3.js, RAW, http://Infogr.am 等等。

下面,就是2014年Visualoop從他們的報道中提取的20大可視化工具和資料。

工具:

1、Introducing Visage | Column Five

今年的SXSWReleaseIt的獲勝者,Visage基於Web平台,在ColumnFive,它把表現平平的數據在報告中變成美麗的品牌可視化效果,使信息更具衝擊力,並且使你的工作看起來更高端。易於使用的軟體可以幫助你創建高品質、專業的可視化,並且準確、有效、優雅。「在今年晚些時候,我們曾與Visage的CEO Jason Lankow談過有關該工具的成功運行和未來的計劃。

2、Introducing Landline andStateline:瀏覽器中兩個快速繪製矢量地圖的工具|ProPublica

就像我們最近說,這是ProPublica的一年。在新的工具「front」中,他們的貢獻在於使用Landline的形式。這是一個開源的JavaScript庫,可以把GeoJSON數據轉換成基於瀏覽器的SVG格式的地圖。Stateline是建立在Landline的基礎上,來創造美國州和縣的地區分布圖 。完整的文檔在GitHub上。

3、YBY:公民報告的新台階|O ecolab

很高興地看到我們的朋友OEcolab公司在2014年推出這個最新項目。YBY是專註於推動企業建立自己眾包平台的軟體。基本上這是一個協作的地圖平台,用戶可以畫點、多邊形和地區。所有的源代碼是開源的,並可以在GitHub上有效使用。開發團隊渴望得到使用者的反饋,請嘗試一下吧。

4、El Mirador| Fathom

Mirador是一種提供大型資料庫的可視化工具,通過可視化的基本結構,確定解釋變數的群體。上手的最佳方式是閱讀它的使用手冊,並從網頁下載的應用程序後,打開其中一個例子親自操作。

5、Plotly:For Pixel Perfect Charts | http://Visual.ly Blog

Plotly是另一個免費進行數據分析和繪製圖表的APP,建立在d3.js上。如果你沒有編碼器,但希望靈活性和豐富性,d3.js一個很好的選擇。 Plotly圖可下載為SVG,EPS或PNG格式,並簡單地導入到Illustrator或者Photoshop中。

6、Visits:定位歷史和照片的可視化工具 | VisualisingData

在這篇文章中,Andy Kirk討論了visits,由AliceThudt, Sheelagh Carpendale 和 Dominikus Baur創造的新可視化工具,通過瀏覽你的位置歷史,探索你的旅行足跡。該工具是基於卡爾加里大學的一個研究項目。你可以在這裡找到相應的發布。http://innovis.cpsc.ucalgary.ca/innovis/uploads/Publications/Publications/visits.pdf


7、Odyssey.js: 講故事的開源工具 | CartoDB

我們一般會盡量避免同公司談論他們推出的產品,但是當CartoDB提出Odyssey.js這個開源庫,允許記者,設計師和創造者在網路上編織故事,互動式地圖為基礎的敘事開始出現。用戶通過地理位置的切換將每件事情講清楚。這個免費工具的發展歸功於 John S. 和James L. Knight 基金會的支持。


8、Wolfram Programming Cloud Is Live| Wolfram

在慶祝沃爾夫勒姆研究公司推出Mathematica26周年時,這個計算型知識引擎公司推出了WolframProgramming Cloud新產品。這個新的Wolfram語言的產品序列,是專門設計用來讓用戶創建和部署基於雲的計劃。

9、Data Visual

「我們的使命是使數據對每一個人可視化。在我們簡單的用戶界面上,我們使個人和組織能夠輕鬆地創建和分享美麗的可視化。」這是這個數據可視化工具的介紹,他們成為第一個在早期階段加入日報創新實驗室的公司。你可以通過下面的視頻了解這個工具的強大。

http://player.vimeo.com/video/64584298?title=0byline=0portrait=0

10、dimple

DimpleAPI介面用於在D3上進行商業分析,Dimple API可以幫助分析師不需要了解太多技術內容而開發強大的數據可視化效果。dimple的目的是開拓D3在分析上的強大功能和靈活性。Dimple使任何人都能夠開發令人驚嘆的三維圖形效果,這樣你就可以使用他們並運行創造一些非常酷的東西。

11、Turn JS projects into data products anyone can use | Blockspring

BlockSpring是一種可以從『blocks』 進行可視化的產品,讓你從你的團隊及世界各地的工程師建立。除了側邊公告有詳細的教程講解如何使用它,而且BlockSpring的報價給你提供的不僅僅是可視化。


順便做個推薦,大數據方面有個公眾號idacker 這些問題都能解答。


自詡是這個領域「有一腳」的人,上帝派我來嚴謹的回答領域問題(順便插科打諢的)。

利益相關,首先介紹一下,我們算是可視化領域和數據分析領域的一個分支,把企業數據揉一揉(收集整合)、泡一泡(加工分析)、舔一舔(展示檢驗),以供展示有價值的信息,所以這樣的可視化更講究應用和實用性(下文會講)。

將數據轉化成可視化圖表/形,其實一個工具就能完成,礙於工具太多,按照使用場景,暫且將已成熟應用的分為三個層次(歡迎各路知友補充):

第一層:數據報告、信息圖

這裡統稱信息圖。信息圖是把數據、信息或知識可視化,必須要有一個清楚準確的解釋或表達甚為複雜且大量的信息。

代表人物是新聞界的David McCandless(大衛. 麥克坎德雷斯),曾為《英國衛報》、《連線》、《獨立報》等刊物撰稿。常以簡潔精美的圖像展現複雜抽象資訊,並將不同的數據組合,展現其中的聯繫。他在TED上曾講過:

「可視化並不局限於數字,概念也同樣適用,比如政治傾向圖譜。我試圖將各種政治傾向融入到圖表中,並展示其如何從政府滲透到社會、文化中,對家庭和個人產生影響,繼而又反過來影響政治。

比如用圖形來表示數值

視線流動,構建時空

而更多普遍實用的是類似 @何明科 在自己的文章分析中,使用一些信息圖表,展示結論。

信息圖的製作:

利用PPT自帶的圖表,可以製作簡潔直觀的數據圖表,但附上人文花鳥就需要美工設計;

PS+AI+icon,前期規劃好表達思路、展示內容、所需素材,之後便大刀闊斧動工組件了。圖表的細節,如柱狀圖的長短依據數據大概等比例量一下。

這一類對數據的維度數量要求都不高,運用的大多是結果數據,側重點也在於展示。

第二層:實際數據應用

應用類的可視化正如上面所說的,將一堆幾百到即使幾百萬不等的數據展示、分析。對於企業,因為這些數據本身是自己生產經營過程中產生的,能反映歷史的狀況,總結髮展之道,對目前的問題或者未來下一步的決策起到輔助作用。

這樣的工具excel能解決,報表工具能解決,BI也能解決,具體細化到什麼樣的場景不是這裡的重點,大家可以在下面評論交流。

通常的製作流程是:導入數據(excel)/連接資料庫(本地/伺服器)——選擇圖表(組合)——設定分析維度——美化展示。比如像這種濃濃的帶有商業味道的可視化報表(有FineReport製作)

動圖:

http://down.finereport.com/EDM/edm154.gif

http://down.finereport.com/EDM/edm155.gif

http://down.finereport.com/EDM/edm156.gif

當然,這樣功力的可視化報表需要一定的審美和熟練操作。圖中每一塊都是一個圖表控制項,在表單(dashboard)中拖入一個圖表控制項,選定數據欄位,然後搭配組合,排布版型。

具體的操作要講上3天3夜,附上移動端的demo鏈接吧: 數據決策系統 (用戶名:demo;密碼:demo)

第三層:據挖掘、數據連接、關係傳遞

這個可以理解為從海量數據中挖掘關係。

大致思路:原始數據經過一連串收集、提取、清洗、整理等預處理過程,形成高質量的數據。然後按照需要對數據貼標籤分類或者預測,如果要從大量複雜的數據中提取有價值且不易發現的信息還要數據建模。(細節可能各有不同)

比較適用的是一寫高級的數據分析挖掘工具以及開源圖表控制項,如R,如D3。

用R做可視化,比較容易做出漂亮的可視化圖表,推薦書籍R Graphics Cookbook,書中有150多個recipes,足夠應付大多類型的數據。

D3做圖可以定製,美觀圖圖表的豐富性秒殺大多圖表控制項,但要求的水平有一丟丟高。

最後,再次引用David McCandless的話「炫酷的可視化對於把思想傳遞給大眾又是至關重要的」,切勿一味追求美感,本末倒置。


補充相關資料來源:

1、大衛.麥克德里斯:數據可視化之美
http://www.tedtochina.com/2010/09/14/david_mccandless/
2、數據可視化:一圖勝千言
3、數據可視化是讓信息易讀,還是更複雜? - 知乎


Don"t ask for techniques or tools, talk to your business unit first.


數據可視化其實有很多圖表類型,這些圖表都有各自使用的場景,各自使用的優勢、劣勢呢!
1.柱狀圖
適用場景:適用場合是二維數據集(每個數據點包括兩個值x和y),但只有一個維度需要比較。
優勢:柱狀圖利用柱子的高度,反映數據的差異,肉眼對高度差異很敏感。
劣勢:柱狀圖的局限在於只適用中小規模的數據集。

(百分比堆積柱狀圖)
2.條形圖
適用場景:顯示各個項目之間的比較情況,和柱狀圖類似的作用;
優勢:每個條都清晰表示數據,直觀;

3.折線圖
適用場景: 折線圖適合二維的大數據集,還適合多個二維數據集的比較。
優勢:容易反應出數據變化的趨勢。

4.各種地圖
適用場景:適用於有空間位置的數據集;
優劣勢:特殊狀況下使用,涉及行政區域;

(全國地圖,只要有經緯度數據全球地圖都能做)

(區域地圖,通過放大鏡可以放大或縮小區域)
5.餅圖(環圖)
適用場景:適用簡單的佔比比例圖,在不要求數據精細的情況適用。
優勢:明確顯示數據的比例情況,尤其合適渠道來源等場景。
劣勢:肉眼對面積大小不敏感。

6.雷達圖
適用場景:雷達圖適用於多維數據(四維以上),且每個維度必須可以排序,適用場合較有限。
優勢:主要用來了解公司各項數據指標的變動情形及其好壞趨向。
劣勢:理解成本較高。

7.漏斗圖
適用場景:漏斗圖適用於業務流程多的流程分析。
優勢:在網站分析中,通常用於轉化率比較,它不僅能展示用戶從進入網站到實現購買的最終轉化率,還可以展示每個步驟的轉化率,能夠直觀地發現和說明問題所在。
劣勢:單一漏斗圖無法評價網站某個關鍵流程中各步驟轉化率的好壞。

8.詞雲
適用場景: 顯示詞頻,可以用來做一些用戶畫像、用戶標籤的工作。
優勢:很酷炫、很直觀的圖表。
劣勢:使用場景單一,一般用來做詞頻。

9.散點圖(調整尺寸大小就成氣泡圖了)
適用場景:顯示若干數據系列中各數值之間的關係,類似XY軸,判斷兩變數之間是否存在某種關聯。
優勢:對於處理值的分布和數據點的分簇,散點圖都很理想。如果數據集中包含非常多的點,那麼散點圖便是最佳圖表類型。
劣勢:在點狀圖中顯示多個序列看上去非常混亂。


10.面積圖

適用場景:強調數量隨時間而變化的程度,也可用於引起人們對總值趨勢的注意。百分比堆積面積圖、堆積面積圖還可以顯示部分與整體之間(或者幾個數據變數之間)的關係。

11.指標卡
適用場景:顯示某個數據結果同環比數據。
優勢:適用場景很多,很直觀告訴看圖者數據的最終結果,一般是昨天、上周等,還可以看不同時間維度的同環比情況。
劣勢:只是單一的數據展示,最多有同環比,但是不能對比其他數據。

12.計量圖
適用場景:一般用來顯示項目的完成進度。
優勢:很直觀展示項目的進度情況,類似於進度條。
劣勢:表達效果很明確,數據場景比較單一。

13.瀑布圖
適用場景:採用絕對值與相對值結合的方式,適用於表達數個特定數值之間的數量變化關係,最終展示一個累計值。
優勢:展示兩個數據點之間的演變過程,還可以展示數據是如何累計的。
劣勢:沒有柱狀圖、條形圖的使用場景多。

14.桑基圖
適用場景:一種特定類型的流程圖,始末端的分支寬度總各相等,一個數據從始至終的流程很清晰

15.雙軸圖
適用場景:柱狀圖+折線圖的結合,適用情況很多,數據走勢、數據同環比對比等情況都能適用。
優勢:特別通用,是柱狀圖+折線圖的結合,圖表很直觀。
劣勢:這個好像沒什麼劣勢,個人感覺。

所有的支持圖片均來自http://me.bdp.cn,可支持黑白主題切換,黑白效果如上圖,圖表的顏色大小也是可以調整的!圖表的適用場景不一,用得好可以更好理解數據的含義,圖表用來做數據彙報也會很直觀好看。


題主提到的是可視化「大數據」,但實際上我們可視化的東西並不是大數據本身,而是已經是去噪、分析、處理之後的「小數據」了。這裡我就不介紹分析過程,只是聊聊可視化。

------------------------------------------------------------------D3.js-------------------------------------------------------------------

樓上多位答主提到了D3.js,我個人也非常推薦他,但這裡就不重複介紹了。推薦幾個案例:

1. The Wealth Health of Nations(顯示1800到2009年期間收入和預期壽命的動態圖,非常贊)

2. The Facebook Offering: How It Compares(Facebook IPO市值和其他科技公司的比較)

--------------------------------------------------------------------dc.js-----------------------------------------------------------------

嫌D3太複雜,還有一個更簡單的開源版本dc.js。基本上dc.js是將D3和Crossfilter封裝起來。如果說D3是需要真正編程去「畫」圖,那dc.js只需要你用一些配置去指定圖表的樣式。在集成了Crossfilter,更可以將多個圖表分為一組,使得對一個圖標的操作可以同時聯動其餘的圖表。

例如在下圖中,點擊最上面圖表的任何一個圓圈(選中年份)會導致整個頁面的其他圖表跟著刷新,只顯示該年份的數據。點此預覽

--------------------------------------------------IBM Many Eyes (Cognos)----------------------------------------------------

終於到給公司打廣告的時間了, @Yamei 居然沒提到IBM自己的產品,你這麼無情Ginni知道么。。
IBM Many Eyes是基於RAVE(Rapidly Adaptive Visualization Engine)。我不知道介紹內部產品的尺度是多少,但大概RAVE是一套從後台Java到前台Javascript都包含的可視化引擎。不過這貨我沒用過,只能截截圖忽悠忽悠大家了。點擊這裡體驗更多。

----------------------------------------------------The R Project(R語言)-----------------------------------------------------

拋開以上基於Web的,R語言也是分析可視化很好的選擇。R語言強大之處是他適合真正去操作分析大數據(是的!某種角度可以替代SPSS!),再生成圖表,唯一缺點就是對編程能力要求很高,而且圖表談不上漂亮。

以上。有想到新的再補充。


在大數據可視化的過程中,重要的不是你需要展示什麼,而是用戶需要看到什麼。

現在對於數據表現的可視化形式已經發展較為成熟,很多新穎直觀的可視化模型都會讓人直觀的獲取想要的結果,而不需要由用戶自己再進行對比或者腦內補充。
這方面比較推薦網易數讀頻道,無論是否從事相關行業都能很直觀的通過合理的展現形式明白要表達的東西。

現在很多數據可視化的工具都只注重了把有的都展示出來,但是更多的情況下你可以嘗試去隱藏或者壓根不展示一些不需要的東西。

這方面的一個經典案例就是地鐵圖的設計。地鐵線路在底下延伸交錯,實際路線並不像我們看到的地鐵圖一樣只存在:直角,45度角兩種情況。
但是用戶是否關心地鐵在從西單開到王府井的路上是否是走的直線?並不是。所以我們只需要通過兩個簡單的角度以及兩個地鐵站之間的間隔表示距離,位置這兩個要素即可。
所以地鐵圖是從設計之初到現在數據可視化的一個最經典的案例。

所以很多情況下,利用工具轉化的數據並不是最終結果。最完美直觀的數據可視化,是需要人工介入的。重要的是思維。


d3.js吧

類似jquery的用法,預定義的各種模板。如果能配合nodejs+http://socket.io,想想都覺得美麗動人


正如題主所言,數據可視化最重要的兩點是:

  • Congruence(可視化的圖表和數據必須是相關聯的,彼此是適合的)
  • Apprehension(同時也是易於理解的)

然後就是呈現方式是不是夠炫了,要是本末倒置就沒有任何意義了
很多看起來很特別可視化效果肯定都不是靠一個可視化軟體可以實現的,html+css+js起碼是必備了,就像好用的網站都不是靠模板搞出來的
不過不要為了可視化而可視化,那些優秀的可視化作品背後的思路才是更應該關注的

最近一直在搜集一些動畫和數據表格可視化的資料,看了一些可視化的網站,實在只有你想不到,沒有做不到,真正感受了什麼叫數據之美,上周推薦了個微軟的數據可視化軟體SandDance,很cool,具體詳情在另一個問下的回答數據可視化的軟體,個人使用的,求推薦,最好多說幾個,多多益善? - 知乎用戶的回答

但這周發現了些更美的數據可視化網站,並且這些網站也都符合以上提到的兩點,沒有多餘冗餘的無用可視化,幾乎將歷史事件或者生活動態完美的用可視化呈現出來了,廢話不多說,直接上圖:

1.第一個是A Day in the Life of Americans 用1000個圓點展示了1000個美國人一天的生活狀態

看的尼瑪有點彩虹糖的趕腳
隨後在某個時間點各個點數的多少繪製路徑,就能看出某個時間活動的頻繁程度

2.下面是第二個神器earth :: a global map of wind, weather, and ocean conditions 全球氣候的可視化,看起來還是很震撼的,並且它並不是一個擺設,每幾個小時就會更新一次數據,並且還可以定位,圖中的小綠圈就是我的位置,上海

當然它也有很多數據類型可以切換,比如風速,溫度,還可以顯示大氣或者海洋等等

然後換個視圖,還是很震撼

除了膜拜,沒有什麼好說的

3.第三個是個特別的資料庫可視化,Out of Sight, Out of Mind: A visualization of drone strikes in Pakistan since 2004是民間統計美帝CIA在巴基斯坦用無人機進行襲擊造成的傷亡人數,以此來討論無人機的使用地域許可權問題
2004-2015年之間總共死了3341個人,數據來自BIJ(Bureau of invesitigative Journalism)Covert Drone War Archives,數量不一定準確,因為這些數據美國政府當然是保密的

4.第四個也是和美帝有關,U.S. Gun Deaths 根據FBI的犯罪報告,將美國2010年和2013年槍擊的數據可視化出來

當你進行Filter篩選後,比如 Shotgun(獵槍), Aisan, Female,顯示出來的數字2個,此時總的數據會翻轉到下半部分,被篩選出的數據顯示在上班部分,這樣讓對比起來更加的直觀

------------------------------------------未完待續,持續更新---------------------------------------------


財新的很多新聞作品呈現為可視化的圖和動畫,他們使用的主要工具是HTML5、CSS3和JavaScript。用HTML5繪製圖形和動畫,用CSS3實現排版,用JavaScript處理交互和動畫。HTML5、CSS3和JavaScript成為可視化的工具。

可視化(Visualization),是將數據展現為直觀的圖形,以幫助理解和記憶。可視化歷史久遠,廣泛應用於地圖、統計等領域。可視化在現代科學中有三個主要分支:科學可視化、信息可視化和可視化分析。
科學可視化(Scientific Visualization),主要用於處理科學數據,如地理信息、醫療數據等,以自然科學領域為主。我們日常接觸到的地圖、氣象圖、CT等都屬於典型的科學可視化。
信息可視化(Information Visualization),主要用於處理抽象的、非結構化、非幾何的抽象數據,如金融交易、社交網路和文本數據。傳統的信息可視化起源於統計圖形學,又與信息圖形、視覺設計等現代技術相關。EXCEL中的餅圖、柱形圖、折線圖之類是我們每天都可能接觸到的信息可視化作品。

可視化分析(Visual Analytics),以可視交互界面為基礎進行分析推理,綜合圖形學、數據挖掘和人機交互等技術。可視分析學是綜合性學科,與多個領域相關:在可視化領域,有信息可視化、科學可視化與計算機圖形學;與數據分析相關的領域包括信息獲取、數據處理和數據挖掘;而在交互方面,則有人機交互、認知科學和感知等學科融合。簡單理解,看K線圖分析股價漲跌背後的規律應該是最常見的可視化分析。


看到其他人基本推薦的是一些開發工具,感覺和題主的意思並不太相同。
國內聽過的做的比較好的綜合類分析工具有魔鏡。不過這個我沒具體用過,不多提了。

社交網路大數據方面的可視化,主要有傳播分析、人脈關係分析等。
傳播分析可以看北大的PKUVIS ,展示單條微博是如何傳播的,具體哪個節點在傳播過程中起到了關鍵作用。

人脈關係分析可以看識微互動 http://ic.civiw.com ,是通過微博博主之間的互動關係而非粉絲關係生成的人物關係圖。比一般的人脈關係分析要准很多。


強烈推薦一個可視化工具,項目首頁https://vega.github.io/vega/,可以直接使用 editor:http://vega.github.io/vega-editor/,與其說是 js 庫,不如說就是個編程語言,熟悉它的json schema,輕輕鬆鬆就可以做出不錯的可視化,甚至不需要js基礎,當然你想要各種酷炫,那就自己用js為它開發插件
如果你會寫ES/JS,那像大家說的就直接研究 d3,threejs,echart等等,甚至自己寫canvas,svg都可以,只要你肯花時間


如果你是分析師,那就好就學一下 R 語言,ggplot,ggvis,rechart,wordcloud,反正可視化庫是海了去了,不管動畫還是靜態的,現在微軟也很積極推進,像powerbi這些工具都支持R,應該有望在Excel中也實現,至少powerbi的對象能嵌入到新版的excel中

如果你不想學編程,那你就只能使用像 Tableau,powerbi,這樣的工具,效果比Excel好點而已,但可選的可視化方案就沒那麼多了


先佔個座,最近正在做這方面的研究,所以來分享一下經驗。

目前市面上有很多開源軟體可以實現Data visualisation,至於具體選擇哪個,完全取決於你具體想實現什麼樣的效果。因為不同軟體的實現效果和用戶友好程度簡直千差萬別。

目前已經測試了的20餘種軟體中,先簡單介紹幾個用起來最得心應手的吧。

1. GEPHI
號稱數據可視化軟體中的photoshop,最擅長數據的分類,和趨勢的呈現。數據導入方式簡單,做出來的圖實在太美。
可用的數據分布模式不少,也都還比較實用,在應用新分布模式時有動態效果。
缺點是,如果要對某一部分數據進行深入的研究就不那麼好用了。過濾模塊的IHM做得不夠簡單實用。而且導入數據是分為節點和連線兩個文件分別倒入的,需要將數據調整為可讀結構,文件類型csv就可以了。

2. Cytoscape
主要用戶是生物學家,但鑒於其強大的功能,配上合適的plugin,用來做社交網路分析也綽綽有餘。
升級3.X後界面好看多了,關鍵是在數據量大大增加後卡頓也並不明顯,這點比GEPHI要強。雖然做出來的圖不一定有GEPHI的高大上效果,但過濾功能簡單易用,當你想分析一個龐大社交圈種某一小部分人的特定表現時,可以簡單地抽離出這部分數據,並創建一個新的子網路,這個功能實在是幫了我大忙。

先寫這兩個,手機碼字,晚些換電腦繼續。


強烈推薦D3.js,另附上小站http://www.ourd3js.com/wordpress/


推薦閱讀:

y=x^x 的图像大概是什么样的?

TAG:數據挖掘 | 信息技術IT | 數據可視化 | 大數據 | 數據可視化設計 |