格式化C3.js的JSON

Question

我有一个特定的JSON输出,我需要转换为一个C3.js线图的x和y轴,但它似乎不喜欢它当前格式化的方式:

{
    "results": [
        {
            "param": "x",
            "val": [
                1,
                2,
                3,
                4
            ]
        },
        {
            "param": "y",
            "val": [
                2,
                3,
                5,
                6
            ]
        }
    ]
}

转换它(使用JS)的最佳方法是什么,以便C3可以读取它.

最终我要上传多个xy折线图,所以我猜测它必须是这样的示例代码,而是从json中提取它:

var chart = c3.generate({
    data: {
        url: '/sampleJSON',
        mimeType: 'json',
        xs: {
            'param-y': 'param-x',
            'data2': 'x2', //not sure how to name these ones differently on load, but this is a different issue
        },
        columns: [
            ['param-x', 1, 2, 3, 4],
            ['param-y', 2, 3, 5, 6],
            ['x2', 30, 50, 75, 100, 120], //again just placeholder to eventually have other data
            ['data2', 20, 180, 240, 100, 190] //again just placeholder to eventually have other data
        ]
    }
});

Answer 1

c3我只是分三步处理,而不是用来制作json请求.

1. 进行json调用.
2. 强制数据到结构c3 columns想要.
3. 创建图表.

d3.json("sample.json", function(data) {
  var modData = [];
  data.results.forEach(function(d, i) {
    var item = ["param-" + d.param];
    d.val.forEach(function(j) {
      item.push(j);
    });
    modData.push(item);
  });
  var chart = c3.generate({
    data: {
      columns: modData
    }
  });
});

这里的例子.