Javascript 同一页面上有多个谷歌图表

我正在尝试创建股票投资组合的POC。
我正在用谷歌图表做这件事。
我想生成3个图表：每个股票一个（我有两个股票），两个都有一个。
在我的html中，我创建了三个div（使用一些GUI）

问题是每次加载页面时，三个图表中只有一个被呈现。（每次都是不同的）
有人遇到过这样的问题吗？

在存储库中报告：

人们在调整多个实例的大小时遇到的问题 材料图表应与此新版本一起解决。你可以 现在将代码更改为加载“1.1”，以便在候选版本发布时 如果可用，您将使用它

目前至少有两种解决方案：

选项1。使用冻结版本加载程序。

自

v43候选版本的推出将解决此问题

切换到使用冻结版本加载程序

步骤：

1） 添加对加载器的引用：

2） 然后加载43版本的库：

google.charts.load（“43”，{packages:[“line”]}）

3） 替换：

google.setOnLoadCallback(drawChart);

与

示例


google.charts.load（“43”，{packages:[“line”]}）；
google.charts.setOnLoadCallback（drawChart）；
函数绘图图（）{
var data=new google.visualization.DataTable（）；
data.addColumn（'date'，'Day'）；
data.addColumn（'number'，'Company#4'）；
data.addColumn（'编号'，'公司#2'）；
addRow数据（[新日期（2015年11月27日），12.7389789250395,4.1095049778125]）；
addRow数据（[新日期（2015年11月26日），6.76681987790708,8.38212726329552]）；
addRow数据（[新日期（2015年11月25日），15.7216755155109,4.36060299741132]）；
addRow数据（[新日期（2015年11月24日），7.44940381844035,3.3409328695116]）；
addRow数据（[新日期（2015年11月23日），9.02574470221333,10.040524952132]）；
addRow数据（[新日期（2015年11月22日），11.9767397269498,5.29850781210629]）；
addRow数据（[新日期（2015年11月21日），14.5598888055235,6.3867255497662]）；
addRow数据（[新日期（2015年11月20日），12.269318406642,3.70270192981823]）；
addRow数据（[新日期（2015年11月19日），8.29967047194935,17.0856299675469]）；
addRow数据（[新日期（2015年11月18日），12.9148372020176,4.37814835290338]）；
变量选项={
标题：“股票表现”，
宽度：900，
身高：500
};
var chart=new google.charts.Line（document.getElementById（'linechart_material'）；
图表绘制（数据、选项）；
var data0=new google.visualization.DataTable（）；
data0.addColumn（'date'，'Day'）；
数据0.addColumn（'number'，'Company#4'）；
数据0.addRow（[新日期（2015年11月27日），12.7389789250395]）；
数据0.addRow（[新日期（2015年11月26日），6.76681987790708]）；
数据0.addRow（[新日期（2015年11月25日），15.7216755155109]）；
数据0.addRow（[新日期（2015年11月24日），7.44940381844035]）；
数据0.addRow（[新日期（2015年11月23日），9.02574470221333]）；
数据0.addRow（[新日期（2015年11月22日），11.9767397269498]）；
数据0.addRow（[新日期（2015年11月21日），14.5598888055235]）；
数据0.addRow（[新日期（2015年11月20日），12.2693184056642]）；
数据0.addRow（[新日期（2015年11月19日），8.29967047194935]）；
数据0.addRow（[新日期（2015年11月18日），12.9148372020176]）；
变量选项0={
标题：“股票表现”，
宽度：300，
身高：300
};
var chart0=新的google.charts.Line（document.getElementById（'E480C510499E4BDAA8AE8E4A1001CD8'）；
图表0.绘图（数据0，选项0）；
var data1=新的google.visualization.DataTable（）；
数据1.addColumn（'date'，'Day'）；
数据1.addColumn（'number'，'Company#2'）；
数据1.addRow（[新日期（2015年11月27日），4.1095049978125]）；
数据1.addRow（[新日期（2015年11月26日），8.38212726329552]）；
数据1.addRow（[新日期（2015年11月25日），4.36060299741132]）；
数据1.addRow（[新日期（2015年11月24日），3.3409328695116]）；
数据1.addRow（[新日期（2015年11月23日），10.040524952132]）；
数据1.addRow（[新日期（2015年11月22日），5.29850781210629]）；
数据1.addRow（[新日期（2015年11月21日），6.3867255497662]）；
数据1.addRow（[新日期（2015年11月20日），3.70270192981823]）；
数据1.addRow（[新日期（2015年11月19日），17.0856299675469]）；
数据1.addRow（[新日期（2015年11月18日），4.37814835290338]）；
变量选项1={
标题：“股票表现”，
宽度：300，
身高：300
};
var chart1=新的google.charts.Line（document.getElementById（'2dea80b0fabd43bba019dbc3ddf342aa'）；
图表1.绘图（数据1，选项1）；
}


    $(document).ready(function() {
$('[data-toggle="tooltip"]').tooltip();
});
google.load('visualization', '1.1', { 'packages': ['line'] });

