Jquery 谷歌图表:在IE中绘制多个双轴条形图

Jquery 谷歌图表:在IE中绘制多个双轴条形图,jquery,charts,google-visualization,bar-chart,Jquery,Charts,Google Visualization,Bar Chart,我正在同一页上创建多个双轴条形图。它在chrome中工作正常,但在IE中不工作。在IE中,它显示了一个错误 “对象不支持属性或方法'contains'” HTML和JavaScript代码如下所示: startChart(); 函数startChart(){ var data=new google.visualization.arrayToDataTable([ [“星系”、“距离”、“亮度”], ['Canis Major侏儒',8000,23.3], [《人马座矮人》,24000,4.5

我正在同一页上创建多个双轴条形图。它在chrome中工作正常,但在IE中不工作。在IE中,它显示了一个错误

“对象不支持属性或方法'contains'”

HTML和JavaScript代码如下所示:


startChart();
函数startChart(){
var data=new google.visualization.arrayToDataTable([
[“星系”、“距离”、“亮度”],
['Canis Major侏儒',8000,23.3],
[《人马座矮人》,24000,4.5],
['Ursa MARGER II Dwarf',30000,14.3],
['Lg.麦哲伦云',50000,0.9],
[Bootes I',60000,13.1]
]);
变量选项={
宽度:900,
图表:{
标题:“附近星系”,
副标题:“左侧距离,右侧亮度”
},
系列:{
0: {
轴:“距离”
},//将系列0绑定到名为“距离”的轴上。
1: {
轴:“亮度”
}//将系列1绑定到名为“亮度”的轴。
},
轴线:{
y:{
距离:{
标签:“parsecs”
},//左y轴。
亮度:{
一边:"对",,
标签:“视在震级”
}//右y轴。
}
}
};
var chart=new google.charts.Bar(document.getElementById('dual_y_div');
图表绘制(数据、选项);
var chart1=新的google.charts.Bar(document.getElementById('dual_y_div1');
图表1.绘制(数据、选项);
};

我想这仍然是google可视化api的一个缺陷。 ()

但是,我将条形图更改为柱形图,并更改了轴的选项,以便它们与柱形图配合使用,这就成功了

然而,这是可行的

startChart();
函数startChart(){
var data=new google.visualization.arrayToDataTable([
[“星系”、“距离”、“亮度”],
['Canis Major侏儒',8000,23.3],
[《人马座矮人》,24000,4.5],
['Ursa MARGER II Dwarf',30000,14.3],
['Lg.麦哲伦云',50000,0.9],
[Bootes I',60000,13.1]
]);
变量选项={
宽度:900,
标题:“附近星系”,
阀门:{
0: {
标题:“parsecs”,
},
1: {
标题:“视在震级”,
},
},
系列:{
0:{
targetAxisIndex:0,
},
1:{
目标指数:1,
},
},
};
var chart=new google.visualization.ColumnChart(document.getElementById('dual_y_div'));
图表绘制(数据、选项);
var chart1=新的google.visualization.ColumnChart(document.getElementById('dual_y_div1'));
图表1.绘制(数据、选项);
}

以下是一个示例,其中包含多个

google.charts.load('41',{packages:['bar']});
google.charts.setOnLoadCallback(startChart);
函数startChart(){
var data=new google.visualization.arrayToDataTable([
[“星系”、“距离”、“亮度”],
['Canis Major侏儒',8000,23.3],
[《人马座矮人》,24000,4.5],
['Ursa MARGER II Dwarf',30000,14.3],
['Lg.麦哲伦云',50000,0.9],
[Bootes I',60000,13.1]
]);
变量选项={
宽度:900,
图表:{
标题:“附近星系”,
副标题:“左侧距离,右侧亮度”
},
系列:{
0: {
轴:“距离”
},//将系列0绑定到名为“距离”的轴上。
1: {
轴:“亮度”
}//将系列1绑定到名为“亮度”的轴。
},
轴线:{
y:{
距离:{
标签:“parsecs”
},//左y轴。
亮度:{
一边:"对",,
标签:“视在震级”
}//右y轴。
}
}
};
var chart=new google.charts.Bar(document.getElementById('dual_y_div');
图表绘制(数据、选项);
var chart1=新的google.charts.Bar(document.getElementById('dual_y_div1');
图表1.绘制(数据、选项);
};


非常感谢您。正如你提到的,我把这个改成了柱形图,它正在工作。很棒的发现@WhiteHat。现在它成功了。但不鼓励在生产环境中使用添加元标记,因为呈现页面内容可能会产生意外的结果。谢谢。从answer中删除了IE的区别,报告说它也修复了其他浏览器…你介意记录下实际修复的是什么吗?也许是以一个不同的补丁的形式。这将帮助那些带着同样问题来到这里并需要对代码应用相同修复的人。