Highcharts（PieChart） - 图表宽度在第二次绘制时减少

首先感谢HighCharts ..那么，我正在使用jQuery Mobile中的HighCharts构建饼图。Highcharts（PieChart） - 图表宽度在第二次绘制时减少

我正在显示一些根据响应数据在Ajax成功回调中动态创建的饼图（最多6个图表）。 Ajax最初在document.ready（）中调用，并且还在按钮单击上。

在从的document.ready创建饼图（），所有图表显示水平居中到屏幕上，这是一种预期的结果。但下次从按钮单击创建时，它向左移动一点，即其宽度比在document.ready（）上显示的宽度要小。

我正在为饼图动态创建每个容器<div id="container-x"></div>。
这是我用来创建图表的示例代码。 dataArray是用于绘制饼图的数据集。

$('#container' + i).highcharts({ 
chart: { 
    plotBackgroundColor: null, 
    plotBorderWidth: null, 
    plotShadow: false, 
    type: 'pie', 
    marginBottom: 150, 
    marginLeft: 20 
}, 
title: { 
    text: '' 
}, 
tooltip: { 
    pointFormat: '<b>{point.y:.0f}</b>' 
}, 
plotOptions: { 
    pie: { 
     allowPointSelect: true, 
     cursor: 'pointer', 
     showInLegend: true, 
     dataLabels: { 
      enabled: true, 
      useHTML: true, 
      formatter: function() { 
       return Math.round(this.percentage * 100)/100 + '%'; 
      }, 
      style: { 
       fontWeight: 'bold', 
       color: 'black' 
      } 
     } 
    } 
}, 
legend: { 
    layout: 'vertical', 
    align: 'left', 
    verticalAlign: 'bottom', 
    useHTML: true, 
    maxHeight: 135, 
    itemMarginTop: 2, 
    itemMarginBottom: 2, 
    labelFormatter: function() { 
     var words = this.name.split(/[\s]+/); 
     var numWordsPerLine = 4; 
     var str = []; 
     for (var word in words) { 
      if (word > 0 && word % numWordsPerLine == 0) { 
       str.push('<br>'); 
      } 
      str.push(words[word]); 
     } 
     return (str.slice(0, str.length - 2)).join(' '); 
    }, 
    navigation: { 
     activeColor: '#3E576F', 
     animation: true, 
     arrowSize: 12, 
     inactiveColor: '#CCC', 
     useHTML: true, 
     style: { 
      fontWeight: 'bold', 
      color: '#333', 
      fontSize: '12px' 
     } 
    } 
}, 
series: [{ 
    name: 'Brands', 
    colorByPoint: true, 
    data: dataArray 
}] 
});

附加以下

1.预期的两个屏幕 - 最初加载饼图