Question

我有这个（可能是奇怪的）设置，我将ajax的模板分类到我的页面的一部分，然后尝试在其中一个元素中绘制一个带有D3.js的图表。那个模板。

奇怪的是，有时它呈现，有些它不会，抱怨我想出的必须是保持图表在那一刻没有呈现的元素，因为它来自ajax调用。

我怎样才能克服这一点？我一直在阅读jQuery的when()和then()，但我似乎无法掌握它（如果有的话）在我的情况下如何帮助我。

这是我的代码的（更简单）版本：

$.get("/url/to/my/template", function(templateData){
    // this element is already in the page
    $("#elementInThePage").html(templateData);
    // this function draws the D3 chart
    buildChart();
});

function buildChart(){
    // this element comes in the template
    // sometimes it's already available, other times it isn't
    // and obviously d3 complains about it not being there
    var element = d3.select("#elementInTemplate");
    // do more stuff (...)
}

总结一下，如何确保在buildChart()呈现时只拨打#elementInTemplate？

编辑：我已尝试将.done()链接到我的$.get，但完全相同的事情发生了。

EDIT2：我想我错误地解释了我的问题。 D3.js并没有抱怨它不在那里。实际发生的是，它正在有条件地绘制图表中元素的大小（WxH），并且因为该元素仍然没有被渲染，所以它会使图表浮出水面。

EDIT3：另一个（相关的，我认为），请注意：在buildChart()中，D3.js取决于模板元素的尺寸。所以，如果我

console.log($("#elementInTemplate").width()+" x "+$("#elementInTemplate").height());

如果失败，我会234 x 0。如果有效，我会234 x 456。

在动态添加的div中绘制D3.js图

0 个答案: