データビジュアライゼーション・ツール20選

この記事はThe top 20 data visualisation toolsの原著者許諾済みの日本語訳です。
By Brian Suda on September 17, 2012
Translated by Tatsuo Sugimoto

2014年4月28日更新：オリジナル記事が以前のサイトから移転したため発生していた画像の非表示に対応しました。

わたしがもっともよくきかれる質問のひとつが、データビジュアライゼーションを始める方法についてです。このブログの先へ進むには、練習し、さらに実践し、利用できるツールを理解する必要があります。この記事では、シンプルなチャートから複雑なグラフ、地図、インフォグラフィックスまで、ビジュアライゼーションを作成するための20種類のツールを紹介しようとおもいます。ほとんどのツールは無料で利用でき、そのうちいくつかはすでにインストール済みかもしれません。

エントリーレベルのツール

エントリーレベルでは、使いなれたツールを転用してみましょう。たとえば、Excelはビジュアライゼーションソフトだとはおもわれていませんが、驚くほど複雑な結果を得られます。もし始めたばかりなら、これらのツールを理解すべきです。もし毎日ビジュアライゼーションを扱うのなら、すぐにこの先へと進めていけますが、ほかの皆がそうできるわけではありませんので、いつもあまり扱いたくない出所［訳注：つまりエントリーレベルのツール］からのデータを扱うことになります。

1. Excel

for example, by creating 'heat maps' like this one — Excelは、グラフィカルな柔軟さはありませんが、たとえばこのような「ヒートマップ」を作成するためのデータ探索に向いています。

セルの「ヒートマップ」から散布図まで、Excelではかなり複雑なことができます。エントリーレベルのツールとして、ちょっとしたデータ探索や組織内使用のためのビジュアライゼーション作成には向いていますが、デフォルトの色、線、スタイルのセットが限られているので、本格的な出版物やWebサイトで利用できるグラフィックを作成することは困難です。それでもExcelは、すばやくアイデアを伝えるための手段として、用意しておくべきツールです。

Excelは、商用のMicrosoft Officeの一部として提供されていますので、購入していない場合は、Googleドライブの一部であるGoogleスプレッドシートでほぼ同じことができます。Googleは自社サービスを再利用しているので、スプレッドシートはGoogle Chart APIと同じチャートを生成できます。つまり今後ツールを卒業し自分のプロジェクトでAPIを直接使用するときにそなえて、あらかじめできることを把握しておくことができます。

2. CSV/JSON

CSV（コンマ区切り値）とJSON（JavaScript Object Notation）は、ビジュアライゼーションツールではありませんが、一般的なデータフォーマットです。これらの構造と入出力の方法を理解しておきましょう。このあと紹介するすべてのツールは、入力源としていずれかまたは両方のフォーマットに対応しています。

オンラインのビジュアライゼーション

3. Google Chart API

静的画像のためのツールセットの一部が廃止されたため、現在Google Chart Toolsサイトは動的なチャートのためのツールだけを提供しています。これらは堅牢で、SVG、Canvas、VMLをサポートするすべてのブラウザ上で動作しますが、クライアントサイドで生成するという唯一の大問題があり、JavaScriptのないデバイスやオフライン利用、さまざまなフォーマットに保存するときに問題が生じます。静的画像にはこうした問題はなかったので、なくなってしまったのが残念です。

とはいえこのAPIは、棒グラフ、折れ線グラフから地図やQRコードにいたるまで、ありとあらゆることができます。Googleっぽい外観でかまわなければ、極端なカスタマイズを必要とせずに、よいビジュアライゼーションになるでしょう。出発点として、Google Chart APIは使い方を知るのに最適なツールです。

The portion for static images has been deprecated, but the Google Chart API is a good way to create dynamic visualisations — 静的画像の部分が廃止されましたが、Google Chart APIは動的なビジュアライゼーションを作成するためのよい方法です。

4. Flot

Flotは、折れ線グラフと棒グラフ用のすばらしいライブラリです。FlotはCanvasをサポートするすべてのブラウザで動作します。つまりほとんどの一般的なブラウザ、および古いブラウザではCanvasをVMLとして扱う外部ライブラリを使えば動作します。FlotはjQueryライブラリなので、すでにjQueryになれていれば、グラフィックのスタイルや振る舞いをコールバックで簡単に扱えます。

Flotの素晴らしい点は、多くのコールバック関数にアクセスできるので、ユーザーのホバー、クリック、マウスアウトなどの一般的なイベント発生時に、独自のコードとスタイルを実行できることです。Flotは、ほかのグラフ作成パッケージよりもはるかに柔軟性がありますが、やや習得しづらいです。Flotは、折れ線グラフと棒グラフに限定されています。Flotはほかのライブラリほど多機能ではありませんが、一般的な仕事をしっかりこなします。

