Как создать анимацию загрузки изображений в Fabric.js?

Question

-им загрузки изображений в мой Fabric.js холст, используя Image.fromURL как так:

fabric.Image.fromURL(url, function(img) { 
    //blah blah blah 
    canvas.add(img).setActiveObject(img); 
}); 

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

У кого-нибудь есть решение? благодаря!

Answer 1

Это должно сделать:

function createCanvasImage(callback) { 
    //Placeholder-Code to set the loading-image spinning 

    //Now load the image with AJAX 
    var sauce = "http://..." 
    var request = $.ajax({ 
    url: sauce, 
    crossDomain: true, 
    type: "HEAD", 
    cache: true, 
    }); 

    //If AJAX loaded your image, the browser will have it in cache, 
    //so now we can add it 
    request.done(function() { 
    fabric.Image.fromURL(sauce, function(img) { 
      //blah blah blah 
     canvas.add(img).setActiveObject(img); 
    }); 

    //Placeholder-Code to stop the loading-image 
    callback(); 
    }); 
} 

createCanvasImage(alert.bind(undefined, "Image loading done!"));