dc.js餅圖傳說：只顯示前5個

Question

我正在生成一個有大約50個項目的餅圖（精確的圓環圖），但前5個佔圖表的95％。當我顯示圖例信息時，它與圖表重疊，因爲有很多圖例項目。我想知道是否有一個選項可以將圖例顯示限制在前5項。

https://github.com/dc-js/dc.js/blob/master/web/docs/api-latest.md#legend

我沒有看到任何選項來限制圖例顯示說前5名或前10名。

Answer 1

您可以隨時修改dc.js庫本身，你可以做在下面傳奇mixin：

dc.legend = function() { 
... 
//START MODIFICATION 
var _maxItems; 
_legend.maxItems = function(maxItems) { 
    _maxItems = maxItems; 
    return _legend; 
}; 
//END MODIFICATION 
... 
_legend.render = function() { 
    _parent.svg().select('g.dc-legend').remove(); 
    _g = _parent.svg().append('g') 
     .attr('class', 'dc-legend') 
     .attr('transform', 'translate(' + _x + ',' + _y + ')'); 
    var legendables = _parent.legendables(); 

    //START MODIFICATION 
    if (_maxItems) { 
     legendables = legendables.slice(0, _maxItems); 
    } 
    //END MODIFICATION 
... 
}