Railsでグラフを描画してえ！
Railsアプリを作っていたら、
「データベースの値をグラフで表示できたら面白いなー」
と思い立ち、ググってみたらこちらの神記事を発見。
どうやら「Chartkick」というgemを使えばできる、とのことだったので早速やってみました。
※ 利用環境は以下の通りです。
| Rails バージョン | 2.5.0 |
|---|---|
| Ruby バージョン | 5.2.4.1 |
ChartkickをRails使う前にやっておきたい準備
まずは準備からですね。
こちら公式ページを参考にやってみました。
まず、gemファイルに次の2行を足します。
|
1 2 |
gem 'chartkick' gem 'groupdate' |
そして上書き保存しましょう。
1つ目のchartkickは文字通り、Chartkick使うためのgem。
もう1つのgroupdateはグラフ横軸の単位を「日付ごと」で表示できるgemですね。
さらに、Railsアプリのファイルからapplication.jsを探して、このファイルに
|
1 2 |
//= require chartkick //= require Chart.bundle |
の2行を追加して保存。
これで準備はおしまい。
Gemfileを保存したら最後に、コマンドラインで
|
1 |
$ bundle install |
しておきましょう。
Railsでグラフを描画・作成する方法〜Chatkick活用編〜
それではChartkickの使い方です。
詳しくはこちらの公式ページにたくさん具体例は載っているんですが、基本はこれです↓
<%= グラフの種類 モデル名.group(:カラム名.count) %>
公式ページの例を1つ見てみます。
|
1 |
<%= pie_chart Yogurt.group(:flavor).count %> |
こちらはパイチャート（pie_chart）で円グラフをかく方法。
さらにモデル名はヨーグルト（Yogurt）。
Yogurtテーブル中のflavorカラムのデータを円グラフで表示できるわけです。
そのflavorカラムを「.count」ですので、それぞれのflavorに該当する「数」を円グラフで表現できるのですね。
まさかこんな簡単にRailsでグラフを作成できるとは・・・！
僕自身、学習系サービスを作っているので、例えば、勉強時間をグラフにしたら面白そう。
横軸を日付にとって、縦軸を勉強時間にしたら日々の学習成果を可視化できるんじゃないですかね。
Railsアプリでグラフを描画したい方はChartkickを試してみてください。
それでは！
Lin
おそらく、ブロガー。現在ホテル暮らしで全国フラフラしています。
ネット広告代理店に1年3ヶ月勤め上げ、独立をして丸4年が経ちました。今年でフリーランス 5年目。
質問・ご意見・相談があればLINEで受け付けていますのでお気軽にどうぞ 。
コメントを残す