I would like to create multiple chart lines with Rails Charts
I have tried for some time and no succeeded.
I want to create something like this:
Each color line should represent room_id column from airmeasures table.
The x should take data from timestamps column, and the y line should take data from measure_float column.
I can also provide a link from my github if needed.
Or can be created with Chartkick / chart.js or any other(I have tried with those also)
Here is a link from one csv file.
I have imported data from csv files to seeds.rb file.
require 'csv'
def import_csv(file_name)
file_path = "db/csv/#{file_name}.csv"
CSV.foreach(file_path, headers: true) do |row|
Airmeasure.create!(row.to_h)
end
end
import_csv('20211101_B3D54FD00007B2')
import_csv('20211101_B3D54FD000088A')
import_csv('20211101_B3D54FD000088F')
schema.rb
ActiveRecord::Schema[7.0].define(version: 2023_11_23_221627) do
create_table "airmeasures", force: :cascade do |t|
t.datetime "timestamps"
t.string "measure_type"
t.integer "measure_float"
t.string "brand"
t.string "serial_number"
t.integer "establishment_id"
t.string "establishment_name"
t.string "establishment_city"
t.string "establishment_postcode"
t.string "establishment_address"
t.float "establishment_latitude"
t.float "establishment_longitude"
t.integer "room_id"
t.string "room_name"
t.datetime "created_at", null: false
t.datetime "updated_at", null: false
end
end
home.html.erb
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Home Page</title>
</head>
<body>
<div class="container">
<%= line_chart Airmeasure.order(timestamps: :asc).pluck(:timestamps, :measure_float) %>
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/echarts.min.js"></script>
</body>
</html>
pages_controller.rb
class PagesController < ApplicationController
def home
@airmeasures = Airmeasure.select("timestamps", "measure_type", "measure_float", "room_name")
end
end