如何使用HTML5-Canvas为图像着色?

ice*_*eea 1 javascript html5 canvas

如何使用HTML5-Canvas为图像着色?基于Hex-或RGB-颜色值作为输入?

thi*_*dot 5

试试CamanJS.

Colorize过滤器看起来完全符合您的要求:http://camanjs.com/docs/filters.html#section-13

将图像中的颜色均匀地移向给定的颜色.

调整范围为0到100.值越高,图像中的颜色越接近给定的调整颜色.

Caman("#image", function () {
    // Explicitly give the R, G, and B values of the
    // color to shift towards.
    //
    // Arguments: (R, G, B, strength)
    this.colorize(25, 180, 200, 20);

    // The other way is to specify a color in hex form:
    this.colorize("#4090D5", 20);
});
Run Code Online (Sandbox Code Playgroud)

有关内置过滤器的更多示例:http://camanjs.com/guides/#BuiltIn