plotAnimator派不做动画

时间:2013-11-19 17:19:04

标签: jquery flot

我正在使用插件jquery.flot.animator.min.js为使用flot完成的饼图设置动画,但我有错误

TypeError: o[0] is undefined

是否可以使用此插件为饼图设置动画(我在示例中只看到了直线,点和条)?

这是一段代码

<html>
    <head>

    <script language="javascript" type="text/javascript" src="static/js_fw/flot/0.8.1/jquery.js"></script>
    <script language="javascript" type="text/javascript" src="static/js_fw/flot/0.8.1/jquery.flot.min.js"></script>
    <script language="javascript" type="text/javascript" src="static/js_fw/flot/0.8.1/jquery.flot.animator.min.js"></script>

    <style type="text/css">

    .demo-container {
        position: relative;
        height: 400px;
    }

    #placeholder {
        width: 550px;
        height: 400px;
    }



    </style>

    <script type="text/JavaScript">

    var pippo = function() {

        // Randomly Generated Data

        var data = [],
            series = Math.floor(Math.random() * 6) + 3;

        for (var i = 0; i < series; i++) {
            data[i] = {
                label: "Series" + (i + 1),
                data: Math.floor(Math.random() * 100) + 1
            }
        }

        $.plotAnimator('#placeholder', data, {
            series: {
                pie: {
                    show: true,
                    radius: 3/4,
                    label: {
                        show: true,
                        radius: 3/4,
                        //formatter: labelFormatter,
                        background: {
                            opacity: 0.5,
                            color: '#000'
                        }
                    }
                }
            },
            legend: {
                show: true
            }
        });

    };

    $(function() {
        pippo();
    });


    </script>
    <title>Radar Chart</title>
    </head>
    <body >

    <div class="demo-container">
            <div id="placeholder" class="demo-placeholder"></div>

        </div>

    </body>
</html>

感谢

1 个答案:

答案 0 :(得分:3)

动画插件需要采用Flot标准格式的数据,其中每个系列都有一个[x,y]对数组。当它尝试将单个饼图值作为数组读取时会出现错误。

但即使你解决了这个问题,也可以通过逐步向系列添加点来完成动画。用馅饼你只有一个点,所以它什么都不做。

所以不,动画插件不支持馅饼。