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之上。

Flot Pie Chart - 打破1个数据项

1 个答案: