ナイチンゲールとインフォグラフィック

インフォグラフィック・プロダクション「Column Five」のメンバーが書いた本「Infographics: The Power of Visual Storytelling」のイントロダクションに、インフォグラフィックの歴史に関して記述があります。

そこで古い例のひとつとして挙がっているのが、ナイチンゲール。
彼女は、クリミア戦争で亡くなったイギリス兵士の死因を視覚化しました。

Diagram of the Causes of Mortality

ナイチンゲール インフォグラフィック クリミア戦争 1
image by Wikipedia

ナイチンゲール インフォグラフィック クリミア戦争 2
image by Wikipedia

それの示すところによればクリミア戦争で死亡した兵士たちは、負傷によるものやその他の原因によるもの(ダイアグラムの赤と黒の部分)より、むしろ疾病(青の部分)によって死亡していることが分かる。さらに、それが示すところでは、死亡率は戦争の最初の年(ダイアグラムの右半分)が高く、その時期は1855年3月に政府の派遣する衛生委員が野営地と病院に衛生状態を改善するためにやってくる以前のことである。
「フローレンス・ナイチンゲール、復讐の天使」より

彼女が用いたのは鶏頭図と呼ばれるグラフ表現の一種で、ビクトリア女王への報告のために制作されたそうです。

そうしてまとめ上げた統計だが、はたしてこの数字の羅列をビクトリア女王は理解できるだろうかと案じて、統計を図に現すことを考えた。それまでにも統計の内容を図で現すことはあったが、数えるほどしかなかった。彼女は統計学の師であるファーに、統計資料があまりに無味乾燥であると訴えたところ、ファーは、統計とは究極的に無味乾燥なものであるべきなのだと答えた。しかしナイチンゲールは納得せず、師の反対を押し切って図を使うことにした。
「Make: Japan | 情熱的な統計家としてのナイチンゲール: データ視覚化の元祖」より

専門家以外の人が見ても内容がわかるように、情報(データ)を視覚的に見せたいという意図は、インフォグラフィック(あるいはデータ・ビジュアライゼーション)に通じるものです。

「鶏頭図」を描くには、Javascriptライブラリ「Chart.js」が使えそう。

Chart.js 鶏頭図

Chart.jsを使って「鶏頭図」を描く方法はまた今度。

Wikipediaで「鶏頭図」の説明を読んでいたら、鶏のとさかに見えるのが由来のよう。「ケイトウ」という植物があるのですね。

ケイトウ
image by Wikipedia

記事に関係する本

プロフィール

櫻田潤
櫻田 潤(さくらだ・じゅん)

プログラマー、システムエンジニア、ウェブデザイナーを経て、2010年よりビジュアルシンキングを運営。あわせて、インフォグラフィックのデザインも始める。2014年、NewsPicksにインフォグラフィック・エディターとして参画。ビジュアルを用いた記事を多数、執筆デザイン。2017年よりNewsPicksの全体クリエイティブを統括。著書に『たのしい インフォグラフィック入門』『シンプル・ビジュアル・プレゼンテーション』