使用數組在時間序列數據源圖表C3.js

Question

我想用數組作爲C3.js圖表​​像這樣來源：

var xData = ['2017-07-28', '2017-07-29']; 
var yData = [30, 200]; 

var chart = c3.generate({ 
    bindto: '#chart', 
    data: { 
     x: 'x', 
     xFormat: '%Y-%m-%d', 
     columns: [ 
      ['x', xData], 
      ['data1', yData] 
     ] 
    }, 
    axis: { 
     x: { 
      type: 'timeseries', 
      tick: { 
       format: '%Y-%m-%d' 
      } 
     } 
    } 
}); 

但它給了我這樣的錯誤：

Failed to parse x '2017-07-28,2017-07-29' to Date object

Error: attribute transform: Expected number, "translate(NaN, 0)".

如果我使用直接值，那麼它完美的作品：

var chart = c3.generate({ 
    bindto: '#chart', 
    data: { 
     x: 'x', 
     xFormat: '%Y-%m-%d', 
     columns: [ 
      ['x', '2017-07-28', '2017-07-29'], 
      ['data1', 30, 200] 
     ] 
    }, 
    axis: { 
     x: { 
      type: 'timeseries', 
      tick: { 
       format: '%Y-%m-%d' 
      } 
     } 
    } 
}); 

Answer 1

在你的情況，

['x', xData] 

等於

['x', ['2017-07-28', '2017-07-29']] 

不

['x', '2017-07-28', '2017-07-29'] 

你可以做的是創建陣列之前：

var xData = ['2017-07-28', '2017-07-29']; 
var yData = [30, 200]; 

xData.unshift('x'); 
yData.unshift('data1'); 

var chart = c3.generate({ 
    bindto: '#chart', 
    data: { 
     x: 'x', 
     xFormat: '%Y-%m-%d', 
     columns: [ 
      xData, 
      yData 
     ] 
    }, 
    axis: { 
     x: { 
      type: 'timeseries', 
      tick: { 
       format: '%Y-%m-%d' 
      } 
     } 
    } 
});