2013
12/04

商用利用が可能な、グラフを描画するjQueryプラグイン6選

グラフを表示させないといけないという案件が出てきたので、グラフを描画するjQueryプラグインについて調べてみました。

グラフ描画用のjQueryプラグインはたくさん見つかりましたが、グラフの描画は難易度の高い処理のためか商用利用は有償というライセンスが多いようでした。
しかし商用利用可能なオープンソースライセンス(BSD、MITライセンスなど)のプラグインでも、充分に高機能なものもありましたので、私個人がいいと思ったプラグインを6つ紹介します。

・商用利用可能なライセンス
・1つのプラグインでいくつかの種類のグラフが表示できる

という2点を満たすものを選んでいます。

ADs

Chart.js

Chart.js  HTML5 Charts for your website.

MITライセンス。
線グラフ、棒グラフ、レーダーチャート、鶏頭図(Polar area chart)、円グラフ、ドーナツグラフを書くことができます。

サンプルコード

Google Charts

Google Charts — Google Developers

Google製。
棒グラフ、線グラフ、円グラフから地図を塗り分けた分布図まで作成できる。

サンプルコード

YUI Charts

Charts - YUI Library

YUI(Yahoo!UserInterface)のウィジェットとして提供。BSDライセンス。
線グラフ、棒グラフ、円グラフなどスタンダードなものが一通りできる。

サンプルコード

jQPlot

jqPlot Charts and Graphs for jQuery

線グラフ、棒グラフ、円グラフなど。GPL&MITライセンス。
ドラッグして数値を変えたりできる。

サンプルコード

gRaphaël

gRaphaël—Charting JavaScript Library

Raphaëlを使ったグラフ用ライブラリ。MITライセンス。
円グラフ、棒グラフ、折れ線グラフ、ドットが分布したようなグラフが作成可能。各グラフごとにJSファイルが分割されているので軽量化できる。

サンプルコード

morris.js

morris.js

「good-looking charts」とのこと。叶姉妹を思い出す。。。BSDライセンス。
線グラフ、棒グラフ、積み上げグラフ、ドーナツチャートが作成可能。jQueryのほかRaphaëlが必要です。

サンプルコード

上記の中でChart.jsがシンプルで使いやすそうかな、と思いました。実装した際はChart.jsについて掘り下げた記事を書いてみたいと思います。

ADs

Post Comments

メールアドレスが公開されることはありません。

Comments

I see you don’t use the power of social websites like twitter
and facebook on your website. You can get huge traffic from social sites on autopilot
using one useful app, for more info search in google for:
Alufi’s Social Automation

  • Colin
  • 2015年3月20日 10:47 PM