问题描述
我正在制作一个照片编辑器,您可以在其中上传图像,添加滤镜,放置文字,用铅笔绘图等.问题是我只希望在图像上使用的滤镜适用于画布上的所有内容..我不希望它适用于用铅笔绘制的文字和画出的线条.甚至在香草JS中还是可能的,还是我必须使用一个库?
I am making a photo editor where you can upload an image, add filters, put on text, draw with a pencil, etc. The problem is that the filters that I want on just the image, applies to everything on the canvas. I don't want it to apply to the text and the drawn lines with a pencil. Is this even possible in vanilla JS or would I have to use a library?
当文本颜色实际上设置为红色并且应用了灰度时,这就是我现在的样子:
This is how I it looks right now when the text color is actually set to red and I applied grayscale:
这就是我希望它在应用红色文本和灰度的情况下看起来的样子:
This is how I want it to look with red text and grayscale applied:
其他所有滤镜也都会发生这种情况,但是灰度是最明显的滤镜,因此我以它为例.我没有包含代码,因为我主要是问这是否可能.
This happens with all of the other filters as well, but gray scale was the most obvious one, so I used that as an example. I did not include code as I am mainly asking if this is even possible.
推荐答案
是的,可以在您执行以下操作后,只需将 ctx.filter
设置回"none"
已经绘制了图像.
Yes it's possible, just set the ctx.filter
back to "none"
after you've drawn the image.
这篇关于如何将context.filter仅应用于画布上的图像?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!