plotting multi dimensions in DC for D3

Question

I would like to make two plots using dc.js My data relates to multiple sessions (each usually happens on a separate day). Each session has multiple exercises which are scored on various parameters.

The plots:

A selection-type plot. I plot all sessions (by time or perhaps session id) and then use a filter to allow the user to select a range.
An aggregate-type plot. This will show an average of all exercise parameter data over the selected sessions.

The idea is the user can alter the selected range and look for trends in performance change.

My data in json format looks like:

 "Data": [
        {
            "excerciseId": 1,
            "startTime": "01-Jan-2013 10:10:00",
            "stopTime": "01-Jan-2013 10:13:00",
            "numberReps": 11,
            "power": 6.3345681,
            "control": 4.180355137,
            "stability": 0.4893870991,
            "rate": 4.375298413,
            "session": 1,
        },
        {
            "excersiseId": 2,
            "startTime": "01-Jan-2013 10:30:00",
            "stopTime": "01-Jan-2013 10:33:00",
            "numberReps": 12,
            "power": 5.118183368,
            "control": 9.957258023,
            "stability": 9.752985592,
            "rate": 3.202822695,
            "session": 1,
        },
        {
            "excersiseId": 1,
            "startTime": "02-Jan-2013 10:30:00",
            "stopTime": "02-Jan-2013 10:33:00",
            "numberReps": 4,
            "power": 5.597765864,
            "control": 4.512012222,
            "stability": 8.563329462,
            "rate": 7.23380183,
            "session": 2,
        },
        ...
        ...
        ...]

However, I reorganized it into a flat structure to play nicely with crossfilter.

I created a group and dimensions like this:

var sessionDimension = ndx.dimension(function(d) { return d.session; });
var numRepsBySession = sessionDimension.group().reduceSum(function(d) { return d.numReps; });

and I have a nice bar chart like this:

var sessionsByDateBarChart = dc.barChart("#sessions-By-Date-Bar-Chart");
    sessionsByDateBarChart.width(500)
    .height(150)
    .dimension(sessionDimension)
    .group(numRepsBySession)
    .gap(1)
    .x(d3.scale.linear().domain([0, 5]))

My problem is making a chart to show the summary of performance for the selected sessions. What I really want is a dc.rowChart to plot the average of power, control, stability. I'm confused as to how to organize my data. How can I do a group by reduceSum on more than 1 dimension? My graph needs to have multiple dimensions, but power, control, etc. can't be grouped as they are not the same thing/units?

I am sure I am missing a trick in organizing my data . . . can anyone point me in the right direction?

plotting multi dimensions in DC for D3

Answers (1)

Related Questions