Javascript画布上下文过滤器仅适用于模糊

我对将CSS过滤器应用于javascript画布的图像数据感兴趣。我已经找到了答案。例如，这适用于模糊

var canvas=document.getElementById'canvas'； var ctx=canvas.getContext'2d'； ctx.filter='blur3px'； ctx.font='48px serif'； ctx.strokeText'helloworld'，50100；

---

您看不到亮度效果，因为文本默认为黑色

亮度会更改选定颜色的浓度，并将其与黑色混合，因此，例如，如果您有红色文本和亮度属性70%，则您的文本将有70%的红色和30%的黑色

只需在strokeStyle中添加颜色：

var canvas=document.getElementById'canvas'； var ctx=canvas.getContext'2d'； ctx.filter='brightness70%'； ctx.font='48px serif'； ctx.strokeStyle=‘红色’； ctx.strokeText'helloworld'，50100；

---

我已经找到了我问题的答案：你必须把画布画到自己身上才能应用过滤器。 var canvas1=document.getElementById'canvas1'； var ctx1=canvas1.getContext'2d'； var canvas2=document.getElementById'canvas2'； var ctx2=canvas2.getContext'2d'； ctx1.font='48px serif'； ctx1.strokeStyle=‘红色’； ctx1.strokeText'helloworld'，50,50； ctx1.filter='brightness0%'； ctx2.font='48px serif'； ctx2.strokeStyle=‘红色’； ctx2.strokeText'helloworld'，50,50； ctx2.filter='brightness0%'； ctx2.2,0,0； 之前 之后