小编gam*_*ler的帖子

如何通过在 fabric js 中传递颜色代码来创建自定义过滤器

我正在尝试创建一个自定义过滤器,它应该像接受颜色代码一样。

这是我的代码。

它工作正常。

fabric.Image.fromURL('pug.jpg', function(img) {
  img.filters.push(
    new fabric.Image.filters.Sepia(),
    new fabric.Image.filters.Brightness({ brightness: 100 }));

  img.applyFilters(canvas.renderAll.bind(canvas));
  canvas.add(img);
}); 
Run Code Online (Sandbox Code Playgroud)

现在,我需要创建一个具有特定颜色代码的过滤器。我发现的是

fabric.Image.filters.Redify = fabric.util.createClass({

  type: 'Redify',

  applyTo: function(canvasEl) {
    var context = canvasEl.getContext('2d'),
        imageData = context.getImageData(0, 0, canvasEl.width, canvasEl.height),
        data = imageData.data;

    for (var i = 0, len = data.length; i < len; i += 4) {
      data[i + 1] = 0;
      data[i + 2] = 0;
    }

    context.putImageData(imageData, 0, 0);
  }
});

fabric.Image.filters.Redify.fromObject = function(object) {
  return new fabric.Image.filters.Redify(object);
};
Run Code Online (Sandbox Code Playgroud)

我需要解释 for …

javascript jquery image-editing fabricjs

1
推荐指数
1
解决办法
3102
查看次数

标签 统计

fabricjs ×1

image-editing ×1

javascript ×1

jquery ×1