값을 기반으로하는 DCjs- 크로스 필터 그룹화 키

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', '~ 10', '10 + '및 Y 값은 상기 범위에 분류 키 수가 될 것이다 막대 그래프를 작성하고 싶다. 즉. ('10-5 ', 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/