Google Charts in Rails 3.1 Ajax Partial

私は問題なくGoogleのチャートで作業してきましたが、Ajaxでレンダリングされた部分の内部にグラフを表示する必要があります。Google Charts in Rails 3.1 Ajax Partial

明らかに何も表示されていません。私はそれが活性化されていないチャートを構築するJavaのトリガーとは何かを知っていますが、私はそれが私が行う必要があるものといくつかの助けが必要です...

現在私はこのようなものを持っています：あなたは、以下の（あなたがjQueryのを使用すると仮定した場合）のような何かをする必要があり、あなたの部分で

<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
<script type="text/javascript"> 
    google.load("visualization", "1", {packages:["corechart"]}); 
</script>

：あなたのメインページで

<html> 
    <head> 
    <script type="text/javascript" src="https://www.google.com/jsapi"></script> 
    <script type="text/javascript"> 
     google.load("visualization", "1", {packages:["corechart"]}); 
     google.setOnLoadCallback(drawChart); 
     function drawChart() { 
     var data = new google.visualization.DataTable(); 
     data.addColumn('string', 'Year'); 
     data.addColumn('number', 'Sales'); 
     data.addColumn('number', 'Expenses'); 
     data.addRows([ 
      ['2004', 1000, 400], 
      ['2005', 1170, 460], 
      ['2006', 660, 1120], 
      ['2007', 1030, 540] 
     ]); 

     var options = { 
      width: 400, height: 240, 
      title: 'Company Performance', 
      vAxis: {title: 'Year', titleTextStyle: {color: 'red'}} 
     }; 

     var chart = new google.visualization.AreaChart(document.getElementById('chart_div')); 
     chart.draw(data, options); 
     } 
    </script> 
    </head> 
    <body> 
    <div id="chart_div"></div> 
    </body> 
</html>

出典

2012-01-19 user1051849

は（部分的にGoogleのチャートをロードする必要が）これらを保持していません。あなたの多くの時間を節約する

<div id="chart_div"></div> 
<script type="text/javascript"> 
    $(function() { 
    drawChart(); 
    }); 

    function drawChart() { 
    var data = new google.visualization.DataTable(); 
    data.addColumn('string', 'Year'); 
    data.addColumn('number', 'Sales'); 
    data.addColumn('number', 'Expenses'); 
    data.addRows([ 
     ['2004', 1000, 400], 
     ['2005', 1170, 460], 
     ['2006', 660, 1120], 
     ['2007', 1030, 540] 
    ]); 

    var options = { 
     width: 400, height: 240, 
     title: 'Company Performance', 
     vAxis: {title: 'Year', titleTextStyle: {color: 'red'}} 
    }; 

    var chart = new google.visualization.AreaChart(document.getElementById('chart_div')); 
    chart.draw(data, options); 
    } 
</script>

をjQueryのようなライブラリを使用する：ポイントは、$（関数（）{....}）が何であるDOMがロードされた後JSコードを実行することですDOMが正しくロードされたことを知るためのブラウザの不一致。

出典

2012-05-02 02:48:57

$(function() { 
    drawChart(); 
});

で

google.setOnLoadCallback(drawChart);

の交換は、AJAXのパーシャルのためのトリックをやりました！ヘルプありがとう、以前はDOMが読み込まれていたが、グラフが挿入されていなかった。

出典

2012-05-18 21:02:57 JGuo

Google Charts in Rails 3.1 Ajax Partial

答えて

関連する問題