It's specialised on line and bar charts, but if you know jQuery, Flot is a powerful option — Flotは折れ線グラフと棒グラフに特化したものですが、jQueryを知っていれば強力な選択肢です。

5. Raphaël

Raphaëlもグラフ作成のすばらしいJavaScriptライブラリです。ほかのライブラリとの大きな違いは、RaphaëlがSVGとVMLの出力にしぼっていることです。これには一長一短があります。SVGはベクターフォーマットなので、どんな解像度でも美しく見えます。ただし各要素のDOMノードが作成されるため、Canvasにラスタライズされたイメージよりも遅くなります。一方で、HTMLのように各DOM要素とインタラクトできるという利点があります。

Webサイトには、Raphaëlが一般的なグラフを簡単につくれることを見せるたくさんのデモがありますが、任意のSVGにもレンダリングできるため、IllustratorやInkspaceなどのベクターツールに頼らなければできないほど、とても複雑なビジュアライゼーションを作成できます。

slower than raster-based tools, but it's capable of complex results — Raphaëlはベクターベースのグラフを作るよい手段です。ラスターベースのツールよりも遅いものの複雑な結果を得られます。

6. D3

D3 (Data-Driven Documents)は、SVGレンダリングをサポートするJavaScriptライブラリです。この例はシンプルな棒グラフと折れ線グラフを超えた、かなり複雑なボロノイ図、ツリーマップ、円形クラスター、ワードクラウドです。道具箱に用意すべきすばらしいツールですが、図書館に行くようにいつでもD3をおすすめしようとはおもいません。D3は、とても複雑なインタラクションを作るにはすばらしいです。しかし、ただできるからといって、やったほうがよいというわけではありません。シンプルでいることを心得ていることが、最適なビジュアライゼーションツールを選択する大切なポイントです。

D3 is capable of creating very complex output – but it's best saved for special cases, not everyday use — D3はとても複雑なアウトプットを作成できますが、普段使いではなく特別な機会にとっておくのに最適です。

7. Visual.ly

データビジュアライゼーションよりもインフォグラフィックを必要としている場合、それを支援する新しいツール群が登場しています。Visual.lyはそのなかでおそらく最も人気があります。そもそもインフォグラフィックデザイナーのためのオンライン市場でしたが、テンプレートを選びFacebookやTwitterアカウントに接続すると、すてきなイラストが返ってくる作成機能があります。結果は現在のところ限られていますが、良くも悪くも、有用なインスピレーションの源泉です。このサイトは、今後より多くのフォーマットに対応し、さらにおもしろいグラフィックを作成できるように発展しそうです。

Visual.ly acts both as an online marketplace and simple creation tool for infographics — Visual.lyはオンライン市場とインフォグラフィックのシンプルな作成ツールをもちあわせています。

インタラクティブなGUIコントロール

データビジュアライゼーションがインタラクティブになったら、それ自体がGUIコントロールになるでしょうか？　オンラインのビジュアライゼーションが進化したように、ボタン、ドロップダウン、スライダーは、入力パラメータとデータを同時に変化する範囲制御の小さなハンドルのような、より複雑なインタフェース要素へと変化しています。コントロールとコンテンツは融合していくのです。これから紹介するツールは、この提案への可能性を探るのに役立つでしょう。

8. Crossfilter

クライアントがデータの中をかき分けていけるようにより複雑なツールを構築するとき、わたしたちはインタラクティブなGUIウィジェットの役割も兼ねたグラフやチャートを作りはじめています。JavaScriptライブラリのCrossfilterはこれら両方ができます。データを表示すると同時に、データの範囲を制限してリンクされたグラフの反応を見ることができます。

by restricting the input range on any one chart, data is affected everywhere. This is a great tool for dashboards or other interactive tools with large volumes of data behind them — 実行中のCrossfilter：任意のグラフの入力範囲を制限することで、全てのデータに影響が及びます。Crossfilterは、背後に大量のデータをかかえているダッシュボードやインタラクティブなツールに最適なツールです。

9. Tangle

Tangleでは、コンテンツとコントロールの境界がさらにあいまいになります。複雑なインタラクションや方程式を説明しようとするとき、ユーザ自身に操作感覚とデータ探索の強力な方法の両方を提供するために、入力値を微調整させ出力を見せます。JavaScriptライブラリのTangleは、まさにこれをおこなうツールセットです。変数上でドラッグすると、その数値を増減させ、関連するグラフが自動的に更新されるのを見ることができます。この結果はほとんど神秘の一歩手前です。

