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

Question

如何使用 HTML5-Canvas 为图像着色？ 基于十六进制或 RGB 颜色值作为输入？

Answer 1

尝试 CamanJS .

Colorize 过滤器看起来正是您想要的:http://camanjs.com/docs/filters.html#section-13

Uniformly shifts the colors in an image towards the given color.

The adjustment range is from 0 to 100. The higher the value, the closer the colors in the image shift towards the given adjustment color.

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);
});

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