Html5 canvas 我们如何调整HTML5画布中的级别？

我有一个psd文件，我要在画布上创建一个类似于psd的图像。 Photoshop中应用于图像的过滤器之一是“级别”

我正在使用画布图像处理库-CamanJS

根据我的发现，Photoshop中的级别是画布中的颜色校正，但我在CamanJS中没有看到任何用于此的api

知道我们能不能这样做吗？ 如果其他任何图书馆能使这项任务更容易，我都愿意接受

---

提前感谢。

您可以使用CamanJS进行图像调整，如Photoshop的“级别”

Photoshop“级别”调整实际上是三个主要调整的组合：

• 亮度
• 对比度
• 彩色通道

以下是Photoshop水平调整的CamanJS近似值：

// Combining contrast, brightness & channels
// to simulate a Photoshop "levels" adjustment

Caman("#image", function () {

  this

  // adjust contrast (-100 to 100)

  .contrast(contrastAdjustment)

  // adjust brightness (-100 to 100)

  .brightness(brightnessAdjustment)

  // adjust colors (-100 to 100 for r,g,b)

  .channels({red:5, green: 0, blue: 0})

  // and render the filtered image

  .render();

});

要获得Photoshop将这些值钳制在一定范围内的能力（如PS的直方图控件），可以从使用CamanJS“曲线”开始。但要微调过滤器效果，您必须创建自己的自定义过滤器。CamanJS允许您定义如下自定义过滤器：

// create a custom process to clamp Red between low/high values

Caman.Filter.register("ClampRed", function (low,high) {
    this.process("ClampRed", function (rgba) {
        rgba.r = Math.min(low,Math.max(high));
        return rgba;
    });
});