2014-12-21 2 views
5

Ich chartkick mit einem mehrere Reihen Liniendiagramm mit dem folgenden Code zu machen:Rails chartkick: Anpassen von separaten Kurven in Multi-Serien Liniendiagramm?

<%= 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]]} 
    ]%> 

Und das ist, wie es aussieht:

Chart, not modified

Die Grundidee ist, dass die blau ist das vom Benutzer eingegebene Material, das Rot ist sein Ziel, das Gelb verbindet den letzten Eintrag des Benutzers mit dem Ziel in einer Art "Trendlinie". Ich wollte die Trendlinie anpassen, um keine Endpunkte zu haben (pointSize: 0) und gestrichelt sein (lineDashStyle: [5,5]), aber nicht die anderen beiden. Ich habe versucht, diese

<%= 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]}} 
    ]%> 

zu tun, aber es hat nicht funktioniert, da ich die gleiche Ausgabe wie vor bekam und versuchte, diese

<%= 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]} %> 

zu tun, sondern dass alle Linien gestrichelt und verschwanden alle Punkte gemacht, wie erwartet:

Chart, but EVERYTHING got modified (as expected)

So wie kann ich diese Attribute auf die eine Kurve nur gelten, nicht aber die anderen beiden? Wenn es keine direkte Chartkick-Implementierung gibt, wäre es auch hilfreich zu wissen, wie ich dies nur mit Google-Charts tun könnte. So lange ich die Funktionalität bekomme!

-

EDIT 1: Nach dem this sehen, ich die series Option zu verwenden versucht, einige Parameter zu verändern (hier: lineWidth da es am einfachsten war zu geben), aber auch dies nicht funktioniert, ich habe eine Fehlermeldung. Dies war mein Code:

<%= 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 %> 

mit

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

aber ich habe nur den Fehler

....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 

Antwort

3

Es Sie sind jetzt in te richtigen Weg zu sein scheint. Die Syntaxfehler Sie jetzt erhalten sollten folgende Preise festgesetzt:

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

Die Variable library_settings ist ein Rubin-Hash, und in Rubin, sind numerische Tasten für Hashes erlaubt, aber sie müssen die hashrocket Syntax verwenden, nicht die neue Doppelpunktsyntax. Zur Klarstellung:

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 

Aber

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

Dank !!! Diese Erklärung hat mir geholfen. (Es tut mir leid, dass ich so lange brauchte, um zu akzeptieren, ich war von meinem Laptop weg.) –