d3.data跳过第一行数据

Question

我有以下代码可以很好地工作,除非我遍历我的数据集,第一行(0索引)被跳过.

svg.selectAll("rect")
  .data(data)
  .enter()
  .append("rect")
  .attr("x",function(d){
    console.log(data);
    console.log(d);
    return xScale(d.year-1980);
  })

注意console.log(data)返回我的完整数据集,包括第一行,所以数据就在那里!

但是console.log(d)显示包含我的第二行数据之后的所有行 - 它会丢弃第一行.

欢迎任何建议.

Answer 1

我在类似的代码中遇到了同样的问题,并根据Lars Kothoff的评论修正了它.

在我的情况下,改变selectAll对ag元素的工作是有意义的,更像是这样:

svg.selectAll("g")
    .data(data);
    .enter()
    .append("g")
    .append("rect")
    .attr("x",function(d) { return xScale(d.year-1980); });

您还可以使用类来区分rects:

svg.selectAll("rect.year")
    .data(data)
    .enter()
    .append("rect")
    .attr("x",function(d){ return xScale(d.year-1980); })
    .classed("year");