带有 json 数组 c3.js 的列数据答案

【问题标题】：Column data with json array c3.js带有 json 数组 c3.js 的列数据
【发布时间】：2015-04-19 09:38:25
【问题描述】：

我正在尝试使用 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"}

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

【问题讨论】：

标签： javascript mysql json c3

【解决方案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
       }
   }
});

Demo Example

【讨论】：