6月27日 データをわかりやすく可視化する「データビジュアライゼーション」勉強会　矢崎裕一さんプレゼン資料

データをわかりやすく可視化する「データビジュアライゼーション」勉強会

2014/06/27 (金) 19:00 - 21:30https://www.facebook.com/events/645728912170926/

矢崎 裕一

実際に形にするために 考え方のポイントとリソース紹介

インフォメーション・グラフィックと データ・ビジュアライゼーション

http://elections.nytimes.com/2012/results/president

• 人が手作業かグラフィックアプリケーションで描いている。

• 手元にあるデータの特性を作者が理解し、その特徴を最大化するために表現が選ばれる。

• そのため、別のデータを使用して再作成するのが容易ではない。

• 表示についてのルールとその例外ルールについて、作者以外の外部から、すべてを推測することが難しい。

• 参照したデータとの関連性の証明が難しい。

• インタラクションがないものが多い。

インフォメーション・グラフィック

http://visualizing.jp/infograph_vs_dataviz/

データ・ビジュアライゼーション

• あるデータセットが、予め用意されたアルゴリズムを用いて、コンピュータによって描画されること。

• その描画によってデータセットを眺めているだけではわからない傾向や特徴が明らかになっていること。

• アルゴリズムはコーディングによって定義され、チャートやグラフとして発達してきた表示形式を用い、形式知化／可視化されていること。

• ソート、フィルター、トグルなどのインタラクションが可能で、その場でその結果がすぐ得られること。

• 利用しているデータセットが可視化されていること。

http://visualizing.jp/infograph_vs_dataviz/

データのビジュアライズ

step1.データを情報に変換する 人間の認知能力に合わせて抽象化して、理解できるものにする

• データセットそのものから特徴や性質を掴むことが困難

• 特徴を理解できる • 他のデータセットと組み合わせられる

なるほど！

step2.「なるほど！」と思って共感する 単なる理解から共感へ結びつける

• 自分ごとと関連づけて、共感できる

ワークフロー

「ビジュアライジング・データ」 によるワークフロー

• 手軽で強力なプログラミング環境「Processing」を用いた情報視覚化技術についての解説書。

• 地図情報・階層ファイルシステム・リスト・グラフ構造・時系列データなど、さまざまなデータの収集・解析手法から対話的な視覚化手法・プログラミングテクニックまでを豊富な実例を用いて詳しく解説している。（出版元サイトより）

http://www.oreilly.co.jp/books/9784873113784/

「Data Journalism Handbook」 によるワークフロー

• ロンドンで開かれた MozFest 2011での48時間ワークショップの集大成

• BBC、シカゴトリビューン、ガーディアン、フィナンシャルタイムズ、ニューヨークタイムズ、ワシントンポスト、テキサストリビューンなどが参加。

• データ・ジャーナリズムの知識共有や実例集。

http://datajournalismhandbook.org/

データ→情報→インサイト

データを見つけ、 下ごしらえする

データを情報（ここではチャートを指す）に変換し、分析／検証する

情報からインサイトを見つける

なるほど！

データをどのように選定するか

• 1stパーティをまずはあたる • メタデータ（誰がどのように集めたデータなのか）が重要

• 専門家に聞くのはとても有益な手段

データをどのように選定するのか

• 各国のデータカタログサイト • 国際機関（国連、世銀）のデータサイト • Wikipedia • SNS • 各種ウェブサイト • 専門家に聞く • 書籍 etc…

データはどこにある？

「データは街に溢れている」http://portal.nifty.com/2007/08/01/a/

自分のアクティビティ・データ

Quantified Self

Moves app アクティビティ・データ・サービスにおける

Twitterのようなサービス

データを下ごしらえする

Google Refine

OpenRefine

•コラムごとのデータ形式の変換

•データ形式が間違っているものを検出（数値のコラムに文字列があるなど）

•データの重複を探し出す

•表記揺れの解消

•エラー値の検出と処理

•空白の検出と処理

http://openrefine.org/

