javascript - D3 选择 html -- 传递函数时索引从 1 而不是 0 开始

Question

我对这种行为感到困惑，希望有人能提供一些见解。我有一个数组定义为:

arr_subpop_unique = ["CPL", "NAP", "NPL", "SAP", "SPL", "TPL", "UMW", "WMT", "XER"]

我的D3脚本是这样的:

var sizemapHeader = d3.select("#d3-sizemap-hr").selectAll("div")
        .data(arr_subpop_unique)
      .enter().append("div")
        .attr("class", "sizemap-hr-title ellipsis scroll_on_hover")
        .html(function(d,i){ console.log(d,i); return d; });

问题是索引从 1 开始，所以我丢失了“CPL”值。我在控制台中记录了它，它显然从 1 而不是 0 开始。有人能看出这有什么问题吗？

谢谢!

Answer 1

您似乎已经有了一个 <div>在 ID 为 d3-sizemap-hr 的元素内.

这是一个问题的原因是您只填充了 .enter() 中的元素。状态，不会出现在现有的 div 上。

我有以下建议:

• 始终为使用 D3 动态添加的元素提供唯一的类
• .enter() 尽可能少状态，比如你的 .append()然后是任何其他不会根据数据变化而变化的静态样式。其他一切都进入更新状态。