1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

地理×関係を同時に可視化するJavaScriptライブラリ「relatos」を作ってnpm公開した話

Posted at

地理×関係を同時に可視化するJavaScriptライブラリ「relatos」を作ってnpm公開した話

image.png


なぜ作ったか

地理情報を扱う可視化では、地図上にノード(点)をプロットするケースが多いですが、
歴史的出来事やニュースを扱っていると、それだけでは少し物足りなさを感じることがありました。

  • どこで起きているかを地理的に見たいとき
  • 出来事同士の関係性を俯瞰したいとき

同じデータでも、見たい視点は状況によって変わります。

しかし多くの場合、

  • 地図表示用
  • 関係図表示用

でデータ構造や実装を分ける必要があり、
後から視点を切り替えるのが簡単ではありませんでした。

同じデータを、見たい視点に応じて切り替えて表示できる可視化ができないか」
そう思ったのが、relatos を作り始めたきっかけです。

image.png


relatosでやったこと

relatos では、ノードとエッジを持つデータモデルを前提にしつつ、

  • 地図(2D)
  • 地球儀(3D)
  • 関係図(地理とは切り離したレイアウト)
  • 表形式

といった 複数の表示形式に切り替えられる構造を目指しました。

ポイントは、

  • ノードは緯度・経度を持てるが、必ずしも使う必要はない
  • 地理情報を使うかどうかは「表示モード」で決める
  • 表示形式ごとにデータを作り直さない

という点です。

地理を主役にしたい場合も、
関係性を主役にしたい場合も、
同じデータをそのまま使える設計にしています。


実際に使ってみた例(GDELT)

実装例として、GDELT のニュースデータを使った可視化を行いました。

今回の実装では、

  • ニュースをノードとして扱い
  • 各ニュースが持つ位置情報(緯度・経度)を地図上にプロットする

という形で利用しています。

現時点では、
ニュース同士の関係性(エッジ情報)の表示は行っておらず、
ノード情報のみの地理的可視化として使っています。

実際の表示はこちらです。
https://humanhistories.org/en/worldnews/

大量のニュースを地理的に俯瞰できるだけでも、
「どの地域で何が起きているか」を直感的に把握できるのが分かります。


技術的には最低限こんな感じ

  • 表示ロジックとデータモデルを分離
  • ノードは位置情報を持てる汎用構造
  • 表示側で「地理を使うかどうか」を切り替え
  • 軽量な JavaScript ライブラリとして npm に公開

関係性エッジの描画についても、
今後の拡張を前提にデータモデルには含めています。

image.png


これからやりたいこと

今後は、

  • Splunk の Custom Visualization Add-on としての提供
  • Histoverse App で歴史的イベントの関係性を含めた地理的可視化

などを予定しています。

「データは同じでも、視点を変えると理解が深まる」
そんな可視化を、もう少し汎用的に使える形にしていきたいと考えています。


最後に

relatos は、非営利で継続開発しているプロジェクトの一部です。
現在、開発継続のためのクラウドファンディングを実施しています。

もし技術的に面白いと感じていただけたら、
こちらをご覧いただけると嬉しいです。

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?