Question

我带了一些符合D3标准的代码。但是现在我的更新功能有问题了。我正在尝试关注General Update Pattern。

当我运行该功能时，我在控制台中收到错误："TypeError: gbars.enter(...).attr is not a function"

function updateBars()
{   
   xScale.domain(d3.range(dataset.length)).rangeRoundBands([0, w], 0.05);
   yScale.domain([0, d3.max(dataset, function(d) { return (d.local > d.global) ? d.local : d.global;})]); 


   var gbars = svg.selectAll("rect.global")
       .data(dataset);

   gbars.enter()
       .attr("x", w)
       .attr("y", function(d) {return h - yScale(d.global); })
       .attr("width", xScale.rangeBand())
       .attr("height", function(d) {return yScale(d.global);});

   gbars.transition()
       .duration(500)
       .attr("x", function(d, i) {
        return xScale(i);
       })
       .attr("y", function(d) {
        return h - yScale(d.global);
       })
       .attr("width", xScale.rangeBand())
       .attr("height", function(d) {
        return yScale(d.global);
       });

   gbars.exit()
       .transition()
       .duration(500)
       .attr("x", -xScale.rangeBand())
       .remove();
}

据我所知，我可能在更新功能方面存在很多错误，但在开始时挂起时很难排除故障。

我的更新目标是从图表中删除/添加系列。他们可以选择显示全局，本地或两者（默认）。我实际上更喜欢当它们悬停在图例上时它只显示该系列。在mouseout上，它将恢复为默认值。

Working Fiddle here

Answer 1

你需要说出你想为新节点做些什么。是的它几乎总是附加但你还是要告诉它：

   gbars.enter()
       .append("rect")
       .attr("class", "global")
       .attr("x", w)

除了该错误之外，一般更新模式的结构在表面上看起来是正确的。

D3js“bars.enter（）。attr”不是一个函数

1 个答案: