如何克服fabricjs中的慢速图像滤镜?

时间:2015-08-24 12:34:47

标签: fabricjs

我有一个复选框用于在图像上应用biur过滤器,但每次检查或取消选中时,应用过滤器的时间都会增加。

有人对此有任何想法吗?

$(document).ready(function(){

  function applyFilter(index, filter) {
    var obj = canvas.getActiveObject();
    obj.filters[index] = filter;
    obj.applyFilters(function(){
        canvas.renderAll(canvas);
        $('#loader').hide();
    });
  }

  var canvas = this.__canvas = new fabric.Canvas('c'),
      f = fabric.Image.filters;



      var filters = ['grayscale', 'invert', 'remove-white', 'sepia',                          'sepia2', 'brightness', 'noise',
                     'gradient-transparency', 'pixelate', 'blur',                            'sharpen', 'emboss', 'tint', 'multiply', 'blend'];

   $('#blur').on('click', function() {
    $('#loader').show();     
    var checked = $(this).prop('checked');   
    applyFilter(9, checked && new f.Convolute({
      matrix: [ 1/5, 1/5, 1/5,
                1/5, 1/5, 1/5,
                1/5, 1/5, 1/5 ]
    }));
  })
})

点击here 小提琴。

0 个答案:

没有答案