値に基づくDCjs-Crossfilterグループ化キー

Question

次のデータセットがあります。

[{..... att1: a, hits: 2}, 
{..... att1: a, hits: 2}, 
{..... att1: a, hits: 3}, 
{..... att1: b, hits: 2}, 
{..... att1: b, hits: 2}, 
{..... att1: c, hits: 9}, 
] 

は、私は、xの値が範囲「0-5」、「5-10」、'10 +」とyの値がその範囲に入るキーの数になるだろう棒グラフを作成します。すなわち、 （ '0-5'、1）、（ '5-10'、2）、（'10 + '、0）

Answer 1

データをバケットに一致する序数のセットに変換するディメンションを作成します。その後、その次元をグループ化します。あなたのグループは、各バケットに入るレコードの数をカウントします。

var data = [{att1: 'a', hits: 2}, 
    {att1: 'a', hits: 2}, 
    {att1: 'a', hits: 3}, 
    {att1: 'b', hits: 2}, 
    {att1: 'b', hits: 2}, 
    {att1: 'c', hits: 9}, 
]; 
var cf = crossfilter(data); 
var dim = cf.dimension(function(d) { 
    if(d.hits <= 5) return '0-5'; 
    if(d.hits <= 10) return '5-10'; 
    return '10+'; 
}); 
var grp = dim.group(); 
console.log(grp.all()); 

の作業例（コンソールを確認してください）：https://jsfiddle.net/esjewett/u10h4xsu/2/

その後は、これに基づいて、あなたのdc.jsの棒グラフを構築することができます。棒グラフと

var barChart = dc.barChart("#bar"); 

barChart.dimension(dim) 
    .group(grp) 
    .x(d3.scale.ordinal().domain(['0-5','5-10','10+'])) 
    .xUnits(dc.units.ordinal); 

dc.renderAll(); 

例：https://jsfiddle.net/esjewett/u10h4xsu/4/