C3js和D3js錯誤：的值無效 <g> 屬性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循環執行相同操作的原因。

這里的工作代碼

希望這可以幫助！