グラフというのは実にたくさんの種類があります。Webにおいてグラフを表示するというのは意外と面倒な問題ではありますが、それでも最近ではライブラリを増えてきて使いやすくなってきているでしょう。 しかしそれは2Dに限った話かも知れません。3Dグラフとなるとさらに厄介です。そこで使ってみたいのがElegans、3Dグラフライブラリです。

Elegansの使い方

まずはデモを見てみましょう。

こちらは計算式をベースにした3Dグラフです。

ワイヤフレーム。

線のグラフ。マウスでぐりぐり動かせます。

配列で与えた場合。

こちらも配列です。

表示するプロットを絞ったり、回転させたりできます。

コードは以下のようになります。

var stage = new Elegans.Stage(d3.select(#vis));
var surface = new Elegans.Surface(data);
stage.add(surface);
stage.render();

ステージを作り、データからSurfaceを生成し、それをステージに追加していくといった方法です。見た目はシンプルですね。

3Dグラフとなるとかなり難易度があがりますが、データによっては三次元展開したいということは多いでしょうし、マウスで動かせるので視点を変えた分析も可能になります。面白いライブラリですね。

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

the Surface example with Elegans The Wireframe example with Elegans the Line example with Elegans the Particles example with Elegans The Scatter example with Elegans domitry/elegans