google.setOnLoadCallback(drawChart);

function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('date', 'Day');

data.addColumn('number', 'Company #4');
data.addColumn('number', 'Company #2');
data.addRow([new Date(2015, 11,  27), 12.7389789250395,4.10950499778125]);
data.addRow([new Date(2015, 11,  26), 6.76681987790708,8.38212726329552]);
data.addRow([new Date(2015, 11,  25), 15.7216755155109,4.36060299741132]);
data.addRow([new Date(2015, 11,  24), 7.44940381844035,3.34093286951116]);
data.addRow([new Date(2015, 11,  23), 9.02574470221333,10.0405249521325]);
data.addRow([new Date(2015, 11,  22), 11.9767397269498,5.29850781210629]);
data.addRow([new Date(2015, 11,  21), 14.5598888055235,6.3867255497662]);
data.addRow([new Date(2015, 11,  20), 12.2693184056642,3.70270192981823]);
data.addRow([new Date(2015, 11,  19), 8.29967047194935,17.0856299675469]);
data.addRow([new Date(2015, 11,  18), 12.9148372020176,4.37814835290338]);
var options = {
title: 'Stock Performance',
width: 900,
height: 500
};

var chart = new google.charts.Line(document.getElementById('linechart_material'));
chart.draw(data, options);

var data0 = new google.visualization.DataTable();
data0.addColumn('date', 'Day');
data0.addColumn('number', 'Company #4');
data0.addRow([new Date(2015, 11,  27), 12.7389789250395]);
data0.addRow([new Date(2015, 11,  26), 6.76681987790708]);
data0.addRow([new Date(2015, 11,  25), 15.7216755155109]);
data0.addRow([new Date(2015, 11,  24), 7.44940381844035]);
data0.addRow([new Date(2015, 11,  23), 9.02574470221333]);
data0.addRow([new Date(2015, 11,  22), 11.9767397269498]);
data0.addRow([new Date(2015, 11,  21), 14.5598888055235]);
data0.addRow([new Date(2015, 11,  20), 12.2693184056642]);
data0.addRow([new Date(2015, 11,  19), 8.29967047194935]);
data0.addRow([new Date(2015, 11,  18), 12.9148372020176]);
var options0 = {
title: 'Stock Performance',
width: 300,
height: 300
};

var chart0 = new google.charts.Line(document.getElementById('e480c510499e4bbdaa8ae8e4a1001cd8'));
chart0.draw(data0, options0);

var data1 = new google.visualization.DataTable();
data1.addColumn('date', 'Day');
data1.addColumn('number', 'Company #2');
data1.addRow([new Date(2015, 11,  27), 4.10950499778125]);
data1.addRow([new Date(2015, 11,  26), 8.38212726329552]);
data1.addRow([new Date(2015, 11,  25), 4.36060299741132]);
data1.addRow([new Date(2015, 11,  24), 3.34093286951116]);
data1.addRow([new Date(2015, 11,  23), 10.0405249521325]);
data1.addRow([new Date(2015, 11,  22), 5.29850781210629]);
data1.addRow([new Date(2015, 11,  21), 6.3867255497662]);
data1.addRow([new Date(2015, 11,  20), 3.70270192981823]);
data1.addRow([new Date(2015, 11,  19), 17.0856299675469]);
data1.addRow([new Date(2015, 11,  18), 4.37814835290338]);
var options1 = {
title: 'Stock Performance',
width: 300,
height: 300
};

var chart1 = new google.charts.Line(document.getElementById('2dea80b0fabd43bba019dbc3ddf342aa'));
chart1.draw(data1, options1);

}

google.setOnLoadCallback(drawChart);

google.charts.setOnLoadCallback(drawChart);