i tried use this example in order create c3 chart. using data in api. using angularjs.
my data looks [ no:1 name:'abc' id:3 value:34 ]
here code
d3.json("http://api.mydata", function(data) { var converteddata = []; data.foreach(function(item){ converteddata.push([item.id, item.value]); }); var chart = c3.generate({ bindto : '#chartcontainer', data : { columns : [converteddata] }, keys: { x: converteddata.id, value: converteddata.value } }); });
thanks
the data
field has populated information axis well. here have functional example (sorry spanish variables):
var chart = c3.generate({ bindto: "#chart-" + value.siglas, data: { x: 'x', x_format: '%y', columns: [ ['x', new date('2011'), new date('2012'), new date('2013'), new date('2014')], ['primera matrícula', value.tasas_2011.tasas1, value.tasas_2012.tasas1, value.tasas_2013.tasas1, value.tasas_2014.tasas1], ['segunda matrícula', value.tasas_2011.tasas2, value.tasas_2012.tasas2, value.tasas_2013.tasas2, value.tasas_2014.tasas2], ['tercera matrícula', value.tasas_2011.tasas3, value.tasas_2012.tasas3, value.tasas_2013.tasas3, value.tasas_2014.tasas3], ['cuarta matrícula', value.tasas_2011.tasas4, value.tasas_2012.tasas4, value.tasas_2013.tasas4, value.tasas_2014.tasas4], ['media nacional' + averageerrorflag, average['tasas_2011'].tofixed(2), average['tasas_2012'].tofixed(2), average['tasas_2013'].tofixed(2), average['tasas_2014'].tofixed(2)] ] }, axis: { x: { type: 'timeseries', tick: { format: "%y" // https://github.com/mbostock/d3/wiki/time-formatting#wiki-format } } } });
in data
, format of x axis , values (in graphic have 4 variables , x value) included. can format x axis axis
key.