年表（タイムライン）を表示する時に使ってみたいjQueryプラグイン「Timeglider」 // MOONGIFT Archived

Timegliderはマウス操作可能なインタラクティブな年表（タイムライン）を作成するjQueryプラグイン。

TimegliderはjQuery/JavaScript製のオープンソース・ソフトウェア。年表というのはとても面白い。今の状態がなぜ生まれたのか、そこに関わっている要因が何だったのか時系列をおって見えるようになると、様々な情報が得られる。やはり何からの要因があってこその結果なのだ。

表示デモ

しかし年表というのは作るのが難しい。横に時間軸をとって、そこに当てはまる情報を埋め込んでいくだけなのだが、ズーム機能や情報の属性による表示の変更なども欲しくなる。そうした年表（タイムライン）表示に使えるライブラリがTimegliderだ。

Timegliderはタイムラインを表示するためのライブラリで、マウスのドラッグで横軸を移動したり、スクロール操作でのズームイン/アウト、項目をクリックした時のツールチップ表示等とてもインタラクティブな作りになっている。

ツールチップ表示

さらにフィルタ機能によって当てはまる情報だけにしたり、逆に非表示にすることもできる。元データはJSONで定義するようになっており、HTMLが使えて柔軟な表示が可能になっている。時系列に沿ったデータを表示する際に使ってみたいライブラリだ。

[s2If current_user_can(access_s2member_level1)]

フィルタ機能（プレミアム限定）

[/s2If]

MOONGIFTはこう見る

地図を表示するWebアプリケーションが普及したのはGoogleマップが登場し、JavaScriptで簡単にマーカーを立てたり表示を変更することができたからだろう。タイムライン表示には元データは各自で用意できるが、それでもユーザビリティの高い操作のためには専用のライブラリが必要だ。

時系列に沿ったデータなどどこにでもある。WikipediaやTwitter、ブログなど挙げればきりがない。そうしたデータをビジュアル的に表示することで、今までと違った見え方が得られるはずだ。Timegliderはマッシュアップ作成時にも役立ちそうだ。