Tangle creates complex interactive graphics. Pulling on any one of the knobs affects data throughout all of the linked charts. This creates a real-time feedback loop, enabling you to understand complex equations in a more intuitive way — Tangleは、複雑なインタラクティブなグラフィックを作成します。任意のでっぱりを引っぱると、すべてのリンクしたグラフを通じてデータに影響をおよぼします。Tangleは、リアルタイムのフィードバックループを作りだし、より直感的な方法で複雑な方程式を理解できます。

マッピング

マッピングは、以前はウェブ上のとてもやっかいな作業でした。そこにGoogleマップが、オンライン地図の動作方法についての先入観をすっかり吹き飛ばして登場しました。その後間もなくGoogleは、開発者が自分のサイト内にマップを埋め込めるGoogle Maps APIをリリースしました。

それ以来、この市場は大いに成熟しました。自分のデータビジュアライゼーションのプロジェクトでカスタムマッピングソリューションを埋め込みたい場合、現在ではいくつかの選択肢があり、他と比べてどれを選択するべきかを知っていることが、ビジネス上の重要な判断になったのです。おそらくこれらのマップのいずれかに必要なものをすべて押し込むことはできますが、ハンマーを持ってあらゆる問題を「くぎ」として見ることのないようにおすすめします。

10. Modest Maps

Modest Mapsは小さなマッピング・ライブラリです。わずか10kBしかなく、ここであげているなかで最軽量の選択肢です。Modest Mapsは基本的な形式のみしか作れませんが、だまされていはいけません。Waxなどいくつかの拡張でこのライブラリに命を吹き込むことができます。Modest Mapsは、Stamen、Bloom、MapBoxによる制作物ですから、興味深い経歴をもっていることがわかります。

Teamed with additional libraries, such as MapBox's Wax (pictured), the tiny Modest Maps becomes a powerful tool — MapBoxのWax（図）のような追加ライブラリと合わせることで、小さなModest Mapsは強力なツールになります。

11. Leaflet

CloudMadeチームが提供するLeafletも、小さくモバイルページを作成するのに十分軽量になるように設計された小型のマッピングフレームワークです。LeafletもModest Mapsも、自分のサイトで使用するのに理想的なオープンソースのプロジェクトです。強力なコミュニティがバックアップしているので、すぐに消えてしまうことはありません。

Leaflet is a small, lightweight JavaScript library ideal for mobile-friendly projects — Leafletは、モバイルプロジェクトに理想的な小さく軽量なJavaScriptライブラリです。

12. Polymaps

Polymapsもマッピングライブラリですが、真正面からデータビジュアライゼーションのユーザをねらっています。CSSセレクタに似た、作成したマップをスタイリングするユニークなアプローチを提供しているので、知っておくとすばらしいリソースです。

Aimed more at specialist data visualisers, the Polymaps library creates image and vector-tiled maps using SVG — データビジュアライザーの専門家向けのPolymapsライブラリは、SVGを使って画像とベクターでタイル張りされたマップを作成します。

13. OpenLayers

OpenLayersは、これらのマッピングライブラリの中でおそらく最も堅牢です。ドキュメントはあまりよくなく、習得はむずかしいですが、ほかではできないことに使えます。他のライブラリが提供していない特定のツールを必要としているとき、OpenLayerがたよりになります。

It isn't easy to master, but OpenLayers is arguably the most complete, robust mapping solution discussed here — OpenLayersをマスターするのは簡単ではありませんが、ここでとりあげているなかで間違いなく最も完全で堅牢なマッピングソリューションです。

14. Kartograph

Kartographのキャッチフレーズは「マッピングの再考」で、この開発者がやっていることそのものです。私たちはいつもメルカトル図法を使っていますが、Kartographははるかに多くの選択肢をもたらします。もし世界規模のデータの作業ではなく、明確なボックスのなかにマップを配置できるなら、Kartographは他よりひときわ目立つために必要な選択肢を持っています。

Kartograph's projections breathe new life into our standard slippy maps — Kartographの投影図は、標準のとらえにくいマップに新たな命を吹きこみます。

15. CartoDB

最後に、CartoDBは知っておくべきサイトです。表形式のデータをマップと組み合わせられる容易さは群を抜いています。たとえば住所の文字列のCSVファイルを入力できて、それらは緯度経度に変換され、地図上にプロットされますが、他にも多くのユーザーがいます。5つの表までは無料で利用できます。その後は月額料金プランがあります。

CartoDB provides an unparalleled way to combine maps and tabular data to create visualisations — CartoDBは、ビジュアライゼーションを作成するためにマップと表形式のデータを結合する素晴らしい方法を提供します。

