Webサイトを開発する中で、グラフを希望するケースは多々ある。同じデータではあっても、数値を一覧してあるのとグラフ化されているのとではインパクトが全く変わってくるからだ。

ピクチャ 14.png

棒グラフの例

 

だがそのためにライブラリや、サービスを立ち上げたりするだろうか。日本語表示などで問題が発生することも多々ある。そうした不安から解放される方法はこれだ。

今回紹介するオープンソース・ソフトウェアはPlotKit、JavaScriptベースのグラフ生成ライブラリだ。

JavaScriptであれば、クライアントベースで完結する。これなら手軽に実装できることは間違いない。PlotKitではCanvasやSVGを使ってグラフ生成を可能にしている。対応ブラウザはCanvasがSafari 2以上、Opera9以上、Firefox 1.5以上、IE6(エミュレーションモード)で、SVGはOpera9以上、Firefox1.5以上、IE6はSVGプラグインを使って対応となっている(Mac OSXのFirefox1.5は動作しない)。

ピクチャ 10.png

グラフを動的に生成するサンプル

 

生成できるグラフは、棒グラフ、線グラフそして円グラフとなっている。決して多い訳ではないが、よく使われるグラフはこの3つが多いのではないだろうか。まだ複雑な描画は可能ではないが、JavaScriptならではの動的なグラフ変更や色変更ができるのは魅力的だ。

簡易的なグラフであれば、PlotKitは十分に役立つだろう。クライアントサイドで生成してしまえば、ビューだけの変更で済み、ユーザの満足度も高まるだろう。

 

**PlotKit - Javascript Chart Plotting | liquidx

 http://www.liquidx.net/plotkit/**