chartkickを使用して複数の折れ線グラフを表示する

Question

前提・実現したいこと

chartkickを使用して複数の折れ線グラフを表示する

発生している問題・エラーメッセージ

カラム別にそれそれを表示させたいが、現状は、DBのレコードの数をグラフにしている。

例)2020-12-20の日付のレコードが3つDBに存在していれば、3 として認識している

該当のソースコード

class ChartsController < ApplicationController
  before_action :authenticate_user!
  before_action :configure_permitted_parameters, if: :devise_controller?
  def new
    @chart = Chart.new
  end

  def index
    @chart = Chart.all
  end
  
  def create
   @chart = Chart.new(chart_params)
    if @chart.save
      redirect_to charts_path
    else
      render :new
    end
  end

  private
  def chart_params
    params.require(:chart).permit(:body_weight, :bench_press, :deadlift, :squat).merge(user_id: current_user.id)
  end
end

<div class="main">
  <div class="graph">
  
    <%# <%この記述だとレコードの数を数えてしまう%> %>
    <%= line_chart Chart.group_by_day(:created_at).count %>
    <%= line_chart @chart.group_by_day(:created_at),xtitle: "月/日",ytitle: "重量"%>
    <%# <%この記述だとレコードの数を数えてしまう%> %>

  </div>

</div>

<%# <%公式の書式%> %>
<%= line_chart @chart.map { |goal|
    {name: goal.name, data: goal.feats.group_by_week(:created_at).count}
} %>
<%# <%公式の書式%> %>
 

試したこと

DBにはきちんと保存できている。
DBの取得を @body_weight = Chart.select(:body_weight)などカラム別に定義したが
うまく表示できなかった。
DBの取得、ビューファイルの記述方法、ご教授いただければ幸いです。

補足情報（FW/ツールのバージョンなど）

公式サイト
https://chartkick.com/

Comments

[fumu7]

「カラム別に定義したがうまく表示できなかった」というのは、どういう現象が起きたことを意味していますか？

[退会済みユーザー]

t.integer :body_weight, null: false
t.integer :bench_press, null: false
t.integer :deadlift, null: false
t.integer :squat, null: false
グラフに表示させたいのが上記の４つになります。
コントローラー
@body_weight = Chart.select(:body_weight)
ビュー
<%= line_chart Chart.group_by_day(:created_at).count %>
で参照すると表示はされるが、カラムの値通りではなく、どのデータを参照しているかわからない状態です。

Answer 1

「公式の書式」を見ると、以下のようなデータが必要です。

# date が x、 value が y
[
  { name: "body weight", data: {date => value, date => value} },
  { name: "bench press", data: {date => value, date => value} },
  { name: "deadlift", data: {date => value, date => value} },
  { name: "squat", data: {date => value, date => value} },
]

.group_by_day(date).sum(カラム) は
{day => 同じdayのカラムの合計値, day => 同じdayのカラムの合計値}
というのを返します。なので次のように書けます。

weight = Chart.group_by_day(:created_at).sum(:body_weight)
bench_press = Chart.group_by_day(:created_at).sum(:bench_press)
deadlift = Chart.group_by_day(:created_at).sum(:dead_lift)
squat = Chart.group_by_day(:created_at).sum(:squat)

@chart = [
  { name: "body weight", data: weight },
  { name: "bench press", data: bench_press },
  { name: "deadlift", data: deadlift },
  { name: "squat", data: squat },
]

<%= line_chart @chart %>

過去の回答も参考にしてください
chartkickの折れ線グラフに入力した数字を表示させたい
chart.kickで、値をユーザーごとに管理したい。

追記

  def index
    # 合計するデータが用意できなかったので 無意味に id を合計してます
    users = User.group_by_day(:created_at).sum(:id)
    tweets = Tweet.group_by_day(:created_at).sum(:id)
    @chart = [
      { name: "users", data: users },
      { name: "tweets", data: tweets },
    ]
  end

上記から描画されるチャート

Comments

[退会済みユーザー]

ご回答ありがとうございます。
<%= line_chart Chart.group_by_day(:created_at).count %>
を
<%= line_chart Chart.group_by_day(:created_at).sum(:squat) %>
に変えることで、日毎に表示することができました。
ありがとうございます。
しかしながら、複数のグラフを同時に表示できていない状況です。
<%= line_chart @chart.map { |goal|
{name: goal.name, data: goal.feats.group_by_week(:created_at).count}
} %>
を使用して表示できればと思っております。
ご教授いただければ幸いです。

[neko_daisuki]

複数のグラフを同時に表示する例を書いたつもりです。

[退会済みユーザー]

ご回答ありがとうございます。ご丁寧にご教授ありがとうございます。
無事複数のグラフを作図することができました。
最高のクリスマスプレゼントになりました。