Fabric.js-将像素化滤镜应用于调整大小的图像

Question

目前，据我所知，Fabric.js的工作方式是将其过滤器应用于原始图像，而不管其在画布上的外观如何。是否可以通过“分支”像素化滤镜或通过其他方法将滤镜应用到画布上所示的图像，调整大小和方向？我该怎么办？

一个例子：我在画布中有一个可以调整大小的图像。用户调整大小。我要对该图像的调整大小版本而不是原始上传的图像应用过滤器。

谢谢！

Answer 1

好的，我想我明白了您要做什么。假设您使用的是像素化滤镜，并且无论图像在画布上有多大，都希望获得一致的块大小，则只需将滤镜的块大小值设置为图像比例的函数即可。通过将blocksize计算放入object:modified事件中，它将在每次修改图像时重新计算。

canvas.on('object:modified', function(e) {
  var obj = e.target;
  if(obj.type == "image") {
      var blocksize = 16 / obj.scaleX;
      obj.filters[0].blocksize = blocksize;
      obj.applyFilters();
  }
});