CODEWITHSUNDEEP
jqueryhtmlcanvasfabricjs
Lee Evans
Lee Evans

Reputation: 15

setOverlayImage error in fabricJS canvas - bug?

I'm having an problem where every time the mouse is clicked and dragged to select a section of the canvas a large amount of the same error will appear. I've stripped my code down to the bare minimum to make this error happen:

var canvas = new fabric.Canvas('card_canvas'); canvas.setOverlayImage('/man/images/card_overlay.png',canvas.renderAll.bind(canvas));

This error can also be seen on the setOverlayImage demo on the fabricJS website, the error is:

TypeError: Argument 1 of CanvasRenderingContext2D.drawImage could not be converted to any of: HTMLImageElement, HTMLCanvasElement, HTMLVideoElement.

From what i understand this is due to setOverlayImage using a url string instead of an image object, however if i pass an image object through it won't work at all. How would i go about fixing this?

Upvotes: 1

Views: 655

Answers (1)

Onirom
Onirom

Reputation: 592

The code you posted seem to work fine, this jsfiddle use the latest version of the library from the github repository, maybe the bug was fixed then.

Alternative :

fabric.Image.fromURL('/man/images/card_overlay.png', function(img) {
    canvas.setOverlayImage(img, canvas.renderAll.bind(canvas));
});

Upvotes: 2

Related Questions