Отображение данных с помощью Chartkick

У меня есть данные, которые ежедневно добавляются пользователем через форму. Некоторые из этих полей записывают температуру: :ambcur, :ambmin, :ambmax ​​и т. д. Все это является частью лотка с журналом данных.

Я использую chartkick, и это здорово, но я не знаю, как отображать данные с течением времени.

Я пытаюсь сделать многосерийную линейную диаграмму.

<%= line_chart [
                 {name: "Series A", data: @tray.datalogs.ambcur},
                 {name: "Series B", data: @tray.datalogs.ambmin}
             ] %>

Кроме того, одиночная линейная диаграмма тоже не работает.

<%= line_chart @tray.datalogs.group(:ambcur).count %>

Может ли кто-нибудь помочь мне направить меня в правильном направлении? спасибо :)


ruby ruby-on-rails chartkick ruby-on-rails-4
person mGarsteck    schedule 21.05.2016    source источник
comment
у вас установлен гем groupdate?   -  person Volodymyr Balytskyy    schedule 22.05.2016
comment
@RareFever нет, я закомментировал его, потому что он не работает с моей базой данных разработчиков, но работает в pg. Поэтому рекомендуется использовать срезы данных.   -  person mGarsteck    schedule 22.05.2016
comment
Вы можете отобразить пример под названием Timeline? dataslices - это жемчужина? , если да, оставьте ссылку, пожалуйста.   -  person Volodymyr Balytskyy    schedule 22.05.2016
comment
@RareFever Плохо, это называется Dateslices, и да, это жемчужина, сделанная теми же людьми, которые создали Chartkick. И да, я могу отобразить пример временной шкалы. Мне просто нужно знать, как отображать данные из моей формы. github.com/HappyFunCorp/dateslices   -  person mGarsteck    schedule 22.05.2016
comment
Это тоже не работает. он по-прежнему не показывает линию, только ось   -  person mGarsteck    schedule 22.05.2016
comment
дайте мне знать, если это работает. Если это так, не забудьте проголосовать +1 за ответ. Удачного кодирования!   -  person Volodymyr Balytskyy    schedule 22.05.2016

Ответы (1)


arrow_upward
5
arrow_downward

Проблема с вашим кодом в том, что вы не передавали правильный формат данных в line_chart. Чтобы нарисовать линейную диаграмму, данные должны быть в формате Hash, например:

<%= line_chart {"2016-05-21 23:50:40 UTC"=>20, "2016-05-21 23:50:57  TC"=>23} %>

{"2016-05-21 23:50:40 UTC"=>20, "2016-05-21 23:50:57 UTC"=>23}

В предыдущем примере вы видите даты (строки) в качестве ключей к хэшу, а значения (целые числа) — 20 и 23. В вашем случае вам нужен хэш, где ключи — это даты, а значения хэша — максимальное, минимальное или текущая температура. { "date_1" => число, "date_2" => число, ...

Чтобы протестировать свой код, я создал модель под названием Temperature. Вот таблица:

  create_table "temperatures", force: :cascade do |t|
    t.integer  "max",        limit: 4
    t.integer  "min",        limit: 4
    t.integer  "current",    limit: 4
    t.datetime "created_at",           null: false
    t.datetime "updated_at",           null: false
  end

На мой взгляд, я назвал это:

<%= line_chart [
 {name: "Series A", data: Temperature.all.inject({}) {|res, v| res[v[:created_at]] = v.max; res }},
 {name: "Series B", data: Temperature.all.inject({}) {|res, v| res[v[:created_at]] = v.current; res }},
 {name: "Series C", data: Temperature.all.inject({}) {|res, v| res[v[:created_at]] = v.min; res }}
             ] %>

И я получил график с 3 линиями, показывающими максимальную, минимальную и текущую температуру с течением времени.

введите здесь описание изображения

Я использовал метод inject для создания хэша, где ключи — это даты, а значения — это атрибуты [max, min, current] модели Temeperature. Для получения дополнительной информации о методе inject прочитайте это поток переполнения стека.

В вашем случае вы должны попробовать это:

<%= line_chart [
 {name: "Series A", data: @tray.datalogs.inject({}) {|res, v| res[v[:created_at]] = v.ambmax; res }},
 {name: "Series B", data: @tray.datalogs.inject({}) {|res, v| res[v[:created_at]] = v.ambcur; res }},
 {name: "Series C", data: @tray.datalogs.inject({}) {|res, v| res[v[:created_at]] = v.ambmin; res }}
                 ] %>
person Volodymyr Balytskyy    schedule 22.05.2016
comment
Спасибо, я попробую. - person mGarsteck; 22.05.2016