Question

在调用我的rects.enter（）。append（）之后，我的rects.attr（）并未为新添加的值设置值。

let rects = svg.selectAll('rect')
    .data(data)

//On update Only
rects.attr('fill', 'black')

//On enter ...
rects.enter()
    .append('rect')
    .style('fill', 'maroon')

//On update AND enter
rects
    .attr('x', (d, i)=>i*(barWidth+padding))
    .attr('y', d=>height - bar_height(d.value))
    .attr('width', barWidth)
    .attr('height', d=> bar_height(d['value']))

基本上，我的理解是在评论中。如果未调用enter（），它将仅对数据中的先前值应用更改。只需将条形设置为其他颜色即可。然后，我进入（）并将颜色更改为所添加的新颜色，最后，我希望现在所有内容都在rect中，可以这么说，它应该更新所有属性。

问题在于，最终属性仅被设置为未附加的值，因此第一遍不绘制任何内容，然后第二遍将其绘制为更新。

我尝试根据this进行更改，这就是我要去的地方。

Answer 1

没有其余代码，以确保此功能有效。您应该使用.merge()。对于v3，方法是不同的，这对于v4 +。

libtext-csv-xs-perl

这会将新添加的let rects = svg.selectAll('rect') .data(data) //On update Only rects.attr('fill', 'black') //On enter ... rects.enter() .append('rect') .style('fill', 'maroon') .merge(rects) .attr('x', (d, i)=>i*(barWidth+padding)) .attr('y', d=>height - bar_height(d.value)) .attr('width', barWidth) .attr('height', d=> bar_height(d['value']))合并到现有rect的选择中，并使用rects语句之后的所有内容更新所有rect。

D3的数据更新未按预期运行

1 个答案: