隱藏Highcharts標籤和放大圖

Question

我有我需要通過整個容器div來延長時，頁面被改變尺寸（變薄）

我試圖以編程方式隱藏在調整大小標籤漏斗圖但圖表仍停留在一側的DIV

https://jsfiddle.net/MicheleC/9oh3ttss/7/

function toogle_chart_label(chart, series, show){ 
    var opt = chart.series[series].options; 
    if(typeof show == 'undefined') { 
     opt.dataLabels.enabled = !opt.dataLabels.enabled; 
    } else { 
     opt.dataLabels.enabled = show 
    } 
} 

function funnel_labels_adjust(){ 
    if($('#container').width() < 300){ 
     toogle_chart_label(funnel_chart, 0, false) 
    } else { 
     toogle_chart_label(funnel_chart, 0, true) 
    } 
} 

$(window).resize(function() { 
     funnel_labels_adjust() 
}); 

Answer 1

在Highcharts 5還有一個新特性responsive。它允許您指定將在某些條件下應用的圖表選項。 在你的情況，你想禁用數據標籤當圖表低於寬度300

responsive: { 
     rules: [{ 
      condition: { 
      maxWidth: 300 
      }, 

      chartOptions: { 
      plotOptions: { 
       funnel: { 
       dataLabels: { 
       enabled: false 
       } 
      } 
      } 
     } 
     }] 
    } 

例如：https://jsfiddle.net/9oh3ttss/8/

如果你不想使用該功能，你需要使用動態方法，如series.update()

series[0].update({ 
    dataLabels: {enabled: false/true} 
});