大或未知数量与c3.js

Question

我一直在使用c3.js一段时间了，现在多XY线图数据数组的，但是我碰到一个问题，绊倒了。我正在使用多个XY折线图功能，而且我的数据集非常庞大。有没有办法做数据轴结合（在XS部分）自动而不是硬编码呢？

var chart = c3.generate({ 
     data: { 
      xs: { 
       'data1': 'x1', 
       'data2': 'x2', 
       . 
       . 
       . 
       'datan': 'xn', 
      }, 
      columns: [ 
       ['x1', 10, 30, 45, 50, 70, 100], 
       ['x2', 30, 50, 75, 100, 120], 
       . 
       . 
       . 
       ['xn', 45, 60, 80, 120, 130], 
       ['data1', 30, 200, 100, 400, 150, 250], 
       ['data2', 20, 180, 240, 100, 190], 
       . 
       . 
       . 
       ['datan', 10, 150, 220, 160, 300] 
      ] 
     } 
    }); 

Answer 1

你只需要建立一个数据系列职称的语法匹配到相关的X系列

假设所有的X1/DATA1等东西的功能是在一个对象（allmydata）你产生前图表，你可以这样做：

var allmydata = [ 
       ['x1', 10, 30, 45, 50, 70, 100], 
       ['x2', 30, 50, 75, 100, 120], 
       ['xn', 45, 60, 80, 120, 130], 
       ['data1', 30, 200, 100, 400, 150, 250], 
       ['data2', 20, 180, 240, 100, 190], 
       ['datan', 10, 150, 220, 160, 300] 
    ]; 

var match = function (dataStr) { 
    return dataStr.startsWith("data") ? dataStr.replace ("data", "x") : undefined; 
}; 

var xs = {}; 
allmydata.forEach (function (series) { 
    var seriesName = series[0]; 
    var xsName = match (seriesName); 
    if (xsName) { 
     xs[seriesName] = xsName; 
    } 
}); 

var chart = c3.generate({ 
     data: { 
      xs: xs, 
      columns: allmydata 
     } 
}); 

http://jsfiddle.net/0f38ffsy/1/