5

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

そして、これは次のようになります。

グラフ、変更なし

基本的な考え方は、青はユーザーが入力したもの、赤はユーザーの目標、黄色は一種の「トレンドライン」でユーザーの目標への最新のエントリを結合するというものです。pointSize: 0トレンドラインをカスタマイズして、端点なし ( ) と破線 ( lineDashStyle: [5,5]) にし、他の 2 つをカスタマイズしたかったのです。私はこれをやってみました

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

しかし、予想どおり、すべての線が破線になり、すべての点が消えました。

グラフですが、すべてが変更されました (予想どおり)

では、これらのアトリビュートを 1 つのカーブだけに適用し、他の 2 つには適用しないようにするにはどうすればよいでしょうか? チャートキックの直接的な実装がない場合は、Google チャートのみを使用してこれを行う方法を知っておくと役立ちます。機能さえあれば！

--

編集 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
4

1 に答える 1

4

あなたは今、正しい道にいるようです。現在発生している構文エラーは、次のように修正する必要があります。

<% 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 は Ruby のハッシュであり、Ruby では数値キーをハッシュに使用できますが、新しいコロン構文ではなく、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}}
于 2014-12-26T19:35:04.973 に答える