How to load TIFF image with fabric.js?

Question

From what I can tell, fabric.js can only load either JPG or PNG files. It fails when I try to load a TIFF file. Any idea?

fabric.Image.fromURL('my_image.tif', function(oImg) {
  canvas.add(oImg);
});

Answer 1

This is not really a problem with FabricJS, but more that browsers in general does not support the TIFF file format . IE and Safari being exceptions as well as some less mainstream browsers.

Workarounds

However, it is possible to read and parse TIFF files manually. To read TIFF you can use for example tiff-js . You may be able to get plugins for a browser that can decode TIFFs (the latter will possibly require end-user to also install the plugin as well).

Though, I would recommend you to convert TIFF to for example PNG for general use.

Similarly, you will not be able to save out TIFF either for the same reasons as above, but feel free to look at my canvas-to-tiff solution for that (free).