Flot饼图在firebug中给出错误:"未捕获的异常:绘图的尺寸无效,width = null,height = null"

Question

我使用flot饼图绘制饼图.但它显示了萤火虫的错误

未捕获的异常:绘图的尺寸无效,width = null,height = null

我也从样式表中给出了高度和宽度.并尝试过这样的

<div id="placeholder1" style="width:140px;height:140px" ></div>

怎么解决这个？

Answer 1

检查这些:

• 首先包含jQuery库,然后是flot js库

• 将整个代码包装在$(document).ready()处理函数中.

• 你用正确的方法捆绑了这个标本,id并且没有相同的重复id.

• 如果你div是动态的,即在页面加载后出现在DOM中,那么plot()在元素出现在DOM 之后绑定.

Answer 2

我也有同样的问题.我为<div>标签设置了高度和宽度,并修复了错误.

您可以使用内联css(如我所做)或JS来设置高度和宽度.但是plot()只有在设置了高度后才能调用函数<div>

<div class="bars_two" style="height:300px;"></div>

Answer 3

我也有同样的问题!答案没有在上面列出,所以这是我的问题和解决方案.

<div id="chart" class="chart" style="width:100%;height:250px;"></div>

使用Javascript:

 <script type="text/javascript">
    $(document).ready(function () {
        var data = [...];
        var options = {...};
        $.plot($("#placeholder"), data, options);
    });
</script>

所以.注意绘图功能.起初,我在第一个参数中没有#.这显然是必要的.它解决了我的问题.

GG.

Answer 4

我找到的一个快速解决方案是在div标签之间输入内容.例如:更改 <div id="placeholder"></div> 为 <div id="placeholder">.</div>或<div id="placeholder">randomtext</div>.

就个人而言,我发现在这个快速解决方案中使用空格/制表符/换行符不起作用.