unique values count in dc.js + crossfilter

Question

I am stuck at a unique problem involving dc.js and crossfilter. I have some data which i need to display using Number Charts powered by dc.js. However i found minimal documentation for the number charts and hence posting my query.

Here is the JSFiddle for what i have conceptualized so far.

I basically want to show the unique project count in box 1 which in this case would be 3, unique place count in box 2 which in this case would be 11 and the screen failure rate which would be 2/15*100 i.e. 15.3%

Currently i have made this working using jquery but thats just a hack. I would like to have these number charts based on cross table aggregation so that i can drill down on the data.

I have come across examples for reductions to calculate counts but they were for bar charts but in the number chart we need to have a value accessor for displaying data.

Can someone help me out please?

PS: Here is the jquery code that i wrote. Dont know if this would be helpful.

$(document).ready(function() {
    var baseURL = window.location.origin;

    $.ajax({
        url : baseURL + '/api/PlaceTable',
        type : 'GET',
        data : {},
        async : true,
        dataType : "json",
        success : function(response) {


            //Project Count
            var projectIdCount = [];
            for (i = 0; i < response.length; i++) {
                if(response[i].Project != undefined){
                    if($.inArray(response[i].Project, projectIdCount) === -1){
                        projectIdCount.push(response[i].Project);
                    }                    
                }
            }
            $('#number-box1').text(ProjectIdCount.length);


            //Place Count
            var placeIdCount = [];
            for (i = 0; i < response.length; i++) {
                if(response[i].Place != undefined){
                    if($.inArray(response[i].Place, placeIdCount) === -1){
                        placeIdCount.push(response[i].Place);
                    }                    
                }
            }

And for displaying a running sum of a column containing binary values i used this code, which worked in the number chart:

numberChart
        .valueAccessor(function(x){ return +flag.groupAll().reduceCount().reduceSum(function(d) { return d.Flag; }).value();})
        .group(ndx.groupAll());

fiddle updated with groups jsfiddle.net/anmolkoul/L686qaLs/12 — anmol koul

Gordon Gordon · Accepted Answer · 2015-03-13T19:46:58

The failure percentage calculation is a separate problem which I think you've asked elsewhere. To get the unique count, it is pretty easy to make a "fake groupAll" which returns the number of unique keys in its value method.

We'll also need to filter out the empty bins since crossfilter doesn't do that automatically.

function bin_counter(group) {
    return {
        value: function() {
            return group.all().filter(function(kv) {
               return kv.value > 0;
            }).length;
        }
    };
}

var projectGroup = project.group();

projectCount
    .valueAccessor(function(x){ return x;})
    .group(bin_counter(projectGroup));

Updated fiddle here, still ignoring the failure% part: http://jsfiddle.net/gordonwoodhull/vct0dzou/1/

unique values count in dc.js + crossfilter

1 Answers