$(function () {

    var colors = Highcharts.getOptions().colors,
        categories = ['已关闭', 'NEW', '已解决'],
        name = 'Browser brands',
        data = [{
                y: 290,
                color: colors[0],
                drilldown: {
                    name: 'close bug version',
                    categories: ['当前版本', '历史版本'],
                    data: [20,270],
                    color: colors[0]
                }
            }, {
                y: 64,
                color: colors[1],
                drilldown: {
                    name: 'fix bug version',
                    categories: ['当前版本', '历史版本'],
                    data: [8,56],
                    color: colors[1]
                }
            }, {
                y: 82,
                color: colors[2],
                drilldown: {
                    name: 'NEW bug versions',
                    categories: ['当前版本', '历史版本'],
                    data: [5,77],
                    color: colors[2]
                }
            }];


    // Build the data arrays
    var browserData = [];
    var versionsData = [];
    for (var i = 0; i < data.length; i++) {

        // add browser data
        browserData.push({
            name: categories[i],
            y: data[i].y,
            color: data[i].color
        });

        // add version data
        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()
            });
        }
    }

    // Create the chart
    $('#container11').highcharts({
        chart: {
            type: 'pie'
        },
        title: {
            text: '当前版本在历史版本总和占比'
        },
        yAxis: {
            title: {
                text: 'Total percent market share'
            }
        },
        plotOptions: {
            pie: {
                shadow: false,
                center: ['50%', '50%']
            }
        },
        tooltip: {
    	    valueSuffix: '' //这里更改tooltip显示的单位
        },
        series: [{
            name: 'Browsers',
            data: browserData,
            size: '80%',
            dataLabels: {
                formatter: function() {
                    return this.y > 5 ? this.point.name : null;
                },
                color: 'white',
                distance: -30
            }
        }, {

            name: 'Versions',
            data: versionsData,
            size: '100%',
            innerSize: '80%',
            dataLabels: {
                formatter: function() {
                    // display only if larger than 1
                    return this.y > 0 ? '<b>'+ this.point.name +':</b> '+ this.y+'个'  : null;
                }
            }
        }]
    });
});