ITエンジニア/デザイナ向けにオープンソースを毎日紹介

Chronoline.jsは左右に展開するシンプルな年表ライブラリです。

万人誰にとっても共通で変わらないリソースが時間です。時間ごとに変化するデータ、その時に起きたイベントなどを見せるのに最適なのが年表です。そこで紹介したいのがChronoline.js、シンプルなUIのWebベースの年表ライブラリです。


日ごとの年表。左右への移動はスムーズです。


今日の日付部分が四角く囲まれています。


こちらは月ごと。メモリが大きくなっています。

Chronoline.jsは月、四半期、年といった単位で表示できるようになっています。プロットしたデータにはフローティングを使って情報を追加できます。イベントは日付とタイトルという形でハッシュを作り、それを配列としてJSONデータにするだけです。複雑な情報は表示できませんが、時間軸に沿って何が起きたのかといった表現に良さそうです。

Chronoline.jsはjQuery/JavaScript製、MIT Licenseのオープンソース・ソフトウェアです。


MOONGIFTはこう見る

Chronoline.jsは年表という表示においてもかなりシンプルな部類に入ると思われます。色が一色しかないということは二値化できるデータがいいということです。例えば日付ごとのエラー回数であれば最初こそ数多く表示されるものの、徐々に減っていっているというのが定性的に分かるかもしれません。またはFacebookのタイムラインのように一人にフォーカスしたデータのビジュアル化もできそうです。

利点としては画面全体を覆うほど大きくないのでコンテンツの中に埋め込んで使うこともできそうです。また左右へのスライドなのでスクロールをする必要がなく、ページが縦長になりすぎないのも良さそうです。多彩なデータ表現ができるライブラリもいいですが、Chronoline.jsのようなシンプルなライブラリもまた活用できる場面があるでしょう。

Chronoline.js

StoicLoofah/chronoline.js

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2