应用错误收集

我正在创建一个交互式d3应用程序，该应用程序的一部分界面与Bostock的焦点/上下文刷新示例非常相似：

到目前为止，一切都运转正常，但这就是我想做的事情。我想采用上下文区域（底部图表）和高斯模糊画笔背景上的区域（以及它后面的svg图表路径和x轴），这些区域未被画笔范围选中。基本上，我试图产生类似于此的效果：

但由于我的图表是路径而不是一堆小圆圈，因此我不能简单地更改所选区域的路径类。

我的解决方案是在画笔范围的左侧和右侧绘制几个矩形，并使用填充不透明度等对这些矩形进行样式设置，这会产生类似于画笔处理示例的“去强调”效果。

enter image description here

然而，对于真正的高斯模糊，它似乎更棘手。我可以对区域本身进行SVG过滤，但这只会模糊矩形的边缘（它不会对通过它们可见的所有内容应用模糊效果）。我的下一个解决方案是尝试从画布中获取BackgroundImage并模糊它，就像你在这里看到的那样：

但是对于我的生活，我无法使它发挥作用。浏览器是否支持BackgroundImage？我是否需要告诉d3重新调用我的一些页面元素来重新绘制svg元素（因为它们是动态加载的）在我的画笔回调中？还有另外一种方法可以做到这一点吗？