無法添加任何東西到我的d3條形圖

Question

Here是我的條形圖的簡化的公開目錄版本。我似乎無法添加任何內容。我正在關注this教程，嘗試將x軸上的垂直線和每個欄內的文本添加到我的圖中，但都沒有顯示出來。基本上我沒有真正顯示出來，我嘗試添加，但是我可以添加x軸線，您可以在graph.js @ line 65中看到。您可以看到我在哪裏試圖在代碼行中的圖中添加線條56在graph.js中。這些x值是任意的，因爲我只是想讓它們出現。我究竟做錯了什麼？

Answer 1

問題是您的選擇器「行」不夠具體。文檔中已有'行'元素;他們形成軸蜱。

因此，您的代碼正在執行以下操作。它選擇現有的線元素並綁定您提供給這些元素的數據。由於這些元素已經存在，所以enter（）選擇將是空的。這意味着你的追加（「線」）命令將不會被執行：

 var lines = svg.selectAll("line") 
      .data(data) 
      .enter().append("line") 

您可以通過添加一個類的特異性更高。例如，下面應該工作：

var lines = svg.selectAll("line.rules") 
    .data(data) 
    .enter().append("line") 
    .attr("class", "rules"); 

更多的輸入，更新和退出的選擇，可以在Mike的文章Thinking with Joins找到。