使用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中

回答

相关问题