Webシステムで一番苦労させられるのがグラフではないでしょうか。HTMLの表現力が上がったと言っても、コードを書かなければなりません。特にグラフやチャートになるとコード量も増えがちです。 そこで使ってみたいのがChartkick.jsです。多くのパターンに対応したクライアントサイドのグラフライブラリです。

Chartkick.jsの使い方

曲線のグラフ。

円グラフ。

ドーナッツグラフ。

棒グラフ。

横型。

エリアグラフ。

点だけのグラフ。

バブルチャート。

複数の要素を同時に。

横棒グラフでもできます。

横棒グラフで積み上げ型。

複数の要素でかつグルーピング。

色を変えた円グラフ。

データが一定でない要素同士でも。

10分ごとといった細かい単位でも。

細かい横棒グラフ。

Chartkick.jsは Chart.js、GoogleチャートそしてHighchartsに対応しており、これらのグラフが出力できるものを一つにまとめて提供できます。位置情報に関連したグラフはGoogleチャートを使って出力できます。多数のグラフに対応していればChartkick.jsの使い方だけ覚えれば良いので便利でしょう。

Chartkick.jsはHTML5/JavaScript製のオープンソース・ソフトウェア（MIT License）です。

ankane/chartkick.js: Create beautiful charts with one line of JavaScript