グラフ用のフォント

最近のWeb開発のトレンドのひとつに、美しいベクターアイコンを作成するため、埋め込みフォントにシンボルフォントを合成することがあります。これらのアイコンは、拡大や印刷に完全に対応していて、あたらしいRetinaデバイスにもぴったりです。FF ChartwellやChartjunk等のいくつかのフォントは、グラフを表示するために特別に作られています。こうしたフォントは、すべてのブラウザでは完全にサポートされていないOpenTypeの日常的問題をかかえていますが、近い将来は検討に値するでしょう。

本格的に取り組む

データビジュアライゼーションに本格的に取り組むなら、シンプルなWebベースのウィジェットから、さらに強力なものに移行する必要があります。つまりデスクトップアプリケーションやプログラミング環境のことです。

16. Processing

Processingはインタラクティブ・ビジュアライゼーションのシンボル的存在になりました。Processingでは、Javaにコンパイルされる、より簡単なコードを書くことができます。Javaアプレットなしでより簡単にProcessingを使うWebサイトを作れたり、Objective-CへのポーティングでiOS上で使えるProcessing.jsプロジェクトもあります。Processingはデスクトップアプリケーションですが、すべてのプラットフォームで動作し、現在数年の歳を重ねていて、コミュニティによる十分なサンプルとコードがそろっています。

Processing provides a cross-platform environment for creating images, animations, and interactions — Processingは、画像、アニメーション、インタラクションを作成するためのクロスプラットフォーム環境を提供しています。

17. NodeBox

NodeBoxは、2Dグラフィックとビジュアライゼーションを作成するためのOS Xアプリケーションです。Pythonコードを知っていて理解する必要がありますが、その先にあるNodeBoxは、変数を微調整し、瞬時に結果を確認するための迅速かつ簡単な方法です。NodeBoxはProcessingに似ていますが、インタラクティビティはありません。

NodeBox is a quick, easy way for Python-savvy developers to create 2D visualisations — NodeBoxは、Python使いの開発者にとって、2Dビジュアライゼーションを作成する素早く簡単な方法です。

プロ・ツール

Excelからはじまるスペクトルの対極に位置するのが専門的なデータ分析ツールです。データ・ビジュアライゼーションに本格的に取り組んでいるなら、このうちのいくつかに熟達していないとしても意識はしておく必要があります。SPSSやSASといった業界標準のツールは高額な利用料が必要なので、大規模な組織や学術機関だけが利用できます。しかしいくつかの無料の代替ソフトウェアが、強力なコミュニティとともにあります。オープンソースソフトウェアも商用ソフトに劣らぬ品質で、プラグインやサポートもすぐれています。

18. R

そのソフト専用の検索エンジンをそなえたソフトウェアが他にあるでしょうか？　統計パッケージは大規模なデータセットを解析するために使用されます。Rは非常に複雑なツールで、理解するのに時間がかかりますが、強力なコミュニティと、つぎつぎに制作されているパッケージライブラリをもっています。学習曲線は、ここでとりあげるツールのどれよりも険しい［訳注：むずかしい］もののひとつですが、このレベルに到達したいなら、使い慣れておかなくてはなりません。

A powerful free software environment for statistical computing and graphics, R is the most complex of the tools listed here — Rは統計処理とグラフィックのための強力なフリーソフトウェア環境で、ここにあげたツールのなかで最も複雑です。

19. Weka

データサイエンティストの世界に深く入るには、自らの能力をビジュアライゼーションの作成だけからデータマイニングに拡張する必要があります。Wekaは、さまざまな属性に基づき（データ探索の強力な方法である）データの分類とクラスタリングをおこなうのに適したツールです。また、簡単なプロットを生成することもできます。

A collection of machine-learning algorithms for data-mining tasks, Weka is a powerful way to explore data — Wekaはデータマイニング作業のための機械学習アルゴリズムを集積した、データ探索の強力な方法です。

20. Gephi

人びとが関連性、ソーシャルグラフ、相関関係について話しているとき、実際には、ネットワーク内の他のノードに対して、2つのノードが相対的にどう互いに関連しているかについて語っています。問題となるノードは、会社の人々や文書内の単語、サッカーの試合のパスにもなりえますが、数学も同じことです。グラフベースのビジュアライザーでありデータ管理ソフトであるGephiは、大量のデータセットを処理し美しいビジュアライゼーションを作成できるだけでなく、データをクリーンにしソートすることもできます。使用事例が限られている複雑なソフトウェアですが、この珠玉のソフトを知らない人よりも一歩前に進むことができます。