使用json数组c3.js的列数据

Question

我正在尝试使用C3.js创建一个图表,但是有一个显示json数据的问题.

这是我的数据:

{StatsID: "1", label: "unique-visits", month: "2014-10", value: "17230"},
{StatsID: "2", label: "unique-visits", month: "2014-11", value: "17658"},
{StatsID: "3", label: "unique-visits", month: "2014-12", value: "15624"},
{StatsID: "4", label: "completes", month: "2014-10", value: "5323"},
{StatsID: "5", label: "completes", month: "2014-11", value: "6359"},
{StatsID: "6", label: "completes", month: "2014-12", value: "8216"},
{StatsID: "7", label: "quals", month: "2014-10", value: "552"},
{StatsID: "8", label: "quals", month: "2014-11", value: "318"},
{StatsID: "9", label: "quals", month: "2014-12", value: "332"}

理想情况下,我想要一个折线图,其中每一行代表一个标签,图上的每个点都是一个值.这可能吗？在我将这些数据输入图表时,它只显示所有这些值中的一行.

Answer 1

将 json 重新格式化为类似的内容

var jsonObject={
       data:{
              'unique-visits': [17230,17658,15624],
              'completes': [5323,6359,8216],
              'quals': [552,318,332]
            },
       keys:['2014-10', '2014-11', '2014-12']
      }

使用类别轴显示多行

var chart = c3.generate({
   data: {
       json:
          jsonObject.data
   },axis: {
       x: {
           type: 'category',
           categories: jsonObject.keys
       }
   }
});

演示示例