Loading multiple CSV in DC.js, adding a value, and concatenating the results into a single dataTable

Question

I have four CSVs with the same header information, each representing a quarterly result within a year.

Therefore for one result I can load it and display it into a d

Answer 1

Like Lars said, you can use the queue library. Here is an example of how this might work:

Step 1) Queue up your files:

<script type="text/javascript" src="http://d3js.org/queue.v1.min.js"></script>
var q = queue()
    .defer(d3.csv, "data/first-quarter")
    .defer(d3.csv, "data/second-quarter");

Step 2) Wait for the files to load:

q.await(function(error, q1data, q2data) {

Step 3) Add the data to crossfilter:

    var ndx = crossfilter();
    ndx.add(q1data.map(function(d) {
        return { callTypes: d['Call Types'], 
                 callDesc: d['Call Description'],
                 callVol: d['Call Volume'],
                 quarter: 'Q1'};
    }));
    ndx.add(q2data.map(function(d) {
        return { callTypes: d['Call Types'], 
                 callDesc: d['Call Description'],
                 callVol: d['Call Volume'],
                 quarter: 'Q2'};
    }));

Step 4) Use your cross filter as you wish:

var timeDimension = ndx.dimension(function(d){
   return d.quarter;
});

dataTable
  ... //data table attributes

dc.renderAll();

Here is an example using this approach with the dc.js library: https://github.com/dc-js/dc.js/blob/master/web/examples/composite.html