Railsでグラフ機能を実装したいと思い、Chartkickを使用しました。
中々記事が少なかったので、少しでも参考になればと思い載せることにしました。
今回はgem groupdateを使い、更新日時を取得しています。
使用したgemは以下の通りです。
- chartkick
- groupdate
Chartkick公式 https://chartkick.com
開発環境
Rails 5.2.4
構築
① gemのインストール
gem chartkick
gem groupdate
② ターミナル
bundle install
③ Javascriptのライブラリ読み込み
app/assets/javascripts/application.jsに下記を追記。
//= require chartkick
//= require Chart.bundle
④ コントローラーに記述
def index
@users_count = User.group_by_day(:created_at).size
# ユーザー登録数グラフ出力 gem groupdateをインストールしないと上記の記述は使用不可
@user_today = User.where(created_at: Date.today.all_day).count
# ユーザーの1日の登録数
end
⑤ viewに記述
<div class="main">
<label class="text-user">日別会員登録者数 (総会員数 : <%= @users.count %>)</label>
<div class="graph">
<%= line_chart @users_count, download: true, colors: ['#FF4F02'] %>
</div>
</div>
line_chart
- 折れ線グラフの出力に使用。他に、pie_chart(円グラフ)・column_chart(棒グラフ)・bar_chart(棒グラフ水平方向)・area_chart(面グラフ)・scatter_chart(散布図)などが利用可能。
colors: ['rgb']
- グラフの線の色を変えられる。
gem groupdateについて
- groupdateは所定のタイムゾーンに基づいて、日時のデータを扱います。groupdateをインストールすると、以下のメソッドが利用可能。 参考 https://github.com/ankane/groupdate
group_by_second (2分ごとの時間)
group_by_minute (分)
group_by_hour (時間)
group_by_day (日にち)
group_by_week (週)
group_by_month (月)
group_by_quarter (四半期)
group_by_year (年)
group_by_hour_of_day (日と時間の両方を返す)
group_by_day_of_week (一週間事の日付を返す)
group_by_day_of_month (月の日ごと)
group_by_month_of_year
group_by部分は、曖昧なところがありますが、間違っていれば、ご指摘お願いします。
chartkickは公式サイトにも画像付きで使い方がわかりやすく出ているので参考にしてみてください。