情報はただ並べただけではその関連性が分かりづらいものです。線を使って表現すると情報同士の関連性が分かるようになり、理解度が増します。多くの場合、そうした内容はプレゼンテーション用のソフトウェアで作ったり画像編集ソフトウェアを使います。 しかしそれではメンテナンスが面倒になります。そこで使ってみたいのがLeaderLineです。

LeaderLineの使い方

使い方です。とても簡単ですね。

応用するとこんな複雑な線も描けます。マウスオーバーによるアニメーションもサポートしています。

DOMにラインを付けることもできます。

写真に説明を追加するなんて使い方も。

さらに範囲を設けたりもできます。

グラフをインタラクティブにするデモです。

LeaderLineは実に多彩な表現が可能です。情報をただ表示するだけでなく、その補足するのに使ったり、さらに情報の広がりを見せるのにも使えるでしょう。アイディア次第で使える場面の多そうなライブラリです。

LeaderLineはJavaScript製のオープンソース・ソフトウェア（MIT License）です。

LeaderLine anseki/leader-line: Draw a leader line in your web page.