fabricjs применить фильтр к изображению

Question

У меня есть программа, как:

var filters = [ 
    new fabric.Image.filters.Grayscale(), 
    new fabric.Image.filters.Sepia2(), 
    new fabric.Image.filters.Invert(), 
] 

function grayscale(url, filter) { 
    var canvas = document.createElement('canvas') 
    document.body.appendChild(canvas) 
    console.log(fabric) 
    fabric.Image.fromURL(url, function(oImg) { 
     canvas.add(oImg) 
    }) 
    var obj = canvas.getActiveObject() 
    obj.filters[filter] = filters[filter] 
    obj.applyFilters(canvas.renderAll.bind(canvas)) 
    var img = canvas.toDataURL('image/png') 
    return img 
} 

и я зову это нравится:

var img = grayscale("some_url", 0) 
console.log(img) 

Я использую ткань из КДС ...

Здесь Я даю url изображения как параметр и фильтр тоже.

Я хочу, чтобы это изображение было преобразовано в оттенках серого, и я получаю преобразование i маг в качестве ответа.

Здесь я получаю ошибки, такие как canvas.add не является функцией. canvas.getActiveObject() не является функцией.

Что здесь не так?

Нужна помощь

Answer 1

Вы должны инициализировать холст с Fabirc, после добавления холста к документу

var canvas = this.__canvas = new fabric.Canvas('id_canvas');