使用 Bootstrap 每 10 秒在 2 个图表之间切换答案

【问题标题】：Changing between 2 chart every 10 seconds using Bootstrap使用 Bootstrap 每 10 秒在 2 个图表之间切换
【发布时间】：2015-05-28 05:42:40
【问题描述】：

我有 2 个图表（折线图和条形图），我想每 10 秒左右在它们之间切换一次。我尝试了 Bootstrap carousel 但当我用图表的 id 替换图像 src 时它似乎不起作用。这两个图表的 id 是：

<div id="SummaryChart"></div>
<div id="DailyBarChart"></div>

有没有办法让它工作？谢谢！

编辑：

<!DOCTYPE html>
<html>

<head>

<?php include 'linechart.php'; ?>
    <link href="assets/plugins/bootstrap/bootstrap.css" rel="stylesheet" />


    </head>

<body>


<div class="cycle-slideshow">
   <div id="PieChart"></div>
   <div id="DailyBarChart"></div>
</div>

        <!-- end page-wrapper -->

    <!-- end wrapper -->

    <!-- Core Scripts - Include with every page -->
    <script src="assets/plugins/bootstrap/bootstrap.min.js"></script>

    <script src="assets/scripts/zingchart-html5-min.js"></script>


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://malsup.github.com/jquery.cycle2.js"></script>
</body>

</html>

它似乎只能在图像上工作。

【问题讨论】：

标签： html twitter-bootstrap charts carousel

【解决方案1】：

使用 jQuery.Cycle2，你可以这样做：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://malsup.github.io/min/jquery.cycle2.min.js"></script>

<div class="cycle-slideshow" data-cycle-timeout="10000" data-cycle-slides="> div">
    <div id="SummaryChart"></div>
    <div id="DailyBarChart"></div>
</div>

【讨论】：

当我使用此方法时，它会在页面上一次显示 2 个图表。
我忘记了第二行中的“http://”。现在它应该可以工作了：jsfiddle.net/w632rqb8 是吗？