在餅圖中隱藏數據標籤在400px以下寬度 - Highcharts

Question

我試圖在圖表寬度低於400px時使用Highcharts中的新的響應選項來隱藏餅圖上的數據標籤。

我的響應代碼如下：

responsive: { 
    rules: [{ 
     condition: { 
      maxWidth: 300 
     }, 
     plotOptions: { 
      pie: { 
       allowPointSelect: true, 
       cursor: 'pointer', 
       dataLabels: { 
        enabled: false, 
        format: '<b>{point.name}</b>:{point.percentage:.1f} %', 
        style: { 
         color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black' 
        } 
       } 
      } 
     } 
    }] 
} 

，其目的是使設置爲false低於400像素的dataLabels。我試圖在這裏http://jsfiddle.net/chv4ux0z/但無濟於事，有人知道我做錯了什麼，我跟着Highcharts的例子，但不能似乎得到這個權利？！

Answer 1

我認爲你應該能夠在responsive.rules.chartOptions對象中添加你的plotOptions。那麼您的圖表應能正常工作： http://api.highcharts.com/highcharts/responsive.rules.chartOptions

responsive: { 
    rules: [{ 
     condition: { 
     maxWidth: 400 
     }, 
     chartOptions: { 
     plotOptions: { 
      pie: { 
      allowPointSelect: true, 
      cursor: 'pointer', 
      dataLabels: { 
       enabled: false, 
       format: '<b>{point.name}</b>:   {point.percentage:.1f} %', 
       style: { 
       color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black' 
       } 
      } 
      } 
     } 
     } 
    }] 
    } 

活生生的例子：http://jsfiddle.net/chv4ux0z/2/