score:3

Accepted answer

This will rename "key" to "name" and "values" to "children":

var renameKeys=function(obj){
    /*Recursively renames "key" keys to "name" and
    renames "values" keys to "children" */
    obj.name=obj.key;
    delete obj['key'];
    if(obj.values){
        obj.children=obj.values;
        delete obj.values;
        obj.children.forEach(renameKeys);
    }
    return obj;
};

You also need to give the JSON a "root" node in order to work with the collapsible tree visualization you linked to. This should do it:

var nest = d3.nest()
    .key(function(d) { return d.subgroup; })
    .key(function(d) { return d.division; })
    .key(function(d) { return d.product; })
    .entries(parsed);

/*The visualization requires there to be a root node*/
var flareData={key:'root',values:[]};
flareData.values=nest;
renameKeys(flareData);

Here's a JSFiddle to get the JSON you want: http://jsfiddle.net/X2fxC/3/

Here's a JSFiddle with the resulting visualization: http://jsfiddle.net/X2fxC/5/

Your data looks like this when plotted using the expanding tree visualization:

enter image description here


Related Query