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

Webの表現力を補うために多くのデータビジュアル化ライブラリが存在します。グラフのようなものもあれば、さらに複雑なチャートライブラリもあります。アニメーションしたり、高速で表示されたりと様々な特徴があります。

G6はノード同士を連携し、それを表現するのを得意とするチャートライブラリになります。

G6の使い方

サンプルです。左側のコードが右側のチャートになります。

こんな複雑な描画も行えます。

ノードの繋がり方も様々に用意されています。

こんなペアを作るようなデザインも。

マインドマップ的な表現。

ノード同士の複雑なつながりを表現。

見せ方を変えた版。

ノードの繋がり方を複雑にしたもの。

ソーシャルグラフ的に使えます。

アニメーションもサポートしています。

バブルチャート風。真円でないところが面白いです。

電車と合わせたもの。アニメーションしながら表示されます。

G6は一般的なグラフライブラリとは異なり、特殊な表現が可能です。利用する場面は選びそうです。しかしノード同士をつないで表現したいという場面は多いので、知っておくと活用できる時もあるでしょう。

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

G6 Graph Visualization Engine | AntV

antvis/G6: ♾ A Graph Visualization Framework in JavaScript

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2