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