Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Uniformly-spaced histogram bins with dc.js?

Mike Bostock uses the following snippet to generate uniformly-spaced bins for a histogram:

var data = d3.layout.histogram()
.bins(x.ticks(20))
(values);

source

Is there any way to adapt this to a project that uses dc.js and crossfilter.js?

Essentially, I want to dynamically generate the bins and then use the chart to filter on a particular attribute. Total newbie to this. Any guidance would be appreciated!

like image 579
Pete Avatar asked Dec 15 '22 15:12

Pete


1 Answers

dc.js supports histograms via crossfilter. Use a group for your bar chart that looks something like this:

var binwidth = 0.2;
var dim = ndx.dimension(function(d) { return d.x; });
var group = dim.group(function(d) { return binwidth * Math.floor(d.x/binwidth); });

This tells crossfilter to use keys binwidth apart.

And initialize the bar chart with these units:

chart.xUnits(dc.units.fp.precision(binwidth));
like image 97
Gordon Avatar answered Dec 30 '22 01:12

Gordon