hightchart饼状图图例、内容放置在饼上

$(function () {
    $('#container').highcharts({
        chart: {
            plotBackgroundColor: null,
            plotBorderWidth: null,
            plotShadow: false
        },
        title: {
            text: null
        },
        legend: {
            layout: 'vertical',
            align: 'left', //水平方向位置 
            horizontalAlign:'center',
            labelFormatter: function () {
                return this.name + ':'+this.percentage+'%';
            }
        },
        tooltip: {
            headerFormat: '{series.name}
',
            pointFormat: '{point.name}: {point.percentage:.1f}%'
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                depth: 30,
                dataLabels: {
                    enabled: true,
                    color:'black',
                    connectorWidth:0,
                    connectorPadding:0,
                    distance:-30,formatter:function(){
                        return ''+this.point.name+':'+this.point.percentage.toFixed(2)+"%";
                    },
                },
                showInLegend: true
            }
        },
        series: [{
            type: 'pie',
            name: '浏览器访问量占比',
            data: [
                ['Firefox',   45.0],
                ['IE',       26.8],
                {
                    name: 'Chrome',
                    y: 12.8,
                    sliced: true,
                    selected: true
                },
                ['Safari',    8.5],
                ['Opera',     6.2],
                ['其他',   0.7]
            ]
        }]
    });
});

你可能感兴趣的:(hightchart饼状图图例、内容放置在饼上)