c3.js如何在x / y Axis中设置json数据 [英] c3.js how to set json datas in x/y Axis

问题描述

我使用c3创建简单的图形。我想从一个Json文件中获取数据并填充它来创建我的线图。

我的Y值应该是（标签），我的X值应该（数据）。
这就是我的代码看起来像：

  var chart = c3.generate（{
 bindto：'#chart'，
 data：{
 xFormat：'％Y-％m-％dT％H：％M：％S'，
 json：{
 times：datas，
 data：labels 
} 
} 
}）; 
  

我的datas（数组）是：

 2014-01-01T10：10：10
2014-02-01T10：10：10
2014-03-01T10：10 ：10
2014-04-01T10：10：10
2014-05-01T10：10：10
 ... 
  

我的标签：

  1234.433 
 2234.431 
 1231.546 
 8965.354 
 .... 
  

如何设置现在，我的数据到X轴和标签到Y？

解决方案

要创建日期直方图，必须将x轴定义为时间序列。 b
$ b

结果如下所示：

  var chart = c3.generate（{
 data：{
x：time，
 json：{
 time：datas，
 data：labels 
} 
}，
轴：{
x：{
 type：timeseries，
 tick：{
 format：％Y-％m-％dT％H：％M：％S 
} 
} 
} 
}）; 
  

I use c3 to create simple graphs. I want to get datas from a Json file and fill it to create my Line-Graph.

My Y Values should be ("Labels") and my X Values should be ("Datas"). So this is, how my Code looks like:

 var chart = c3.generate({
     bindto: '#chart',
     data: {
          xFormat: '%Y-%m-%dT%H:%M:%S',
          json: {
               times:datas,
               data: labels 
                 }
           }
      });

My "datas" (Array) are:

"2014-01-01T10:10:10"
"2014-02-01T10:10:10"
"2014-03-01T10:10:10"
"2014-04-01T10:10:10"
"2014-05-01T10:10:10"
...

And my labels :

 1234.433
 2234.431
 1231.546
 8965.354
 ....

How can I set now, my datas into the X-Axis and labels into Y?

解决方案

In order to create a date histogram, you have to define your x-axis as a timeseries.

The result looks like this:

var chart = c3.generate({
    data: {
        x: "time",
        json: {
            time: datas,
            data: labels
        }
    },
    axis:{
        x:{
            type: "timeseries",
            tick:{
                format:"%Y-%m-%dT%H:%M:%S"
            }
        }
    }
});

这篇关于c3.js如何在x / y Axis中设置json数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！