Javascript D3-在某些层上禁用/重新启用鼠标悬停

我对D3和JavaScript都是新手，所以我甚至不确定寻找问题答案的最佳方法。我目前正在尝试将其应用于我自己的数据。我已经让它工作了，但是我注意到了一个问题——原来也是一个问题，虽然一开始我没有注意到——那就是当图层被隐藏时，鼠标悬停的提示仍然会触发不可见的按钮

---

有没有办法调整代码，使隐藏层不仅不可见，而且不再触发鼠标悬停事件，这样，一旦上层被隐藏，先前被上层覆盖的下层将可以被鼠标悬停访问？

在该代码中进行尽可能少的更改，只需在筛选之前将

指针事件设置为
none
，在筛选之后设置为
all
：

legend.on("click", function(type) {
    d3.selectAll(".dot")
        .style("opacity", 0.0)
        .attr("pointer-events", "none")
        .filter(function(d) {
            return d["first_careunit"] == type;
        })
        .style("opacity", 1)
        .attr("pointer-events", "all")
        .style("stroke", "black")
});

当然，对于大型重构，有最好的方法

以下是更新的bl.ocks：

与您的问题无关，但从用户的角度来看，您可以选择一个类别，但之后不能取消选择（即全部查看）这一事实令人恼火。
是的，无法重新查看所有内容也让我感到困扰。正在计划下一步解决这个问题：）