如何在html5中填充纹理(并且仍然能够更改颜色?)

如何在html5中填充纹理(并且仍然能够更改颜色?)

问题描述:

我正在创建一个html5画布绘图应用程序。如何在html5中填充纹理(并且仍然能够更改颜色?)

我想用坚韧的质感来绘画。我知道我可以使用填充特定图像作为纹理,但是颜色被锁定到该图像。我仍然希望能够通过颜色选择器更改颜色。我只想要坚韧不拔。

有什么解决方案可用?

+0

检查我的回答这个问题:http://stackoverflow.com/questions/9303757/how-to-change-color-of-an-image-using- jQuery的/ 9304367#9304367 – Delta 2012-02-24 03:20:15

阅读我的回答为“着色”这里的图片:How can I use a gradient map to tone a HTML5 canvas with an image in the canvas.

你总是可以很容易地操作图像的像素数据来发出不同的色调比原来的颜色(或者没有颜色在所有如果你平均RGB,得到一个灰度图像)。

所以至少有一个选择。

你会在这里做什么:而不是使用图像作为纹理,而是将图像绘制到临时画布上,然后使用颜色选择器修改整个画布的色调,而不是将该画布用作图案。 (图像和画布上创造的模式有效输入)