[RUBY] [Rails] So erstellen Sie ein Diagramm mit lazy_high_charts
Ziel
** Erstellen Sie ein Diagramm, das den monatlichen Registrierungsübergang von Büchern täglich zeigt. ** ** **
Entwicklungsumgebung
・ Ruby: 2.5.7 Schienen: 5.2.4 ・ Vagrant: 2.2.7 -VirtualBox: 6.1 ・ Betriebssystem: macOS Catalina
Annahme
Folgendes wurde implementiert.
・ Schlanke Einführung ・ Einführung von Bootstrap 3 ・ Einführung von Font Awesome
Implementierung
1. Stellen Sie Gem vor
Gemfile
#Nachtrag
gem 'lazy_high_charts'
Terminal
$ bundle
2. Bearbeiten Sie application.js
application.js
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require highcharts/highcharts //Nachtrag
//= require highcharts/highcharts-more //Nachtrag
//= require_tree .
3. Bearbeiten Sie den Controller
books_controller.rb
def index
@book = Book.new
@books = Book.all
#Nachtrag
days = (Date.today.beginning_of_month..Date.today).to_a
books = days.map { |item| Book.where(created_at: item.beginning_of_day..item.end_of_day).count }
@graph = LazyHighCharts::HighChart.new('graph') do |f|
f.title(text: 'Monatlicher Registrierungsübergang')
f.xAxis(categories: days)
f.series(name: 'Registrationsnummer', data: books)
end
end
(1) Holen Sie sich das Datum vom 1. dieses Monats bis heute und ordnen Sie es der Variablen zu.
days = (Date.today.beginning_of_month..Date.today).to_a
(2) Ermitteln Sie die Anzahl der Bücher, die innerhalb des in "(1)" angegebenen Datums erstellt wurden, und weisen Sie sie der Variablen zu.
books = days.map { |item| Book.where(created_at: item.beginning_of_day..item.end_of_day).count }
③ Erstellen Sie ein Diagramm
@graph = LazyHighCharts::HighChart.new('graph') do |f|
f.title(text: 'Monatlicher Registrierungsübergang') #Titel
f.xAxis(categories: days) #Horizontale Achse
f.series(name: 'Registrationsnummer', data: books) #Vertikale Achse
end
4. Ansicht bearbeiten
slim:books/index.html.slim
/Nachtrag
= high_chart('sample', @graph)
Recommended Posts