0

我尝试使用此示例来创建 C3 图表。但是它使用了api中的所有数据。我正在使用 angularjs。

我的数据看起来像这样 [ No:1 Name:'abc' Id:3 Value:34 ]

这是我的代码

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
        }
    });
});

谢谢

4

1 回答 1

0

data字段还必须填充有关轴的信息。这里有一个功能示例(对不起西班牙变量):

 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
                    }
                }
            }
        });

data中,包含 x 轴的格式和值(在此图中,您有四个变量和 x 值)。您也可以使用axis键格式化 x 轴。

于 2015-04-28T07:35:28.313 回答