CODEWITHSUNDEEP
javascriptdatatabledc.jscrossfilter
Donal Rafferty
Donal Rafferty

Reputation: 19826

Crossfilter + dc.js DataTable not sorting correctly

I'm using a basic dc.js DataTable with my CrossFilter data and trying to sort it via my Value attribute which is a number but I am getting odd ordering of the data.

Here is a JSFiddle showing the issue - http://jsfiddle.net/DonalRafferty83/97mwyp0u/4/

I set up my CrossFilter dimensions as follows:

var ndx = crossfilter(data);

var parseDate = d3.time.format("%d/%m/%Y").parse;

data.forEach(function(d) {
    d.date = parseDate(d.InDate);
    d.Value = parseFloat(d.Value).toFixed(2);
});

var dateDim = ndx.dimension(function(d) {return d.date;});
var typeDim = ndx.dimension(function(d) {return d.Type;});

And then I create the DataTable as follows:

var datatable   = dc.dataTable("#dc-data-table");
datatable
    .dimension(dateDim)
    .group(function(d) {return "";})
    .size(data.length)
    // dynamic columns creation using an array of closures
    .columns([
        function(d) { return d.Id; },
        function(d) {return d.Indate;},
        function(d) {return d.Type;},
        function(d) {return d.Category;},
        function(d) {return d.Value;}
    ]).sortBy(function(d) {
        return d.Value;
    })
    .order(d3.descending);

Here is what the ordering comes out like, as you can 99 is ordered before 4000.46 which is incorrect:

Incorrect ordering

Is this a known issue with CrossDilter/dc.js? Or is there something I am doing wrong? Maybe I need to manipulate my data to make it work as in the correct manner?

Upvotes: 0

Views: 1998

Answers (1)

Ethan Jewett
Ethan Jewett

Reputation: 6010

.toFixed(2) returns a string, and as such your sortBy function is sorting a string. Therefore it is correct that "99" is ordered before "4000.46". Switching your sortBy function to return +d.Value; (the + forces a conversion back to a number) should fix your problem.

A fixed version of the JSFiddle: https://jsfiddle.net/j9adz6bs/

Upvotes: 2

Related Questions