Labella.js - タイムラインのラベル表示デザインが欲しければ
Webの表現力が向上するのに合わせて、高度な表現を実現して欲しいと頼まれることが多くなっています。CanvasやWebGLを駆使すればできるのが分かっていても、それをメンテナンス性や拡張性を維持しながら作っていくというのは大変です。 そこで表現したいものに合わせてライブラリを探すのが一番早い解決策になります。今回は年表表示などで使えそうなLabella.jsを紹介します。
Labella.jsの使い方
デモです。一本の線から特定の部分を抜き出してラベルをつけられます。
設定によって動的に表示を変更できます。混み合っていると自動的に2段に分かれます。
アルゴリズムも用意されていて、それに合わせてレイアウトが変化します。
Labella.jsの表現がぴったり当てはまる時にはこれ以上のライブラリはないかも知れません。こういった高度な表示を手軽に行うための引き出しを数多く用意しておくと、いざという時にムリに開発する手間を減らせて良さそうです。
Labella.jsはHTML5/JavaScript製、Apache License 2.0のオープンソース・ソフトウェアです。