D3条形图不能显示数组中的第一个元素 [javascript]


Answers

Question

我正在研究D3教程的第一套(在这里找到),并遇到了一个问题,其中数据数组的第一项没有出现。 我在每个数据div元素上放置的边框表明,基本上,第一个条目已经“折叠”成顶部的一排。 是否有解释为什么发生这种情况? 我怎样才能解决这个问题?

我的HTML,CSS和JS已被放到codepen查看和编辑。

提前致谢!

孤立的JS:

var data = [10, 23, 14, 5, 6, 6, 6, 22, 17 ]; 

d3.select(".project") 
  .selectAll(".project__bar-chart")
    .data(data) 
  .enter()
  .append("div") 
    .attr("class", "project__bar-chart")
    .style("width", function(d) {return d + "rem";}) 
    .text(function(d) {return d;})