浮动饼图 - 打破 1 个数据项

Question

当只有一个数据项或只有一个具有非零值的数据项时，我在尝试让我的 Flot 饼图显示时遇到了一个奇怪的问题。使用多个数据项一切正常，但是当只剩下一个非零项时（饼图应显示 100%），图表就会中断。我有一个较长的文件，在那里我发现了这个问题，但它也发生在一些简单的代码中。我查看了this 链接并修改了该代码以使其按我想要的方式工作，但将其移至我的代码后它对我不起作用。

<div class='col-md-4'>
    <div class='panel panel-default'>
        <div class='panel-heading'>
            Volunteer Hour Completion
        </div>
        <div class='panel-body'>
                <div class="flot-chart">
                    <div class="flot-chart-content" id="flotcontainer"></div>
                </div>
        </div>
    </div>
</div>

<script type="text/javascript">
$(function () {
    var data = [
        {label: "data1", data:10},
        {label: "data2", data: 20},
        {label: "data3", data: 20}
    ];

    var options = {
            series: {
                pie: {show: true}
            }
         };

    $.plot($("#flotcontainer"), data, options);
});

当我将 data2 和 data3 更改为 0（或只是删除这些项目）时，图表会中断，并且我没有看到 data1 显示为应有的 100%。

知道为什么会这样吗？

Answer 1

您有最新版本的 jquery.js、jquery.flot.js 和 jquery.flot.pie.js 吗？ 尝试将您的 javascript 代码放在 html 之上。