如何模糊画布元素的一部分？答案

【问题标题】：How to blur a part of a canvas element?如何模糊画布元素的一部分？
【发布时间】：2016-06-26 13:05:11
【问题描述】：

如何模糊我的画布元素的一部分？

我正在使用一个名为three.js 的JavaScript 3D 库。 Three.js 是一个使 WebGL 更简单的库。它们在那里提供了一些模糊和景深示例，但我认为这些是我不熟悉的后期处理效果。是否有一种“简单”的方法可以从画布元素顶部模糊例如 60px？

【问题讨论】：

【解决方案1】：

您可以克隆您的画布元素并向 css 添加模糊效果。

canvas = document.getElementById("canvas")
clone = background.cloneNode("canvas");
document.getElementById("blurred").appendChild(clone);

类似于 this

【讨论】：