小编lqd*_*dev的帖子

如何fillStyle = 'rgba(255, 255, 255, 0.2)'在 JavaScript 画布中实现透明框 ( ) 后面的模糊？这是我到目前为止所得到的：

var canvas = document.getElementById('draw');
var c = canvas.getContext('2d');

function main() {
    c.fillStyle = '#222';
    c.fillRect(0, 0, canvas.width, canvas.height);

    c.fillStyle = '#000';
    c.fillRect(32, 32, 64, 64);
    c.fillStyle = 'rgba(255, 255, 255, 0.2)';
    c.filter = 'blur(5px)';
    c.fillRect(16, 16, 128, 24);
}

但所发生的情况是，矩形本身被模糊了，而不是模糊了矩形后面的背景，这很明显。

在最终的脚本中，我可能会使用路径而不是矩形。