lazy_high_chartsで毎日のユーザー登録数をグラフ化する

前回のメモの続きです。

railsで日ごとの登録ユーザー数を取得する方法 - rails永遠の初心者の備忘録

日にちごとに取得したユーザー登録数をかっこよくグラフ化してわかりやすくしました。前回も紹介したこのブログを参考にしています。

RailsでHighcharts(lazy_high_charts)を使って綺麗なグラフを描画する - nishio-dens's diary

lazy_high_chartsをrailsに導入する

gemにあるので、gemfileに書いて、bundle installするだけです。

/gemfile

gem 'lazy_high_charts'

javascriptを有効にするために、application.jsに以下の三行を追加します。 /app/assets/javascript/application.js

//= require highcharts/highcharts
//= require highcharts/highcharts-more
//= require highcharts/highstock

gemをインストールしたらサーバーを再起動するのを忘れずに。1年ぐらい前はサーバーの再起動をせずにはまって三日放置とかよくしていました。。。

lazy_high_chartsでグラフを書く

導入できたらグラフを書いてもらいます。グラフを書くには、x軸のデータとy軸のデータがそれぞれ配列になっている必要があります。前回の記事に書いた通り、x軸になる日付のデータと、y軸のユーザー登録数を下記のコードで取得しています。

/app/controllers/charts_controller.rb

days = (Date.today.beginning_of_month..Date.today).to_a
#後々、usersとtransposeする予定なので、rangeではなく、arrayに変更

users = days.map { |item| User.where(:created_at => item.beginning_of_day..item.end_of_day).count }
#mapでそれぞれの日にちに登録されたユーザー数をカウント

これにチャートを書くコードを追加すれば完成です。

/app/controllers/charts_controller.rb

days = (Date.today.beginning_of_month..Date.today).to_a
#後々、usersとtransposeする予定なので、rangeではなく、arrayに変更

users = days.map { |item| User.where(:created_at => item.beginning_of_day..item.end_of_day).count }
#mapでそれぞれの日にちに登録されたユーザー数をカウント

@graph = LazyHighCharts::HighChart.new('graph') do |f|
  f.title(text: "月間登録推移")
  f.xAxis(categories: @daily_days)
  f.series(name: '登録数', data: @daily_counts)
end

これだけで完了です。これだけで結構きれいなグラフをポンと書いてくれます。今度は円グラフやら、色んなタイプのグラフに挑戦しようと思います。