javascript - C3js 和 D3js 错误 : Invalid value for <g> attribute transform ="translate(0,NaN)"

Question

我正在尝试使用 d3js 创建一组面板，然后尝试使用 C3js 用图形填充这些面板。出于某种原因，我不断收到:

Error: Invalid value for <g> attribute transform="translate(0,NaN)"

当我对面板进行硬编码时，它工作得很好。以下是一些显示错误的示例代码:https://jsfiddle.net/tgp9gqfb/2/

我做错了什么方向？

Answer 1

而不是设置数据和制作 div:

d3.select("#page-wrapper").selectAll("div")
            .data(order_labels["a"]);

用 for 循环做同样的事情:

  order_labels["a"].forEach(function(d) {
    new_panels = d3.select("#page-wrapper").append('div').attr('class', "panel panel-default");
    new_panels.append('div').attr('class', "panel-heading").text(function() {
      return readable_lables[d];
    });
    new_panels.append('div').attr('class', "panel-body").append('div').attr("id", function() {
      return d + "graph_wrapper";
    });
    new_panels.append('div').attr('class', "panel-footer");
  });

我同意你的做法是正确的，但内部 c3 错误是因为 div 中的数据，这就是为什么我要求你对 for 循环做同样的事情。

工作代码 here

希望这对您有所帮助!