Initial Range selection in DC.js chart
Asked Answered
P

1

8

I would like to make an initial range selection in some dc.js charts (bar and line).
So I add this for example:

.filter([7,10])

And the range appears well on the chart, but apparently 0 observations are selected.
I expected a few thousands observations selected. Like it does when I select the range [7,10] manually with the brush.

Any hint on what I'm missing here?

Part of my code:

    var chart_globalscore = dc.barChart('#chart_globalscore');
(...)
    var ndx = crossfilter(data_movies)
        ,all = ndx.groupAll()
(...)
        ,GlobalScoreDimension = ndx.dimension(function(d) { if ( !isNaN(d.GlobalScore) ) {return Math.round(d.GlobalScore*10)/10 ;} else {return -1;} })
        ,GlobalScoreGroup = GlobalScoreDimension.group()
(...)
        ;
(...)
    chart_globalscore
        .width(width001)
        .height(height001)
        .margins(margins)
        .dimension(GlobalScoreDimension)
        .group(GlobalScoreGroup)
        .round(function(val){return Math.round(val*10)/10;})
        .x(d3.scale.linear().domain([0, 10.1]))
        .filter([7,10])
        .centerBar(false)
        .transitionDuration(transitionDuration)
        .elasticY(true)
        .gap(1)
        .xUnits(function(){return 100;})
        .renderHorizontalGridLines(true)
        .yAxis().ticks(2)
        ;
Pagepageant answered 9/3, 2015 at 9:50 Comment(0)
P
13

The filter code is a bit tricky in dc.js. If you specify an array of values, it will not interpret the array as a range. (It will either interpret the array as a single value, or if the array contains another array, it will filter on the values inside that array.)

Try specifying a ranged filter object instead:

    .filter(dc.filters.RangedFilter(7, 10))
Perfumery answered 13/3, 2015 at 20:36 Comment(2)
Thank you – not super obvious from the documentation.Compony
Yeah, unfortunately you will find the best documentation for many aspects of dc.js and crossfilter in answers here on SO. The API documentation is okay, but we never got around to writing higher-level documentation answering questions like this (and I've retired from the project).Perfumery

© 2022 - 2024 — McMap. All rights reserved.