我的网页上有2个Google图表，它们位于Bootstrap 3 Carousel的2个独立项目中。在Carousel中的活动项目（幻灯片1）上的图表在屏幕上显示得很好，但是不在活动列表中的图表（幻灯片2）即使在第二张幻灯片处于活动状态时也不会显示。
相关的HTML如下：

<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
    <!-- Indicators -->
    <ol class="carousel-indicators">
        <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
        <li data-target="#carousel-example-generic" data-slide-to="1"></li>
        <li data-target="#carousel-example-generic" data-slide-to="2"></li>
    </ol>

    <!-- Wrapper for slides -->
    <div class="carousel-inner">
        <div class="item active">
            <div id="piechart" class="col-sm-6 col-md-6 col-lg-12" style="height: 500px;"></div>
        </div>
        <div class="item">
            <div id="piecharts" class="col-sm-6 col-md-6 col-lg-12" style="height: 500px;"></div>
        </div>
        <div class="item">
            <div id="piechartss" class="col-sm-6 col-md-6 col-lg-12" style="height: 500px;"></div>
        </div>
    </div>

    <!-- Controls -->
    <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left"></span>
    </a>
    <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right"></span>
    </a>
</div>

JS如下：

<script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
          alert('Helo');
          var data = google.visualization.arrayToDataTable([
              ['CreditorName', 'Balance Amount'],
          @For Each item In Model
              @:['@item.CreditorName', @item.BalanceAmount],
          Next
          ['Et',    0]
        ]);

        var options = {
          title: 'Creditors share in total debt.'
        };

        var chart = new google.visualization.PieChart(document.getElementById('piechart'));

        chart.draw(data, options);
      }
</script>

对于幻灯片2，我不确定何时调用它，但现在我正在使用：

$(document).ready(function () {

    $('#carousel-example-generic').on('slide.bs.carousel', function () {
        // do something…
        loadCharInfo(this);
    })

});

loadChartInfo为：

function loadChartInfo(carouselId)
{

    //google.setOnLoadCallback(drawCharts);
        google.load("visualization", "1", { packages: ["corechart"] });
        var data1 = google.visualization.arrayToDataTable([
      ['Chart2Q', 'Amount'],
      ['Chart2-1', 10000],
      ['Chart2-2', 10000],
      ['Chart2-3', 10000]
        ]);

        var options1 = {
            title: 'Chart 2.'
        };

        var chart1 = new google.visualization.PieChart(document.getElementById('piecharts'));

        chart1.draw(data1, options1);
}

我很确定图表2正在正确加载，因为当我移动幻灯片时，我可以看到第二个图表的一瞥，因为它在滑动的过程中。