0

この例のGoogleChartsクイックスタートに従ってGoogleChartsAPIを使用しようとしています

ご覧のとおり、データはJSで次のように作成されます。

data.addColumn('string', 'Topping');
        data.addColumn('number', 'Slices');
        data.addRows([
          ['Mushrooms', 3],
          ['Onions', 1],
          ['Olives', 1],
          ['Zucchini', 1],
          ['Pepperoni', 2]
        ]);

私の質問は：

コントローラでデータを取得した場合...テンプレートファイルのJavascriptにデータを渡すにはどうすればよいですか？この例のJSは、index.html.erbファイルの先頭に接続されています。

4

1 に答える 1

0

コントローラーアクションでruby変数を作成して値を保持し、<％=％>タグを使用してそれらの値を使用してビューでJavaScriptを生成する必要があります。

例：@valuesは名前と値のコレクションになります。

data.addColumn('string', 'Topping');
data.addColumn('number', 'Slices');
data.addRows([
    <% @values.each do |v| %>
        ['<%= v.name %>', <%= v.value %>],
    <% end %>
    ]);

js関数を使用した例。

index.js：

var values;

function InitPage(valuesFromView)
{
    values = valuesFromView;
}

function InitData()
{
    data.addColumn('string', 'Topping');
    data.addColumn('number', 'Slices');
    data.addRows(values);
}

index.html.erb：ページの読み込み時にjqueryを使用してInitPageを呼び出すことに注意してください。jqueryを使用していない場合、InitPageの呼び出しはおそらくbodyタグなどのonloadで行われます。

<script>
    $(document).ready(function() {
        InitPage([
           <% @values.each do |v| %>
               ['<%= v.name %>', <%= v.value %>],
           <% end %>
        ]);
    });
</script>
于 2012-06-05T17:22:55.397 に答える