質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.46%
Ruby on Rails 5

Ruby on Rails 5は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Chart.js

Chart.jsは、多様なグラフを組み込めるJavaScriptのライブラリ。折れ線グラフや棒グラフ、円グラフ、レーダーチャートなどのグラフの種類が用意されています。HTML5のCanvasを用いて描画され、マークアップも分かりやすく、簡単に編集することが可能です。

Ruby

Rubyはプログラミング言語のひとつで、オープンソース、オブジェクト指向のプログラミング開発に対応しています。

Q&A

解決済

1回答

1914閲覧

railsでのchart.jsへの値の渡し方について

AK12

総合スコア32

Ruby on Rails 5

Ruby on Rails 5は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Chart.js

Chart.jsは、多様なグラフを組み込めるJavaScriptのライブラリ。折れ線グラフや棒グラフ、円グラフ、レーダーチャートなどのグラフの種類が用意されています。HTML5のCanvasを用いて描画され、マークアップも分かりやすく、簡単に編集することが可能です。

Ruby

Rubyはプログラミング言語のひとつで、オープンソース、オブジェクト指向のプログラミング開発に対応しています。

0グッド

0クリップ

投稿2020/05/25 12:33

前提・実現したいこと

読書時間の記録アプリを作成しています。

期間を指定した上(0時間の日は記載しないのではなく、0であることがわかるようにする)で、日付、カテゴリ別の読書時間を積み上げ棒グラフとして作成したのですが、
コードが無駄に長い気がします。
下記記載内容でひとまず形にはなったのですが、もっと短く書く方法はないでしょうか

ご存知の方がおられましたらご教示お願い致します

関係するテーブル

bookshelves categories records BookshelfとCategoryが1対1で繋がっています。 BookshelfとRecordは1対多の関係です。 categoriesはマスタとして利用しており、6種類固定です。

該当のソースコード

def index hash ={} #1週間分の連想配列をvalue0で作る (Date.parse((Date.today - 6).to_s)..Date.parse((Date.today).to_s)).each do |date| hash.store(date,0) end #棒グラフのラベルを取得 @labels = hash.keys #カテゴリーの数だけ繰り返し実施 for i in 1..6 do datahash = Record.reorder(nil).eager_load(bookshelf: :category) .where(yyyymmdd:(Date.today - 6)..(Date.today)) .where("categories.id=#{i}") .group("records.yyyymmdd") .order("categories.id").sum(:summinutes) #hashの値を初期化 hash.each {|key,value| hash.store(key,0) } #datahashの値をhashに更新 datahash.each {|key, value| hash.store(key,value) } #回数に応じてインスタンス変数に値を入れる case i when 1 @r1 = hash.values when 2 @r2 = hash.values when 3 @r3 = hash.values when 4 @r4 = hash.values when 5 @r5 = hash.values when 6 @r6 = hash.values end end end

index.html.slim

canvas#myChart width="900" height="400" javascript: var ctx = document.getElementById("myChart").getContext('2d'); var myChart = new Chart(ctx, { type: 'bar', data: { labels:#{@labels.to_json.html_safe} , datasets: [ { label:"カテゴリなし", data:#{@r1} , backgroundColor: '#ebebeb' }, { label:"小説", data:#{@r2}, backgroundColor: '#ff8484' }, { label:"ビジネス", data:#{@r3}, backgroundColor: 'rgba(102, 127, 255, 0.859)' }, { label:"自己啓発", data:#{@r4}, backgroundColor: 'rgba(255, 181, 102, 0.859)' }, { label:"資格", data:#{@r5}, backgroundColor: 'rgba(175, 244, 141, 0.776)' }, { label:"IT", data:#{@r6}, backgroundColor:'rgba(141, 218, 244, 0.776)' } ] }, options: { scales: { xAxes: [{ stacked: true }], yAxes: [{ stacked: true }] } } });

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

rb

1 def index 2 #棒グラフのラベルを取得 3 @labels = [*6.days.ago.to_date..Time.zone.today] 4 hash = (6.days.ago.to_date..Time.zone.today).to_h { |day| [day, 0] } 5 6 #カテゴリーの数だけ繰り返し実施 7 @r1, @r2, @r3, @r4, @r5, @r6 = (1..6).map do |i| 8 datahash = Record.reorder(nil).eager_load(bookshelf: :category) 9 .where(yyyymmdd:(6.days.ago.to_date)..(Time.zone.today)) 10 .where("categories.id=#{i}") 11 .group("records.yyyymmdd") 12 .order("categories.id") 13 .sum(:summinutes) 14 hash.merge(datahash).values 15 end 16 end

投稿2020/05/25 13:02

編集2020/05/25 15:48
Mugheart

総合スコア2349

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

AK12

2020/05/25 15:04

ありがとうございます。 しかし、これでは@r1〜@r6の値のない日付は0という形でとれないのではないかと思うのですが…
Mugheart

2020/05/25 15:48

修正しました
AK12

2020/05/29 04:26

ありがとうございました。 もともとよりもかなり記述の量を削減することができました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.46%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問