Javascript Rails 3.1 Ajax中的谷歌图表

我一直在使用GoogleCharts，没有任何问题，但现在我需要在Ajax渲染部分中显示一个图表

很明显，什么都没有表现出来。我知道这与Java触发器有关，以构建未激活的图表，但我需要一些帮助，以明确我需要做什么

目前我有一些类似的东西（非Ajax）：

load（“可视化”、“1”、{packages:[“corechart”]}）；
setOnLoadCallback（drawChart）；
函数绘图图（）{
var data=new google.visualization.DataTable（）；
data.addColumn（'string'，'Year'）；
data.addColumn（'number'，'Sales'）；
data.addColumn（“数字”、“费用”）；
data.addRows([
['2004', 1000, 400],
['2005', 1170, 460],
['2006', 660, 1120],
['2007', 1030, 540]
]);
变量选项={
宽度：400，高度：240，
标题：“公司业绩”，
变量：{title:'Year'，titleTextStyle:{color:'red'}
};
var chart=new google.visualization.AreaChart（document.getElementById（'chart_div'））；
图表绘制（数据、选项）；
}

在主页中保留以下内容（无需在部分页面中加载谷歌图表）：

load（“可视化”、“1”、{packages:[“corechart”]}）；

在部分示例中，您需要执行以下操作（假设您使用jQuery）。关键是在加载dom后执行js代码，这就是$（function（）{..}）的作用：

$（函数（）{
图纸（）；
});
函数绘图图（）{
var data=new google.visualization.DataTable（）；
data.addColumn（'string'，'Year'）；
data.addColumn（'number'，'Sales'）；
data.addColumn（“数字”、“费用”）；
data.addRows([
['2004', 1000, 400],
['2005', 1170, 460],
['2006', 660, 1120],
['2007', 1030, 540]
]);
变量选项={
宽度：400，高度：240，
标题：“公司业绩”，
变量：{title:'Year'，titleTextStyle:{color:'red'}
};
var chart=new google.visualization.AreaChart（document.getElementById（'chart_div'））；
图表绘制（数据、选项）；
}

使用像jQuery这样的库可以为您节省很多时间，让您了解何时正确加载dom，从而避免浏览器出现不一致的情况。

google.setOnLoadCallback(drawChart);

与

为AJAX部分做了这个把戏！感谢您的帮助，之前DOM正在重新加载，但图表没有插入

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

<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>

google.setOnLoadCallback(drawChart);

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