javascript - 如何模糊 Canvas 元素的一部分?

标签 javascript html three.js html5-canvas

如何模糊 Canvas 元素的一部分?

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

三.js: http://threejs.org/

enter image description here

enter image description here

最佳答案

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

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

类似于 this

关于javascript - 如何模糊 Canvas 元素的一部分?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35937628/

相关文章:

javascript - 从数组填充时选项卡显示不正确

html - 居中对齐 div 内容的正确方法

javascript - jQuery 向下查找多个级别的子元素

javascript - 三.js+导入模型: how to display edge lines?

Three.js和OrbitControls.js-与地面平行的摇摄相机(例如Google Earth)

javascript - VPAID 前置广告示例

php - Javascript 自动提交表单

javascript - 更改日期,使所有时间偏移 4 小时

javascript - JQuery 看不到更新的属性值

javascript - 在 Three.js 中使网格平行于 xy 平面