Is there an HTML5 method for displaying a tiff image data already loaded into memory

Question

I have a tiff image stored in memory (in a javascript variable). What is the javascript or html technique for displaying this image in the browser window? Is there a "drawimage" type of function?

Answer 1

Native browser-support for tiff files is still pretty bad.
Wikipedia has a nice overview on browsers Image format support.

That being said; since a .tiff image is still essentially a raster-image, one could indeed convert it (the tricky part is stuff like supporting different compression-algorithms like PACKBITS, DEFLATE, LZW, etc) to another (browser-supported) raster-format (so one could feed it as a data:img-source).

There is a library called Tiffus: a client side pure Javascript imaging library to load, save and manipulate binary images.

The original project aim was was to create a plain Javascript chrome extension which can convert single/multi page TIFF image/s to BMP/GIF image (this is where the name came from).

However now it supports:

• Windows BMP (no compression, RLE)
• OS/2 BMP
• ICO
• GIF
• JPEG
• PNG
• TIFF

and currently supports the folloing image functions:

• load
• save
• resize
• flip
• invert color

Basically it works like this:

1. Source image downloaded as Binary Data using XMLHttpRequest with MimeType('text/plain; charset=x-user-defined'); (future: HTML5 Canvas ImageData)
2. Imageprocessing using Tiffus
3. Desination image shown as Data URI scheme (future: HTML5 Canvas ImageData)

Note that according to the above; the author expects to use HTML5 Canvas ImageData in the future.

Hope this helps!