Javascript d3移除和退出未正确移除堆叠条中的项目

我有一个堆叠的条形图，可以使用下拉菜单进行更新和过滤。当图表第一次呈现时，我没有问题，但当我取消选中某个选项时，rect不会被删除

我在移除后检查了阵列，它确实从阵列中移除了。这里的问题是

rect

被移到最左边。x轴确实会被更新，并且与该对象关联的文本会被删除

我的感觉是，我的选择有问题，但我感到困惑，因为我有表示每个对象的序列的

rect

和

g

。我不确定删除元素时是否选择了正确的对象

我的代码：

以下是删除一项后图表的外观：

正如您所看到的，

rect

仍然存在，但已向左移动

我已经包含了代码的重要部分。任何关于如何使我的代码在Plunker上工作的反馈都将不胜感激

d3.选择全部（“输入”）。打开（“更改”，函数（）{
var paragraphID=d3.select（this.attr）（“id”）；
paragraphID=字符串（paragraphID）；
如果（选中此项）{
如果（段落ID=='A'）{
数据推送({
制作公司：“A”，
及格：50，
不及格：65，
总数：11
});
}
}否则{
data=data.filter（d=>d.production\u company！==paragraphID）；
}
xScale_production.domain（data.map）（函数（d）{
返回d.生产公司；
}));
yScale_production.domain（[0，d3.max（series_production，d=>d3.max（d，d=>d[1]）））；
var group=svg\u stack\u production.选择全部（“g”）.数据（系列\u production）；
var mbars=group.selectAll（“rect”）.data（d=>d）；
mbars.enter（）
.append（“rect”）
.attr（“x”，宽度）
.attr（“y”，d=>yScale_生产（d[1]））
.attr（“宽度”，xScale_production.bandwidth（））
.合并（MBA）
.attr（“x”，（d，i）=>xScale_生产（d.data.production_公司））
.attr（“y”，d=>yScale_生产（d[1]））
.attr（“宽度”，xScale_production.bandwidth（））
.attr（“高度”，d=>yScale_产量（d[0]）-yScale_产量（d[1]）；
组。选择全部（“g”）
.exit（）
.remove（）；
mbars.selectAll（“rect”）.exit（）.remove（）
});

调用exit之前无需选择元素，它们已经在选择中。只要打电话：

group.exit().remove();

mbars.exit().remove();

而不是：

group.selectAll("g").exit().remove();

mbars.selectAll("rect").exit().remove();

---

我解决了这个问题，这里有两个问题。首先，我需要克隆原始数据，然后按照@Michael Rovinsky的建议对其应用过滤。 其次，

series\u生产

需要在过滤数据后更新

这里是工作代码的链接

---

这并不能解决问题，但它让我明白这肯定是一个选择问题，因为当我应用你的建议时，轴心被删除了。我现在向

组添加了一个类

，以确保它不会选择其他

g

元素如果问题仍然存在，请提供一个工作片段或fiddle Plunker链接现在正在工作。我改变了d3版本，我看到问题了。您加载数据，在其上构建x比例和轴，然后在复选框更改时更改数据。。。您需要做的是：保存加载的数据并使其不可变，每次选中或取消选中时创建数据的筛选副本，然后使用筛选数据重新绘制整个图表谢谢您的建议，我已采纳您的建议。我不知道我必须使数据集不可变。但是，我的问题还没有解决，x轴是唯一更新的元素。酒吧还在那里。