2014-12-21 2 views
5

Я использую chartkick сделать несколько график серии строки со следующим кодом:Rails chartkick: настройка отдельных кривых в многострочной линейной диаграмме?

<%= line_chart [ 
    {name: @track.name, data: records_of_track(@track).map{|record| [record.time_entered, record.entry]}}, 
    {name: "Goal", data: [[@track.goal_by, @track.goal]]}, 
    {name: "Goal trend line", data: [[most_recent_record(@track).time_entered, most_recent_record(@track).entry], [@track.goal_by, @track.goal]]} 
    ]%> 

И это то, что он выглядит следующим образом:

Chart, not modified

Основная идея заключается в том, что синий это материал, введенный пользователем, красный - их цель: желтый соединяет самую последнюю запись пользователя с целью в виде «линии тренда». Я хотел настроить линию тренда, чтобы не иметь конечных точек (pointSize: 0) и быть разбитым (lineDashStyle: [5,5]), но не два других. Я попытался сделать это

<%= line_chart [ 
    {name: @track.name, data: records_of_track(@track).map{|record| [record.time_entered, record.entry]}}, 
    {name: "Goal", data: [[@track.goal_by, @track.goal]]}, 
    {name: "Goal trend line", data: [[most_recent_record(@track).time_entered, most_recent_record(@track).entry], [@track.goal_by, @track.goal]] , library: {pointSize: 0, lineDashStyle: [5,5]}} 
    ]%> 

, но это не сработало, так как я получил тот же результат, как и раньше, и попытался сделать это

<%= line_chart [ 
    {name: @track.name, data: records_of_track(@track).map{|record| [record.time_entered, record.entry]}}, 
    {name: "Goal", data: [[@track.goal_by, @track.goal]]}, 
    {name: "Goal trend line", data: [[most_recent_record(@track).time_entered, most_recent_record(@track).entry], [@track.goal_by, @track.goal]]} 
    ] , library: {pointSize: 0, lineDashStyle: [5,5]} %> 

но сделал все линии пунктирная и исчезли все точки, а Ожидаемый результат:

Chart, but EVERYTHING got modified (as expected)

Так как мне сделать эти атрибуты применимы только к одной кривой, а не другие два? Если не будет прямой реализации на рынке карт, было бы также полезно знать, как я мог это сделать, используя только диаграммы Google. До тех пор, пока я получаю функциональность!

-

EDIT 1: После просмотра this, я пытался использовать опцию series изменять некоторые параметры (здесь: lineWidth, так как это было проще всего набрать), но это тоже не сработало, я получил сообщение об ошибке. Это был мой код:

<%= line_chart [ 
    {data: [[most_recent_record(@track).time_entered, most_recent_record(@track).entry], [@track.goal_by, @track.goal]]}, 
    {name: @track.name, data: records_of_track(@track).map{|record| [record.time_entered, record.entry]}}, 
    {name: "Goal", data: [[@track.goal_by, @track.goal]]} 

] , library: library_settings %> 

с

<% library_settings = { 
    width: 600, 
    vAxis: {ticks: choose_ticks(@track)}, 
    colors: ['ff9900', '3366cc', 'dc3912'], 
    series: { 
     0: {lineWidth: 1}, 
     1: {lineWidth: 2}, 
     2: {lineWidth: 10} 
    } 
} %> 

, но я только получил ошибку

....html.erb:16: syntax error, unexpected ':', expecting => 0: {lineWidth: 1},^....html.erb:16: syntax error, unexpected ',', expecting keyword_end ....html.erb:17: syntax error, unexpected ',', expecting keyword_end ....html.erb:19: syntax error, unexpected '}', expecting keyword_end 

ответ

3

Кажется, вы сейчас в тэ правильный путь. Ошибка синтаксиса вы получите в настоящее время должна быть установлена ​​следующим:

<% library_settings = { 
    width: 600, 
    vAxis: {ticks: choose_ticks(@track)}, 
    colors: ['ff9900', '3366cc', 'dc3912'], 
    series: { 
     0 => {lineWidth: 1}, 
     1 => {lineWidth: 2}, 
     2 => {lineWidth: 10} 
    } 
} %> 

переменной library_settings является рубином хэш, и в рубине, цифровые клавиши разрешены для хэш, но они должны использовать hashrocket синтаксиса, а не новый синтаксис двоеточия. Для уточнения:

2.1.2 :001 > { 0: {lineWith: 1} } 
SyntaxError: (irb):1: syntax error, unexpected ':', expecting => 
{ 0: {lineWith: 1} } 
    ^
(irb):1: syntax error, unexpected '}', expecting end-of-input 

Но

2.1.2 :002 > { 0 => {lineWith: 1} } 
=> {0=>{:lineWith=>1}} 
+0

Спасибо !!! Это объяснение мне помогло. (Извините за то, что вы так долго принимали, я был вдали от своего ноутбука.) –

Смежные вопросы