0

この例に従って、HighchartsチャートをRailsアプリに追加しようとしています

http://www.highcharts.com/demo/column-stacked

JavaScript を使用してグラフを構成するとすべて正常に動作しますが、コンテンツが動的になるため、シリーズ データをデータ属性に移動したいと考えています。

関数内の 1 行を変更しました (上記のリンクの表示オプションを参照してください)。

series: $('#container').data('chart')

そしてビューで

<div id="container" style="width:100%;height:172px;" data-chart='<%= @data %>' ></div>

コントローラーで

@data = [{
                name: 'John',
                data: [5, 3, 4, 7, 2]
            }, {
                name: 'Jane',
                data: [2, 2, 3, 2, 1]
            }, {
                name: 'Joe',
                data: [3, 4, 4, 2, 5]
            }]

例のように正しいグラフを表示するのではなく、約 100 のデータ シリーズを含む非常に乱雑なグラフが表示されます。

このデータ配列が javascript と ruby​​ で処理される方法に違いがあり、この不一致が発生する可能性はありますか?

4

1 に答える 1

1

ビュー内のクライアントにデータを渡し、content_tag@data の名前を @my_data に変更してみてください。

<%= content_tag "div", id: "chart_data", data: {my_data: @my_data} do %>
<% end %>

ページをリロードし、JavaScript コンソールを開き、jQuery を使用して JavaScript オブジェクトが適切にフォーマットされているかどうかを確認します。

$('#chart_data').data('my_data')

現実的な例では、Ruby オブジェクトのコレクションをクライアントに渡します。この手法は、Ruby オブジェクトの配列を JS オブジェクトの配列に変換するのに適しています。JS へのデータの受け渡しには優れたRailsCastがあります。

于 2013-08-10T14:18:42.857 に答える