如何在不重新渲染的情况下清除堆积图

Question

我有一个带有几个堆栈的barChart：

chart
    .dimension(dim)
    .group(group1, element1)
    .groupBars(true)
    .stack(group2, element2)
    .stack(group3, element3)

后来我向当前图表添加了新的维度和分组：

chart
    .dimension(newDim)
    .group(newGroup1, newElement1)
    .groupBars(true)
    .stack(newGroup2, newElement2)

chart.redraw();

然后得到了一些奇怪的东西：

看起来图表从以前的堆栈中有绿色条形。如果我使用chart.render()而不是chart.redraw()，一切正常，但redraw()更好。我该如何解决？

更新：

我认为我需要从图表中删除旧的维度和/或分组，但我该如何做到这一点呢？

- sf_

---

@ISOmetric 我在图表的第二个配置之前添加了这个，但是仍然存在同样的问题。 - sf_

除了这个，你还在做其他事情吗？我们能看到配置之间你所做的所有其他事情吗？ - Jack Parkinson

@ISOmetric 你启发了我一个想法，在第二次配置之前，我会获取一个新的 crossfilter 对象，并从中创建一个新维度。这可能是问题吗？ - sf_

哦，抱歉，crossfilter 是同一个对象。我没有额外的代码:(只需创建新的维度和组，并像我在问题中写的那样在第二个图表配置中使用它们。 - sf_

我认为这可能是分组条形图功能中的一个错误，该功能尚未在dc.js中发布。看起来它需要在重绘时删除任何不存在的“堆栈”，但它没有这样做。您使用的是Kavanagh版本还是Gazal版本？ - Gordon

Answer 1

这只是一个猜测，因为你没有提供代码。

正如我在上面的评论中所说，我认为这是你正在使用的分组条实现中的一个错误。

但实际上，我认为这是dc.js核心中的一个错误：它没有预料到堆栈数量会在不渲染的情况下发生变化。我在这里找到了有关该错误的参考here。（最初有很多仅适用于渲染而不是重绘的东西，我们正在慢慢修补这些问题。）

当你替换堆栈时，请尝试这个方法：

for(var i = nstacks; i < 20; ++i) 
    chart.selectAll('g.stack._' + i + ' rect').remove()

其中nstacks是新图表中堆栈的数量。它将删除任何多余的堆栈，现有的堆栈应该仍然能够正常过渡。

- Gordon

---

谢谢，现在我在添加新配置之前使用 chart.selectAll("g.stack").remove()。 - sf_

当然，这将强制dc.js重新渲染条形图，因此您将失去任何现有条形的过渡效果。如果您要替换所有数据，则过渡可能无意义。 - Gordon