人們常說，數據是新世界的貨幣，而 Web 則是新世界交易的外匯局。作為消費者，我們正在在數據中漫遊；處處都是數據，從食品標籤，到世界衛生組織組織的報告。其結果是，訊息設計師在從數據流中呈現數據時愈發凸現窘境。
獲得訊息的最佳方式之一是，通過視覺化方式，快速抓住要點訊息。另外，通過視覺化呈現數據，也揭示了令人驚奇的模式和觀察結果，是不可能通過簡單統計就能顯而易見看到的模式和結論。正如作家、記者和訊息設計師 David McCandless 在 TED 上說道：「通過視覺化，我們把訊息變成了一道可用眼睛來探索的風景線，一種訊息地圖。當你在迷失在訊息中時，訊息地圖非常實用。」
講故事有很多種方式，但萬事都源於構思。俗話說，一圖勝千言。不過製作一張超酷的訊息圖，又是一件費時又費力的事。本文就整理了 20 個相應工具，應該能簡化你的工作。
01.iCharts
iCharts can have interactive elements, and you can pull in data from Google Docs
iCharts 提供了一個用於創建並呈現引人注目圖表的托管解決方案。有許多不同種類的圖表可供選擇，每種類型都完全可定製，以適合網站的顏色主題。iCharts 有交互元素，可以從 Google Doc、Excel 表單和其他來源中獲取數據。iCharts 的免費版只允許你用基本的圖表類型，如果基本圖表類型無法滿足需求，升級到付費用戶吧。
02.Flot
Create animated visualisations with this jQuery plugin
Flot 是一個用於 jQuery 的專業繪圖庫，有很多便捷的特性，最關鍵的是，跨瀏覽器（包括 IE6 ）。可把數據做成動畫，因為它是一個jQuery插件，所以你完全可以控制動畫、演示和用戶交互的方方面面。
03.Raphaël
This handy JavaScript library offers a range of data visualisation options
Raphaël是一個能夠在網頁上創建和操作矢量圖形的JavaScript 庫。它使用SVG&VML來創建圖形。因為每個生成的圖形都是一個DOM對象，所以可以通過JavaScript操作這些圖形。可千萬 Raphaël 官網查看 Demo，
04.Modest Maps
Integrate and develop interactive maps within your site with this cool tool
Modest Maps 是一個輕量級、簡單、免費的地圖工具（ JS 庫 ），網頁設計師和開發人員可輕鬆地把它整合到網站中。
05.Leaflet
Use OpenStreetMap data and integrate data visualisation in an HTML5/CSS3 wrapper
另外一個地圖工具，支持 HTML5 和 CSS3 ，Leaflet 可以輕鬆使用 OpenStreetMap 的數據，並且完全把交互可視化數據集成在一起。
Leaflet 的內核庫很小，但是有很多插件能擴展其功能，比如：動態標記、masks 和熱圖，非常適用於需要顯示地理位置的項目。麻雀雖小，五臟俱全。
06.Timeline
Timeline 是一個奇妙的小工具，坑繪製漂亮的互動式時間軸，用戶滾動滑鼠，時間軸會響應變化。點擊時間軸上的元素，可顯示更多訊息。（MIT 開發）
07.Exhibit
和 Timeline 一樣，Exhibit 也是 MIT 開發的，完全開源。借助 Exhibit ，用戶可輕鬆做出交互地圖，還有其他基於數據的可視化內容，比如國旗，名人的出生地。
08.WolframAlpha
Wolfram Alpha 是由Wolfram Research公司推出的一款在線自動問答系統。Wolfram Alpha這一款自動問答系統的特色是可以直接向用戶返回答案，而不是像其它搜索引擎一樣提供一系列可能含有用戶所需答案的相關網頁。
如果輸入公開數據，比如一個函數，可以生成函數曲線（見上圖）。另外，Wolfram Alpha 提供一個小掛件（Widget），可嵌入在你的網站上。
09.Visual.ly
Visual.ly 是一個結合 gallery 和 訊息圖的生成器。它有一個簡單的工具箱，用來展示數據訊息，它也是一個分享作品的平台。這個網頁有製作過程示例。
10.Visualize Free
Visualize Free 是一個托管工具，它允許你使用公用數據，或上傳自己是數據，來做互動式的圖片，以展示數據。可視化遠超過了簡單的圖表，並且這個工具完全免費，不過它是用 Flash 輸出結果，所以有些場景下用不了這個工具了。
11.Better World Flux
Orientated towards making positive change to the world, Better World Flux has some lovely visualisations of some pretty depressing data. It would be very useful, for example, if you were writing an article about world poverty, child undernourishment or access to clean water. This tool doesn』t allow you to upload your own data, but does offer a rich interactive output.
（這個工具，在其官網試了多次，都測試不成功……）
12.jQuery Visualize
這個工具由 jQuery 的ThemeRoller和jQuery UI幕後團隊開發製作。jQuery Visualize 是一個開源的圖表插件，使用 HTML Canvas 繪製多種不同類型的圖表。這個插件有個重要的特性是支持 ARIA。可從Github 下載該插件 。
13.jqPlot
如果你已經在使用jQuery，不想為HighCharts付費，而且情況很簡單，不需要D3那樣複雜的庫，那麼jqPlot是很好的選擇。
14.Dipity
Dipity 可用來創建豐富的互動式時間線，並嵌入到網站中。有免費版和商用版。不多介紹，請訪問 Dipity 官網（提示：請自備梯子）實際查看。
15.Many Eyes
Many Eyes是由IBM研究的視覺通訊實驗室（02Visual Communication Lab）和IBM Cognos 軟體集團于2007年所創建的一個在線可視化社區。通過這個社區，用戶可以創建可視化作品，上傳數據集，對其他用戶所創建的可視化進行評論，或者分享，並可以對可視化作品加以評分。
Many Eyes允許用戶快速從公開可用或已上次的數據集中完成可視化，並且有廣泛的分析特性，比如：掃描文本，分析關鍵詞的密度和飽和度。
《視頻：如何使用Many Eyes》
16.D3.js
D3.js 是最流行的可視化庫之一，它被很多其他的表格插件所使用。它允許綁定任意數據到DOM，然後將數據驅動轉換應用到Document中。你可以使用它用一個數組創建基本的HMTL表格，或是利用它的流體過度和交互，用相似的數據創建驚人的SVG條形圖。
PS：《D3.js 應用代碼案例集合》http://t.cn/zjIrNMp，比如這個案例 World Tour，按首字母順序在地球儀上展現各個國家與地區：http://t.cn/zjfM10z。D3 用到了 SVG 技術，所以國內開發者在使用時要好好在 IE 下調試哦。
17.JavaScript InfoVis Toolkit
JavaScript InfoVis Toolkit 是一個在 Web 上創建可互動式的數據圖表 JS 庫，同樣包括了多種圖表類型，並有漂亮的動畫效果。雖然是免費工具，但建議有條件的童鞋捐贈作者。
JIT 的作者是 Nicolas Belmonte，目前是 Twitter 的 Data Visualization Scientist，除了這個項目，他還寫了PhiloGL和V8-GL。
18.jpGraph
如果需要在伺服器端生成圖表或圖片，jpGraph 提供了一個基於 PHP 的解決方案，只需從資料庫中取出相關數據，定義標題，圖表類型，剩下的事就交給 jpGraph 了。它很多種圖表類型（見上圖）。非商業使用是免費。
19.Highcharts
Highcharts 是一個用純JavaScript編寫的一個圖表庫。能夠很簡單便捷的在web網站或是web應用程序添加有交互性的圖表，並且免費提供給個人學習、個人網站和非商業用途使用，也有商業授權。目前HighCharts支持的圖表類型有曲線圖、區域圖、柱狀圖、餅狀圖、散狀點圖和綜合圖表。
Highcharts 在現代瀏覽器中支持輸出SVG格式，也支持在 IE 瀏覽器中VML。
20.Google Charts
Google Chart Tools 給網站數據可視化提供了一種完美方式。從簡單的線圖， Geo 圖、 gauges （測量儀），到複雜的樹圖，Google Chart Tools提供了大量設計優良的圖表工具。
