Highcharts的饼图大小的控制

在Highcharts中，饼图的大小是Highcharts自动计算并进行绘制。饼图的大小受数据标签大小、数据标签到切片的距离影响。当数据标签内容较多，并且距离切片较远时，饼图就会被压缩的很小。解决这个问题，有以下几种方法：
（1）如果不需要特别强调数值大小，可以取消数据标签的显示。
（2）使用配置项distance为数据标签和切片的距离指定一个较小的值。甚至可以指定一个负值，让数据标签显示在切片的内部。

（3）使用饼图的配置项size强制设置饼图的大小。

series: [{
				    	type: 'pie',
				    	size:'180%',
            			innerSize: '80%',
				        data: [
				            ['Firefox',   44.2],
				            ['IE7',       26.6],
				            ['IE6',       20],
				            ['Chrome',    3.1],
				            ['Other',    5.4]
				        ]
				    }]

数据图形展示页面，四个图形，上边俩，下边俩，客户机的分辨率不同，所以如果把图形的宽度高度写死，那么会造成屏幕显示不友好，抽空想了下，很简单

• 先让图形浮动，代码很简单：

<div>
    <div id="container1" style="min-width: 600px; min-height: 400px; float:left">div>
    <div id="container2" style="min-width: 600px; min-height: 400px; float:left">div>
    <div id="container3" style="min-width: 600px; min-height: 400px; float:left">div>
    <div id="container4" style="min-width: 600px; min-height: 400px; float:left">div>
div>

• 使用jquery：

$(window).resize(function() {
    var width_frm = $(document.body).width();
    var height_frm = $(document.body).height();
            var width_div = width_frm/2;
    var height_div = height_frm/2;

    $('#container1').css("height", height_div);
    $('#container1').css("width", width_div);

    $('#container2').css("height", height_div);
    $('#container2').css("width", width_div);

    $('#container3').css("height", height_div);
    $('#container3').css("width", width_div);

    $('#container4').css("height", height_div);
    $('#container4').css("width", width_div);
});

• 这里出现一个问题，无法获取高度，原因是页面的头文件格式不对，改为如下即可：

>

• 效果如下，改变窗体大小，图形跟着变换：