how to display bottom data for row chart using dc.js

Question

I'm making a rowchart using the Dimensional Charting javascript library dc.js, which is based on d3 and crossfilter. i am display the rowchart for top(10) data.but i am trying to display rowchart for bottom(10) data but graph can be display same as the top(10) data.how to display bottom(10) data.

  constRowChart.width(350)
    .height(1000)
    .margins({top: 20, left: 120, right: 10, bottom: 20})
    .transitionDuration(750)
    .dimension(density)
    .group(const_total)
    .renderLabel(true)
    .gap(1)
    .title(function (d) {
        return "";
    })
    .elasticX(true)
    .colors(d3.scale.category20c())
    .ordering(function(d) { return d.value })
    .xAxis().ticks(3).tickFormat(d3.format("s"));

constRowChart.data(function (group) {
    return group.top(10);
});

There's no bottom function, but you could try reversing the order of the elements and taking the top 10 again. — Lars Kotthoff
Thanks @LarsKotthoff for helping answer so many questions. Please consider using the Answer section, even if you don't care about reputation, so that we can get more of these questions marked as answered. It'll make my "gardening" easier. — Gordon

Gordon Gordon · Accepted Answer · 2014-05-03T16:58:33

If you don't want to create another dimension/group as @LarsKotthoff suggests, you can also use .top(Infinity) and then .splice(-10) the last ten entries off the array.

There are efficiency tradeoffs between having extra dimensions versus sorting all the data, so you might try both to see which performs better.

how to display bottom data for row chart using dc.js

1 Answers