mongodb - MongoDB Collection 作为 Meteor 应用程序中 cs.js 的数据源

Question

正如标题所说，我正在使用c3.js在 Meteor 应用程序中绘制图表。但是，所有示例都静态设置数据源的变量。

我找不到c3与 Mongo 一起使用的正确方法。假设我有一个简单的模板，如下所示

<template name="model1">
    <div class="chart"></div>
</template>

然后图表代码如下

Template.model1.rendered = function () {
    var chart = c3.generate({
        bindto: this.find('.chart'),
        data: {
            json: [
                {name: 'www.site1.com', upload: 100
                    , download: 200, total: 400}
            ],
            keys: {
                value: ['upload', 'download']
            }
        },
        axis: {
            x: {
                // type: 'category'
            }
        }
    });
};

如何json使用查询 Mongo 的结果填充该字段，例如Models.find({"model" : "model1"},{"actual" : 1, "_id": 0}).

从 Mongo shell 运行等效db.models.find({"model" : "model1"},{"actual" : 1, "_id": 0})程序返回{"actual" : [ 1, 2, 3 ] }

我只是不知道如何解决这个问题

Answer 1

您可以定义Meteor.methods和Meteor.call检索数据并将其填充到 d3 中。

方法.js

Meteor.methods({

  data: function(){

    check(arguments, [Match.Any]);

    return Models.find({"model" : "model1"},{"actual" : 1, "_id": 0}).fetch();

  }

});

模板.html

Template.model1.onRendered(function () {

  var self = this;

  Meteor.call('data', function (error, result) {

    var chart = c3.generate({
      bindto: self.find('.chart'),
      data: {
        json: result,
        keys: {
          value: ['upload', 'download']
        }
      },
      axis: {
        x: {
          // type: 'category'
        }
      }
    });

  });

});