highcharts - 甜甜圈圖 - 內外標籤

Question

我用highcharts庫創建了一個甜甜圈圖表。

我需要有兩個不同的數據標籤，一個在外面，另一個在內部數據標籤。

預期的結果：

這裏是一個小提琴：http://jsfiddle.net/FQxf4/

JS：

$(function() { 
    $('#container5').highcharts({ 

     chart: { 
      type: 'pie', 
      options3d: { 
       enabled: false, 
       alpha: 0 
      } 
     }, 

     colors: ['#081969', '#0e2569', '#1e3b81', '#284893', '#30509b'], 
     title: { 
      text: '' 
     },tooltip: { 
      enabled: false 
     }, 
     plotOptions: { 
      pie: { 
       innerSize: 130, 
       depth: 45 
      } 
     }, 
     series: [{ 
      name: 'Delivered amount', 
      data: [ 
       ['31%', 31], 
       ['25%', 25], 
       ['22%', 22], 
       ['15%', 15], 
       ['7%', 7] 
      ] 
     }] 
    }); 
}); 

Answer 1

，可以使用兩個相同的系列。事情是這樣的：

series: [{ 
     name: 'Delivered amount', 
     data: [ 
      ['31%', 31], 
      ['25%', 25], 
      ['22%', 22], 
      ['15%', 15], 
      ['7%', 7] 
     ], 
     size: '60%', 
     dataLabels: { 
       formatter: function() { 
        return this.y 
       }, 
       distance:10 
      } 
    },{ 
     name: 'Delivered amount', 
     data: [ 
      ['3', 31], 
      ['2', 25], 
      ['2', 22], 
      ['5', 15], 
      ['7', 7] 
     ], 
     size: '60%', 
     dataLabels: { 
       formatter: function() { 
        return this.point.name 
       }, 
       color: 'white', 
       distance:-10 
      } 
    }] 

DEMO