jqPlot hiển thị phần trăm và giá trị trên biểu đồ hình tròn

Question

Tôi đang sử dụng jqPlot với jqplot.PieRenderer để thử và hiển thị biểu đồ hình tròn. Trên nhãn tôi muốn hiển thị value (percent). Tài liệu cho biết bạn có thể vượt qua dataLabel một mảng các loại nhãn (source), tuy nhiên, đặt %d%% (cho phần trăm) và %d (cho giá trị) trong tùy chọn dataLabelFormatString sẽ không hiển thị.

Mọi ý tưởng ở đây?

{ 
    seriesDefaults: { 
     renderer: jQuery.jqplot.PieRenderer, 
     rendererOptions: { 
      showDataLabels: true, 
      dataLabels: ['value', 'percent'], 
      dataLabelFormatString: "%d %d%%", 
      sliceMargin: 4, 
      fill: false 
     } 
    }, 
    legend: { show:true, location: 'e' } 
} 

Answer 1

Tôi đọc các tài liệu này hơi khác một chút. Đó là tùy chọn 'giá trị', 'phần trăm', 'nhãn' HOẶC một mảng nhãn. Không phải là một loạt các tùy chọn. Để làm những gì bạn muốn, bạn sẽ cần phải tạo các datalabels của bạn như một mảng nhãn thực sự.

Ví dụ:

data = [ 
    ['Heavy Industry', 12],['Retail', 9], ['Light Industry', 14], 
    ['Out of home', 16],['Commuting', 7], ['Orientation', 9] 
]; 

var total = 0; 
$(data).map(function(){total += this[1];}) 

myLabels = $.makeArray($(data).map(function(){return this[1] + " " + Math.round(this[1]/total * 100) + "%";})); 

Xem ví dụ fiddle here.

Answer 2

sử dụng

formatter: function(label, series){ 
         return '<div style="font-size:14pt;text-align:center;padding:2px;color:white;">'+Math.round(series.percent)+"%<br/>" + series.data[0][1] +'</div>'; 
        },