0

foo.html.erb

<script type="text/javascript">
   var all_user = <%= @user.all_user_bar_chart.to_json.html_safe) %>;
</script>

abc.js

$(function () {
 if ($("#foo").length > 0){
     var user_charts = new Highcharts.Chart({
        chart: {
            renderTo: 'foo'
        },
        title: {
            text: 'User Statistics',
            x: -20 //center
        },
        subtitle: {
            text: ' ',
            x: -20
        },
        xAxis: {
            categories: ['a', 'b', 'c', 'd']
        },
        yAxis: {
            title: {
                text: 'point'
            },
            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        },
        tooltip: {
            valueSuffix: '°C'
        },
        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'middle',
            borderWidth: 0
        },
        series: all_user
    });
    console.log(all_user);
  }
});

ここでは、出力フォーム モデル データまたは foo.html.erb :-
"[{\"name\":\"A\",\"data\":94},{\"name\":\"b\" ,\"データ\":356},{\"名前\":\"c\",\"データ\":1}]"

("") 二重引用符を削除したいので、このデータを「highcharts」に従ってサポートし、ユーザーの基本的な折れ線グラフを取得しました。私も JSON.parse を試しましたが、うまくいきません。結果を文字列 "[{\"name\":\"A\",\"data\":94}]" で取得するたびに

4

1 に答える 1