データを情報に変換し、分析／検証する

RAW / Tableau / ManyEyes / MatLab

データセットとビジュアル表現を選択するだけの比較的お手軽なもの

R / Pythonデータ分析

http://raw.densitydesign.org/http://raw.visualizing.jp/#/

Raw

- ブラウザ上で動く - データセットとビジュアル表現を選ぶだけ - 結果の出力フォーマットも多様

http://www.tableausoftware.com/products/desktop

TableauDesktop edition。Mac版も先日リリース。

- 単体アプリ - データセットとビジュアル表現を選ぶだけ - 約10万円

http://www-958.ibm.com/software/analytics/labs/manyeyes/#create

ManyEyes

- ブラウザ上で動く(Java) - データセットとビジュアル表現を選ぶだけ

http://www.mathworks.co.jp/products/statistics/

MatLabMatLab+Statistics Toolbox

R

- オープンソース - 統計解析のためのプログラミング言語

http://www.r-project.org/

Python

-「データ分析」と「最終プロダクト」を一つの言語で。 - Python as Glue 2.0

http://pydata.org/ https://www.packtpub.com/python-data-visualization-cookbook/book

http://www.oreilly.co.jp/books/9784873116556/

NumPy + pandas

情報からインサイトを見つける

探索型 物語型

データの探索をユーザーが出来るようにする。 作り手としてのインサイトは押し付けない。

作り手としてのインサイトを最大限に 伝える方法を考える。

誰がインサイトを見つけるのか

ユーザーに委ねる 作り手が仕上げる

実例紹介

インサイトを自分ごとに

http://www.extremepresentation.com/design/charts/

自分ごとに巻き込むためのForm/UI

別な切り口

位置情報（地図）

Form/UI

ビジュアライズツール

http://www.extremepresentation.com/design/charts/

「示したいこと」と「チャート」の対応表

1つのデータセットを 複数の切り口でビジュアライズする

別な切り口

位置情報（地図）

あるデータセット

地図系ツールの紹介

• D3.js • Leaflet.js

D3.js

Show Reel

D3.jsの主な特徴や機能

選択、アニメーション、タイマー、補間、配列操作、ランダム、外部リソースの読み込み、テキスト／CSV整形、カラーユーティリティ、スケール、タイマー、レイアウト(Layout)、地理(Geography)、地図投影法(Map Projection)、幾何(Geometry)

• 統計学上必要な計算を賄ってくれる • 地図投影法が多数用意されている • 細かいスタイリングがすべて指定できる • ウェブ標準に則っている

unemployment rates from 2008 by Mike Bostock

http://bl.ocks.org/mbostock/4060606

Chropleth Maps 地形の色で値を表現する

http://leafletjs.com/

Leaflet.jsの主な特徴や機能

• タイル型地図 • 表示する地図を選べる • 動作が軽量／軽快 • D3と連携可能

http://leaflet-extras.github.io/leaflet-providers/preview/

醒めた目でもう一度みてみると…

ドーナツチャート割合を示す角度がすっぽり 表示から抜けている

http://www.telerik.com/help/windows-8-html/chart-donut-series.html

パイチャート項目が多すぎて 比較が困難

http://eagereyes.org/techniques/pie-charts

GoogleMaps項目が多すぎて よくわからない

http://mrare.ca/blog/visualizing-our-calgary-transit-iphone-app-next-stops-usage

データビジュアライズで 大事なこと

ヴィジュアライズ＝ものの見方

ギリシャ…熊 日本…柄杓中国…雲の上に座っている王朝

北斗七星

客観的 vs 主観的

• データヴィジュアライゼーションは可視化されたデータに基づくものなのだが、それでも主観的な考えは入ってくる。

• 主観的な考えを完璧に排除することは難しいが、多面的な視座を提供すること、元データをユーザー自身も検証できるようにすることで、解釈する余地や幅を持たせてあげることが肝要。

杉浦康平 - 時間軸変形地図

多視点なものの見方を提供する視点のある場所によって、見える景色が変わる