如何使用highchart api生成饼图

Question

如何使用highchart api

生成饼图

我写了一个模块来使用highchart api绘制饼图。它与我合作，但它显示错误 我在这里的问题如何计算数据中的 y 属性 或者如何从这张表中显示圆环图，如果这张表扩展了我如何动态显示圆环图  

我将此表转换为对象

chart_data = {
    categories: ["question one", "question two", "question three"],
    inner_categories : ["poor", "average", "good", "excellent"],
    values : [
        [2, 0, 0, 0],
        [0, 1, 1, 0],
        [0, 0, 0, 2]
    ]
}

并通过此对象传递此功能以绘制圆环图

draw_dune_chart(type, chart_data)

以及此功能的实现

function draw_dune_chart(type, chart_data){

    var chart;
    var main_categories_chart = chart_data.categories;
    var inner_categories_chart = chart_data.inner_categories;

    var values_chart = chart_data.values;

    var colors = Highcharts.getOptions().colors,
        categories = main_categories_chart,
        name = 'Browser brands',
        data = [
            {
                y: 15,
                color: colors[0],
                drilldown: {
                    name: 'MSIE versions',
                    categories: inner_categories_chart[0],
                    data: values_chart[0],
                    color: colors[0]
                }
            }, {
                y: 22,
                color: colors[1],
                drilldown: {
                    name: 'Firefox versions',
                    categories: inner_categories_chart[0],
                    data: values_chart[1],
                    color: colors[1]
                }
            }, {
            y: 22,
                color: colors[2],
                drilldown: {
                    name: 'Chrome versions',
                    categories: inner_categories_chart[0],
                    data: values_chart[2],
                    color: colors[2]
                }
            }
        ];

    var browserData = [];
    var versionsData = [];
    for (var i = 0; i < data.length; i++) {
        browserData.push({
            name: categories[i],
            y: data[i].y,
            color: data[i].color
        });

        for (var j = 0; j < data[i].drilldown.data.length; j++) {
            var brightness = 0.2 - (j / data[i].drilldown.data.length) / 5 ;
            versionsData.push({
                name: data[i].drilldown.categories[j],
                y: data[i].drilldown.data[j],
                color: Highcharts.Color(data[i].color)
                                 .brighten(brightness).get()
            });
        }
    }

    chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'pie'
        },
        title: {
            text: 'Browser market share, April, 2011'
        },
        yAxis: {
            title: {
                text: 'Total percent market share'
            }
        },
        plotOptions: {
            pie: {
                shadow: false
            }
        },
        tooltip: {
            valueSuffix: '%'
        },
        series: [
            {
                name: 'Browsers',
                data: browserData,
                size: '60%',
                dataLabels: {
                    formatter: function() {
                        return this.y > 5 ? this.point.name : null;
                    },
                    color: 'white',
                    distance: -30
                }
            }, {
                name: 'Versions',
                data: versionsData,
                innerSize: '60%',
                dataLabels: {
                    formatter: function() {
                        return this.y > 1 ? '<b>'+ this.point.name +'
                                          : </b> '+ this.y +'%'  : null;
                    }
                }
            }
        ]
    });
}

这段代码它生成了像这个img的圆环图，但我想生成的错误方式就像这个例子http://www.highcharts.com/demo/pie-donut