2

在我的每张 Flexslider 幻灯片中，我都有一个画布元素，我用 Chart.js 中的图表填充该元素，但由于某种原因，最后一张幻灯片没有显示它。

如果 3d 幻灯片是最后一张，则 3d 不会显示它。如果第 5 个是最后一个，第 5 个不是谁。

HTML：

<div class="flexslider">
  <ul class="slides">
    <li>
        <canvas id="pie0" width="300px" height="300px"></canvas>
        <h1>1st slide</h1>
    </li>
    <li>
        <canvas id="pie1" width="300px" height="300px"></canvas>
        <h1>2nd slide</h1>
    </li>
    <li>
        <canvas id="pie2" width="300px" height="300px"></canvas>
        <h1>3d and last slide</h1>
    </li>
  </ul>
</div>

JS：

$(document).ready(function(){
$('.flexslider').flexslider({
        animation: "slide",
        animationLoop: true,  
  });
});

var pieData = [
            {
                value: 72,
                color:"#EBB035"
            },
            {
                value : 28,
                color : "#eee"
            }

        ];

new Chart(document.getElementById("pie0").getContext("2d")).Doughnut(pieData);

new Chart(document.getElementById("pie1").getContext("2d")).Doughnut(pieData);

new Chart(document.getElementById("pie2").getContext("2d")).Doughnut(pieData);

见 jsFiddle；http://jsfiddle.net/bw24s/

有什么想法吗？一个错误？谢谢！

4

0 回答 0