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

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

しかしそれではメンテナンスが面倒になります。そこで使ってみたいのがLeaderLineです。

LeaderLineの使い方

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

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

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

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

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

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

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

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

LeaderLine

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

MOONGIFTプレミアムに登録して運営をサポートしてください!月額500円の他、半年(3,000円)、年間パック(6,000円)もあります。企業向けに3アカウント以上で請求書払いも可能です(年間一括のみ)。従業員の方向けのサービスにいかがですか? プレミアムユーザのログインはこちらから

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2