Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

Tags:

d3.js

dc.js

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);
});
like image 224
pramod24 Avatar asked Jun 08 '26 17:06

pramod24


1 Answers

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.

like image 180
Gordon Avatar answered Jun 10 '26 07:06

Gordon