提交表单后，使用 Meteor 集合中新插入的数据更新 d3 图表答案

【问题标题】：Update d3 chart with newly inserted data in a Meteor collection after form submission提交表单后，使用 Meteor 集合中新插入的数据更新 d3 图表
【发布时间】：2013-04-08 07:30:59
【问题描述】：

我的 Meteor 应用程序有点简单，它显示了一个 d3 图表，该图表由存储在新插入的 mongodb 文档中的服务器计算数据生成：

用户填写一个简单的表单并点击提交按钮
服务器使用表单数据执行一些异步工作和 CPU 密集型计算
一个带有 2 个字段（formData 和 calculatedResult）的新 Calculus 文档被插入到 mongodb Calculi 集合中
SVG 图表使用新计算的数据进行更新

尽管reading the Meteor parties example 使用了d3、this tutorial on using d3 and Meteor to generate SVG 和this screencast on how to build a reactive data source，但我真的很困惑！我很难正确理解 Meteor 中的响应式数据源、模板和依赖项。

插入新的 Calculus 文档后，我似乎无法更新 SVG 图表。

这是我的问题：在提交将文档插入集合中的表单后，使用服务器计算的数据自动更新 d3 生成的 SVG 图表是什么一种全面的、对新手友好的方法？

【问题讨论】：

您是否正确设置了 d3 的 .enter()、.transition() 和 .exit() 函数：bl.ocks.org/mbostock/3808218
是的，D3 代码在迁移到 Meteor 之前运行良好。我只是想弄清楚如何插入我认为的反应式数据源:)。
试试这个：github.com/steve/simple-d3-with-meteor

标签： d3.js meteor

【解决方案1】：

您需要让用户订阅 Calculi 集合中的更改 (http://docs.meteor.com/#reactivity)，或者如果您在模板中呈现用户的响应，您可以做出并调用运行 d3 代码的 update() 方法.这将在 d3 代码的更新部分更新您的图表。

【讨论】：