保留复选框d3中未选中的数据

Question

我真的很难将选中/未选中的内容链接到行。

当从复选框中选中选项时，我设法选择了行。 但是，如果取消选择选项，则将其完全删除。 我不想删除它们，而是希望它们具有诸如颜色之类的属性。

我只参加了相关部分，因为原始代码过长。 数据按键-国家/地区嵌套，并且复选框选项包含国家/地区作为ID /值。

最初将呈现线条（相同的路径，但为灰色），并且下面的部分正在为复选框中选定的线条着色。

线条成功上色，但取消相应选项时它们消失。相反，我想让它们保留为灰色的初始颜色。

但是.exit（）在这里似乎不起作用。 我真的很挣扎...有人可以帮助我吗？

d3.select(#checkbox).on("change", function() { 

    var country = this.value
        display = this.checked ? "inline" : "none"; 

    var filtered = lineWrapper
                    .selectAll(".line")
                    .filter(function(d) { return d.key === country; });

    filtered
        .transition()
        .duration(2000)
        .ease(d3.easeLinear)
            .style("stroke",  function(d) {return colScale(d.key); })
            .style("stroke-width", 3)
            .style("fill", "none");

    filtered
        .exit()
        .transition()
            .style("stroke", "#C0C0C0")
            .style("stroke-width", 1)
            .style("fill", "none");