[Chartjs]-Dyamically constructing javascript object

1πŸ‘

βœ…

I’m not sure I followed your question. Here is some commented code:

var set = [
    {...},
    {...},
    {...}];

// Initialize data object
var data = { labels:[], datasets:[] };

// Get the distinct list of labels (range).
// * Done in a separate step to get a known count
// * of labels for initializing the datasets
data.labels = set.reduce(function(memo,el){
    if (memo.indexOf(el.range) === -1)
        memo.push(el.range);

    return memo;
},[]);

// Get a distinct list of datasets (states)
var _sets = set.reduce(function(memo,el){
    if (memo.indexOf(el.state) === -1){
        memo.push(el.state);

        // create a dataset record at the same index as 
        // the matching state. 
        // Initiatize the data collection for each label
        data.datasets.push({
            data:data.labels.map(function(){ return 0 }),
            name:el.state,
            fillColor : "rgba(151,187,205,0.5)",
            strokeColor : "rgba(151,187,205,1)",
            pointColor : "rgba(151,187,205,1)",
            pointStrokeColor : "#fff"
        });

    }
    return memo;
},[]);

// Go through the set and assign points to the 
// appropriate data bucket
set.map(function(el){
    var setIdx = _sets.indexOf(el.state);
    var labelIdx = data.labels.indexOf(el.range);

    data.datasets[setIdx].data[labelIdx] += el.points;
},[]);

console.log(data);

And a fiddle: http://jsfiddle.net/2xP56/

1πŸ‘

results was not an array (missing []) perhaps that was the problem?

var results = [{
"state": "finished",
"range":"6 months",
"points":0,
"numberStories":0,
"points / story":"N/A"
},
{
"state":"finished",
"range":"9 months",
"points":0,
"numberStories":0,
"points / story":"N/A"
},
{
"state":"finished",
"range":"12 months",
"points":0,
"numberStories":0,
"points / story":"N/A"}
];

var data = {
        labels: []
    };   


for (var i = 0 ; i < results.length ; i++) {
    data.labels.push(results[i].range);
}

alert(data.labels.length);

Otherwise, this should work I think?

Also note that you first define data and then later on redefine it. (But that’s probably on purpose for the example?)

Note that if you know its name, you can access a property directly with .range (instead of ["range"])

Leave a comment