本文介绍了流星,在哪里放d3代码?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用meteor,iron-router和d3。 d3用于反应性地显示基于数据的饼图,其在铁路由器的数据函数中计算。所以,我想要d3运行时,dom是在位。

I use meteor, iron-router, and d3. d3 is used to reactively display a pie chart based on the data, which I calculate in the data function of iron-router. So, I want to the d3 to run when the dom is in place.

但是,我不知道应该在哪里放d3代码。我习惯把它放在数据函数中,我生成的数据。然而,有时数据函数是在dom尚未准备好时计算的(因此d3不能绘制图表)。

However, I don't know where I should put the d3 code. I used to put it in the data function that I generate the data. However, sometimes the data function is computed while the dom is not ready (so d3 cannot draw the chart).

我想在dom完全渲染后运行d3,函数可以访问数据函数的结果。我试着用钩子onAfterAction,但看来这个函数不能访问数据。我也试着使用Template..rendered,像stackoverflow中的一些其他帖子说。但是,呈现的函数似乎只运行一次,并且在数据更改时不会重新运行。我把渲染的函数在Tracker.autorun函数,但它仍然只得到运行一次。

I would want to run d3 after the dom is completely rendered, and the function can access the result of the data function. I tried to use hooks onAfterAction, but it seems this function cannot access the data. I also tried to use Template..rendered, as some other posts in stackoverflow says. However, the rendered function seems to only run once, and it doesn't re-run when the data changes. I put the rendered function in Tracker.autorun function, but it still only get run once.

那么,是否有一个地方可以反应地运行d3代码,可以访问渲染的dom以及数据字段?

So, is there a place to run the d3 code reactively that can access the rendered dom as well as the data field?

感谢。

推荐答案

http://docs.meteor.com/#/full/template_onRendered =nofollow noreferrer> onRendered 回调与。开箱即用的 1.0 ,但是有一个窍门 - 你可以通过使用 like this:

You should use the onRendered callback with a template autorun. Out of the box that doesn't work with 1.0, however there's a trick - you can get the autorun to rerun after a context change by using Template.currentData like this:

Template.myPictures.onRendered(function () {
  this.autorun(function () {
    var data = Template.currentData();
    // use data with d3 here
  });
});

有关详细信息,请参阅。

For more details, see the end of this issue.

这篇关于流星,在哪里放d3代码?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-26 11:53
查看更多