Highcharts中的徑向餅圖數據標籤

Question

如何將數據標籤放置在餅圖的楔形區域（內部）中，並對齊到餅圖半徑而不是水平或垂直。這是我以後的一個形象。

也許有人有一個插件，如果它不是一個開箱即用的功能？

甚至有些實驗代碼會很有用。

Answer 1

Highcharts不提供自動在餅圖旋轉數據標籤選項。你可以編寫自定義函數來實現dataLabels旋轉。

下面是簡單的例子，你可以怎麼做：

var allY, angle1, angle2, angle3, 
    rotate = function() { 
     $.each(options.series, function (i, p) { 
      angle1 = 0; 
      angle2 = 0; 
      angle3 = 0; 
      allY = 0; 
      $.each(p.data, function (i, p) { 
       allY += p.y; 
      }); 

      $.each(p.data, function (i, p) { 
       angle2 = angle1 + p.y * 360/(allY); 
       angle3 = angle2 - p.y * 360/(2 * allY); 
       p.dataLabels.rotation = -90 + angle3; 
       angle1 = angle2; 
      }); 
     }); 
    }; 

首先我計算所有Y值的總和。然後我正在計算所有扇形片的中間角度。然後我以相同的角度旋轉數據標籤。

例如： http://jsfiddle.net/izothep/j7as86gh/6/