レーダーチャート（HighCharts）が親コンテナのサイズに完全に埋められていないのはなぜですか？

Question

HTML：

<div id="screenshot-area"> 
    <div id="container"></div> 
    </div> 

CSS：

#screenshot-area { 
    max-width: 1160px; 
    height: 588px; 
    } 
    #container { 
    width: 100%; 
    height: 100%; 
    } 

JS：http://output.jsbin.com/guzisekezu

は、チャートはのフルサイズを取っていません：あなたはここで結果を表示することができ

Highcharts.chart('container', { 
    title: { 
     text: null 
    }, 
    legend: { 
     enabled: false 
    }, 
    tooltip: { 
     pointFormat: '{point.y}' 
    }, 
    chart: { 
     type: 'line', 
     polar: true, 
     spacingTop: 0 
    }, 
    credits: { 
     enabled: false 
    }, 
    xAxis: { 
     categories: ["目力","攻撃力","防御力","覇気"], 
     tickmarkPlacement: 'on', 
     lineWidth: 0 
    }, 
    yAxis: { 
     gridLineInterpolation: 'polygon', 
     lineWidth: 0, 
     min: 0 
    }, 
    series: [{ 
     data: [9,6,5,1] 
    }] 
    }) 

その親は#screenshot-area、therそれらの間には多くのスペースがあります。

Answer 1

極座標のサイズを操作するには、paneオブジェクトのsizeプロパティを使用します。

APIリファレンス：
http://api.highcharts.com/highcharts/pane.size

例：あなたがブラウザを使用している
http://jsfiddle.net/vLfvnw6n/