Php 谷歌图表多次绘制同一图表

我试图用html制作一个模态对话框，当按下某个按钮在模态对话框中绘制谷歌图表时

function inter(id)
{
var arr = [['Album','Vizualizari']];
$.ajax({

url: 'popular.php',
type: 'GET',
dataType: 'json',
success: function (json) {
    $.each(json,function (i ,value )
    {
      var c =[value.title, value.popular];
      arr.push(c);
    });

google.charts.load('current', {'packages':['bar']});
google.charts.setOnLoadCallback(drawStuff);

  function drawStuff() {
    google.visualization
    var data = new google.visualization.arrayToDataTable(arr);

    var options = {
      title: 'Chess opening moves',
      width: 800,
      legend: { position: 'none' },
      bars: 'vertical', // Required for Material Bar Charts.
      axes: {
        y: {
          0: { side: 'top', label: 'Percentage'} // Top x-axis.
        }
      },
      bar: { groupWidth: "100%" }
    };

    var chart = new google.charts.Bar(document.getElementById('top_x_div'));
    chart.draw(data, options);
  };
}});
}

---

它工作，但只有在第一模态。当我尝试打开另一个模式时，出现了以下错误：

google.charts.load（）不能被多次调用

。如何使用另一个回调而不是“setOnLoadCallback”绘制图表

您的问题是您的函数包含以下两行：

google.charts.load（'current'，{'packages'：['bar']}）；
google.charts.setOnLoadCallback（drawStuff）；

这是错误的

google.charts.load（）

加载google可视化API，并在API完成加载后执行一次

setOnLoadCallback（）

。但是，当加载google visualization时，您不希望显示图表，而是当用户单击按钮（或其他）以显示模式时。因此，完全删除

setOnLoadCallback

并将

load（）

移出到全局范围-只需从

success

处理程序手动调用

drawStuff（）

：

google.charts.load（'current'，{'packages'：['bar']}）；
内部功能（id）{
var arr=[
['Album'、'Vizalizari']
];
$.ajax({
url:'popular.php'，
键入：“GET”，
数据类型：“json”，
成功：函数（json）{
$.each（json，函数（i，值）{
var c=[value.title，value.popular]；
arr.push（c）；
});
绞车（arr）；
})
})
功能抽丝（arr）{
var data=新的google.visualization.arrayToDataTable（arr）；
变量选项={
标题:"国际象棋开局动作",，
宽度：800，
图例：{
位置：“无”
},
条形图：“垂直”，//物料条形图为必填项。
轴线：{
y:{
0: {
边：'顶'，
标签：“百分比”
}//顶部x轴。
}
},
酒吧：{
群组宽度：“100%”
}
};
var chart=new google.charts.Bar（document.getElementById（'top_x_div'）；
图表绘制（数据、选项）；
}
}