大或未知數量與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/