Javascript JQuery循环中的多个Google图表

我正在尝试创建一个包含两个谷歌图表的循环/滑块。我可以用下面的代码在页面上单独显示它们，但当空间变得更大时，我决定使用slider/cycle。使用下面的代码。第一个图表绘制，但当第二个图表滚动到视图中时。没有图表。它只说：无法在Chrome上获取未定义或null引用的属性“length”：无法读取null的属性“length”。我意识到，当一张图表可见时，另一张则不可见。但我对javascript的不熟悉使我很难找到一个答案，将display:'block'转换为display:'none在适当的时候返回。任何帮助都将不胜感激

    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">

        function drawCharts() {
            var data1 = google.visualization.arrayToDataTable(<% =jsostring%>);
            var options1 = {
                title: 'PSNL Weight Chart',
                backgroundColor: {fill:'none'}
            };

            var data2 = google.visualization.arrayToDataTable(<% =jsostring2%>);
            var options2 = {
                title: 'PSNL Sleep Chart',
                backgroundColor: {fill:'none'}
            };

            var chartA = new google.visualization.LineChart(document.getElementById('chart_div'));
            chartA.draw(data1, options1);

            var chartB = new google.visualization.ColumnChart(document.getElementById('chart_div2'));
            chartB.draw(data2, options2);

        }
        google.setOnLoadCallback(drawCharts);
        google.load("visualization", "1", { packages: ["corechart"] });

       </script>

函数绘图图（）{
var data1=google.visualization.arrayToDataTable（）；
变量选项1={
标题：“PSNL重量表”，
背景颜色：{fill:'none'}
};
var data2=google.visualization.arrayToDataTable（）；
var选项2={
标题：“PSNL睡眠图”，
背景颜色：{fill:'none'}
};
var chartA=新的google.visualization.LineChart（document.getElementById（'chart_div'）；
图表绘制（数据1，选项1）；
var chartB=new google.visualization.ColumnChart（document.getElementById（'chart_div2'））；
图表B.绘图（数据2，选项2）；
}
setOnLoadCallback（绘图图）；
load（“可视化”、“1”、{packages:[“corechart”]}）；

我想答案很简单。我不是一个java人。我找了找，想了想。我在另一个网站上找到的答案是：

   <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">

        function drawCharts() {
            var data1 = google.visualization.arrayToDataTable(<% = jsostring%>);
            var options1 = {
                title: 'PSNL Weight Chart',
                backgroundColor: {fill:'none'}
            };

            var data2 = google.visualization.arrayToDataTable(<% = jsostring2%>);
            var options2 = {
                title: 'PSNL Sleep Chart',
                backgroundColor: {fill:'none'}
            };

            var chartA = new google.visualization.LineChart(document.getElementById('chart_div'));
            document.getElementById('chart_div').style.display = 'block';
            document.getElementById('chart_div2').style.display = 'none';
            chartA.draw(data1, options1);

            var chartB = new google.visualization.ColumnChart(document.getElementById('chart_div2'));
            document.getElementById('chart_div2').style.display = 'block';
            document.getElementById('chart_div').style.display = 'none';
            chartB.draw(data2, options2);
        }
        google.setOnLoadCallback(drawCharts);
        google.load("visualization", "1", { packages: ["corechart"] });

</script>

函数绘图图（）{
var data1=google.visualization.arrayToDataTable（）；
变量选项1={
标题：“PSNL重量表”，
背景颜色：{fill:'none'}
};
var data2=google.visualization.arrayToDataTable（）；
var选项2={
标题：“PSNL睡眠图”，
背景颜色：{fill:'none'}
};
var chartA=新的google.visualization.LineChart（document.getElementById（'chart_div'）；
document.getElementById（'chart_div'）。style.display='block'；
document.getElementById（'chart_div2'）。style.display='none'；
图表绘制（数据1，选项1）；
var chartB=new google.visualization.ColumnChart（document.getElementById（'chart_div2'））；
document.getElementById（'chart_div2'）。style.display='block'；
document.getElementById（'chart_div'）。style.display='none'；
图表B.绘图（数据2，选项2）；
}
setOnLoadCallback（绘图图）；
load（“可视化”、“1”、{packages:[“corechart”]}）；

当jquery滚动时。在滚动到视图中之前，它将打开第一个Div_图表并关闭另一个Div_图表。

您能做一个调整吗？