地理×関係を同時に可視化するJavaScriptライブラリ「relatos」を作ってnpm公開した話
なぜ作ったか
地理情報を扱う可視化では、地図上にノード(点)をプロットするケースが多いですが、
歴史的出来事やニュースを扱っていると、それだけでは少し物足りなさを感じることがありました。
- どこで起きているかを地理的に見たいとき
- 出来事同士の関係性を俯瞰したいとき
同じデータでも、見たい視点は状況によって変わります。
しかし多くの場合、
- 地図表示用
- 関係図表示用
でデータ構造や実装を分ける必要があり、
後から視点を切り替えるのが簡単ではありませんでした。
「同じデータを、見たい視点に応じて切り替えて表示できる可視化ができないか」
そう思ったのが、relatos を作り始めたきっかけです。
relatosでやったこと
relatos では、ノードとエッジを持つデータモデルを前提にしつつ、
- 地図(2D)
- 地球儀(3D)
- 関係図(地理とは切り離したレイアウト)
- 表形式
といった 複数の表示形式に切り替えられる構造を目指しました。
ポイントは、
- ノードは緯度・経度を持てるが、必ずしも使う必要はない
- 地理情報を使うかどうかは「表示モード」で決める
- 表示形式ごとにデータを作り直さない
という点です。
地理を主役にしたい場合も、
関係性を主役にしたい場合も、
同じデータをそのまま使える設計にしています。
実際に使ってみた例(GDELT)
実装例として、GDELT のニュースデータを使った可視化を行いました。
今回の実装では、
- ニュースをノードとして扱い
- 各ニュースが持つ位置情報(緯度・経度)を地図上にプロットする
という形で利用しています。
現時点では、
ニュース同士の関係性(エッジ情報)の表示は行っておらず、
ノード情報のみの地理的可視化として使っています。
実際の表示はこちらです。
https://humanhistories.org/en/worldnews/
大量のニュースを地理的に俯瞰できるだけでも、
「どの地域で何が起きているか」を直感的に把握できるのが分かります。
技術的には最低限こんな感じ
- 表示ロジックとデータモデルを分離
- ノードは位置情報を持てる汎用構造
- 表示側で「地理を使うかどうか」を切り替え
- 軽量な JavaScript ライブラリとして npm に公開
関係性エッジの描画についても、
今後の拡張を前提にデータモデルには含めています。
これからやりたいこと
今後は、
- Splunk の Custom Visualization Add-on としての提供
- Histoverse App で歴史的イベントの関係性を含めた地理的可視化
などを予定しています。
「データは同じでも、視点を変えると理解が深まる」
そんな可視化を、もう少し汎用的に使える形にしていきたいと考えています。
最後に
relatos は、非営利で継続開発しているプロジェクトの一部です。
現在、開発継続のためのクラウドファンディングを実施しています。
もし技術的に面白いと感じていただけたら、
こちらをご覧いただけると嬉しいです。


