如何使用C3.js在餅圖圖例項目文本中顯示％值？

Question

我創建了餅圖，它工作正常。在餅圖中，標籤顯示％值，也很好。但現在我只想在圖例項目文本中顯示％值。

var ChartDesignCreated = c3.generate({ 
    bindto: "#Chart1", 
    data: { 
     columns: [ 
      ['Football', 10)], 
      ['Cricket', 10)], 
     ], 
     type: 'pie' 
     } 
    }); 

傳奇項目文本應該顯示像：

Football = 50%

Cricket = 50%

這可能嗎？

謝謝。

Answer 1

有沒有內置的方式來做到這一點。
但是，你可以把百分比爲數據標籤文本圖表呈現前：

var columns = [ 
    ['data1', 30], 
    ['data2', 120] 
]; 

var total = columns.reduce(function(sum, item) { 
    return sum + item[1] 
}, 0); 

columns = columns.map(function(item) { 
    return [ 
     item[0] + ' = ' + d3.format('.1%')(item[1]/total), 
     item[1] 
    ] 
}); 

var chart = c3.generate({ 
    data: { 
     columns: columns, 
     type : 'pie' 
    } 
}); 

https://jsfiddle.net/Dimmy/y2LLftx0/2/