让dc.js图表成为流星中的响应式图表

Question

我正在使用dc.js和crossfilter在Meteor中创建一些图表。一切都准备好了，我已经准备好了所有的图表，但是有一个关于如何使图表反应的问题。我在JavaScript文件中从客户端的mongoDB中交叉过滤集合的数量；在这里，每当集合中的数据发生变化时，我必须更新传递给crossfilter的数据。

假设，对于应用程序上的每个页面，我订阅了8个不同的集合，每个集合都有大约30个数据字段/列。每个字段中的这些数据每隔30秒左右就会发生变化或更新。现在的问题是，随着数据的变化，页面中的图表必须用新数据更新，并重新呈现所有图表。

我了解到在Meteor中有几种方法可以使页面具有响应性，比如deps.autorun( )和tracker.autorun( )。问题是，我应该在上面的函数中放入什么代码来使我的图表具有响应性？

PS:如果你需要任何澄清，请回复，这个问题已经变得很长了。

Answer 1

假设您有一个“dcChart”模板，并从主页调用该模板，如下所示

{{> dcChart data=dcChartData}} 

数据的帮助器为：

'dcChartData': function () {
    var data = SomeCollection.find(...);
    return data;
}

您的代码应该如下所示：

Template.dcChart.rendered = function () {
  var template = this;
  buildChart(template.data);

  template.autorun(function () {
     var templateData = Template.currentData();
     buildChart(templateData);
  });
}

在自动运行部分中，您可以通过传递反应数据(集合中的记录)来重新呈现图表。因此，每次更新集合时，都会再次呈现图表)。