使用javascript express路徑將JSON加載到C3.js中

我正在嘗試使用c3.js繪製圖形。我能夠按照入門步驟操作，因此我知道模塊正常工作，但是當我嘗試使用自己的數據時，圖表不能正常顯示。使用javascript express路徑將JSON加載到C3.js中

我從數據庫中提取數據，並存儲它像這樣：

MongoClient.connect(url, function(err, db) { 
    assert.equal(null, err); 
    console.log("Connected successfully to server"); 
    findDocuments(db, function(docs){ 
     //console.log(docs); 
     exports.getData = function(){ 
     return docs; 
     } 
    db.close(); 
    }); 
});

我肯定知道這個作品，它提供了一個很長的字符串輸出如下：

[{"_id":"5885dc66c2ef160d2163fb79", 
"temperature":18, 
"humidity":27, 
"visibleLight":260, 
"irLight":255, 
"date":"2017-01-23T10:35:16+00:00", 
"epochtime":1485167716703}]

該數據然後裝入使用index.js像這樣我的觀點：

router.get('/', function (req, res) { 
    res.render('index', { 
    title: 'Dashboard', 
    allData: db.getData() 
    }); 
})

據此間這些樣本：http://c3js.org/samples/data_json.html 我試圖繪製圖形：

var chart = c3.generate({ 
    data: { 
    json: allData, 
    keys: { 
     x: 'date', // it's possible to specify 'x' when category axis 
     value: ['temperature', 'humidity'], 
    } 
    }, 
    axis: { 
    x: { 
     type: 'timeseries' 
    } 
    } 
});

來源

2017-01-23 Polar

只是在這裏拋出一些想法。是否有可能你的'c3.generate（）'代碼行在命令router.get（）'promise被解析之前就被命中了？就像測試一樣，如果你用一個硬編碼的樣本替換你的'json：allData'，它是否按預期工作？ –

這裏的問題是你對自己的時間戳看起來像失蹤的定義。 c3/d3應該如何知道你使用的是什麼樣的模式？

var chart = c3.generate({ 
    data: { 
      //use xFormat to define how your pattern looks like 
      xFormat: '%Y-%m-%dT%H:%M:%S+00:00', 
      json: [ 
       // your awesome data 
      ], 
      keys: { 
       x: 'date', 
       value: ['temperature', 'humidity'], 
      } 
     }, 
     axis: { 
      x: { 
       type: 'timeseries', 
       tick: { 
       //use tick.format to change how your pattern 
       //will look in your chart (maybe more user friendly) 
       format: '%Y-%m-%d' 
       } 
      } 
     } 
});

因爲你的時區偏移看起來很奇怪（+00:00），你應該看看D3得到您想要的圖案的time formatting api。

來源

2017-01-23 20:34:00 Akoya

使用javascript express路徑將JSON加載到C3.js中

回答

相關問題