Saturday, 15 January 2011

dyamically constructing javascript object -



dyamically constructing javascript object -

i'm trying dynamically populate javascript object info have fetched api (pivotal tracker).

i have javascript object called 'results' looks this:

[ {"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"}]

and i'm trying write javascript dynamically populate chartjs object graph 1 line each 'state' showing number of 'points' each 'range.

the chartjs object (with dummy data) looks this:

var info = { labels : ["january","february","march","april","may","june","july"], datasets : [ { fillcolor : "rgba(220,220,220,0.5)", strokecolor : "rgba(220,220,220,1)", pointcolor : "rgba(220,220,220,1)", pointstrokecolor : "#fff", info : [65,59,90,81,56,55,40] }, { fillcolor : "rgba(151,187,205,0.5)", strokecolor : "rgba(151,187,205,1)", pointcolor : "rgba(151,187,205,1)", pointstrokecolor : "#fff", info : [28,48,40,19,96,27,100] } ] }

what have tried far is:

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

its obvious haven't initialised array within info properly, can't quite figure out how should done. same apply datasets, when there.... pointers? thanks!

i'm not sure followed question. here commented code:

var set = [ {...}, {...}, {...}]; // initialize info object var info = { labels:[], datasets:[] }; // distinct list of labels (range). // * done in separate step known count // * of labels initializing datasets data.labels = set.reduce(function(memo,el){ if (memo.indexof(el.range) === -1) memo.push(el.range); homecoming memo; },[]); // distinct list of datasets (states) var _sets = set.reduce(function(memo,el){ if (memo.indexof(el.state) === -1){ memo.push(el.state); // create dataset record @ same index // matching state. // initiatize info collection each label data.datasets.push({ data:data.labels.map(function(){ homecoming 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" }); } homecoming memo; },[]); // go through set , assign points // appropriate info 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 fiddle: http://jsfiddle.net/2xp56/

javascript object chart.js

No comments:

Post a Comment