在窗口大小调整大小调整Highcharts图例

Question

我想更改Highcharts图例大小（特别是其宽度）。下面是一些代码我试图用基于研究，我做的事：

  $(window).resize(changeSummaryLayout); 

      function changeSummaryLayout() { 
       var w = window.innerWidth; 
       if (w < 1370 && w > 992) { 
        for (i = 0; i < charts.length; i++) { 
         charts[i].highcharts().setTitle({ x: -5 }); 
         charts[i].highcharts().legend.options.y = 150; 
         charts[i].highcharts().margin[3] = 0; 
         charts[i].highcharts().legend.options.width = 200; 
         charts[i].highcharts().legend.itemStyle.width = 200; 
         for (var index in charts[i].highcharts().series) { 
          charts[i].highcharts().legend.destroyItem(charts[i].highcharts().series[index]); 
         } 
         charts[i].highcharts().legend.render(); 
         //charts[i].highcharts().legend.update({ itemStyle150 }); 
         //charts[i].highcharts().isDirtyLegend = true; 
         //charts[i].highcharts().redraw(); 
         //charts[i].highcharts().isDirtyBox = true; 
        } 
        $('#chartContainer').css('height', '400px'); 
        $('.pieChartTotal').css('height', '390px'); 
        $('.pieChartCanvasSum').css('height', '330px !important'); 
        $('.highcharts-container').children().css('height', '330px'); 
        $('.highcharts-background').attr('height', '330px'); 
       } 

这些解决方案都没有被worknig改变宽度和，有什么奇怪的，宽度只得到后，我在悬停我的鼠标更新传说。任何人都可以向我解释为什么会发生？

有什么解决方案可以在这里使用吗？

Answer 1

我想你可以尝试这样的：

var chart = new Highcharts.Chart({ 
...... 
}); 


function resizeWindow(){ 
    chart.legend.options.width = widthyouwanttoadd; 
    chart.legend.itemStyle.width = widthyouwanttoadd; 
    for(var index in this.chart.series) { 
     chart.legend.destroyItem(chart.series[index]); 
    } 
    chart.legend.render() 
}