Graphical File Formats Overview Requirements for Formats Terminology

Home , Bitmap, Interlacing (bitmaps), TIFF

Overview • Why have graphics file formats? • What to look for when choosing a file format • A sample tour of different file formats, including – bitmap-based formats Graphical File Formats – vector-based formats To be Covered (AFTER next 2 Lectures on ‘Colour’) – metafiles – proprietary formats – fractal compression formats

The Graphics/Image File Format on wikipedia, other links

Spring 2015 © 66 Spring 2015 © 67 University of Stirling University of Stirling

Requirements for Formats Terminology - Format • Need to store and retrieve graphical data in an Characteristics (or what to look efficient and logical way • Data stored according to specific format conventions out for in file formats) • Formats are immortal – • When choosing which is more appropriate for – technology evolves, new formats appear, but the old ones your purpose, some common factors to will still be there! • No one universal format - different formats for consider: different purposes (tradeoffs!) – Lossy or lossless compression? • You (probably) wont need to access the formats in – What is the compression ratio? detail – 8-bit or 7-bit (binary or text)? – there is (usually) library code to input/output/convert images for you – Is it stored at a fixed resolution? – useful to understand what is going on behind the scenes, – How many images per file (static or animated)? for making the best image format choices – Detail required for modifying images! – progressive download (for the Web) – ….amongst other things Spring 2015 © 68 Spring 2015 © 69 University of Stirling University of Stirling Bitmaps Compression • Generalised structure of a bitmap file: • Uncompressed image files are big – E.g. 2048 x 1536 at 3 bytes/pixel = about 9Mbytes. • They take up a lot of space, and take a long time to download • Compressing them makes them smaller: • Lossless compression: the resynthesized image is identical to the original In practice there are many format variations • Lossy compression: the resynthesized image • Palette -indexed mode differs from the original • why a palette? • only a few colours used - takes up too much space to use 3 bytes for each – But in ways that are hard to see, hopefully pixel, instead label each colour with a number, it’s the number what is stored Springin 2015the palette © 70 Spring 2015 © 71 University of Stirling University of Stirling

PBM, PGM, PPM PBM Format

• Portable Bit Map for monochrome images • (old) Family of portable bitmaps: – Portable Bit/Gray/Pix Map • Designed to be as simple as possible • Written in ASCII (ancient) • feep.pbm: • 7 bit code 24 7 • No compression 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 1 1 1 0 0 1 1 1 1 0 0 1 1 1 1 0 0 1 1 1 1 0 • 1 image per file 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 1 0 0 1 1 1 0 0 0 1 1 1 0 0 0 1 1 1 0 0 0 1 1 1 1 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 1 1 1 0 0 1 1 1 1 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0

Spring 2015 © 72 Spring 2015 © 73 University of Stirling University of Stirling PGM Format PPM Format

• Portable Gray Map for grayscale images • Portable Pix Map for coloured images

• feep.pgm: 24 7 15 • square.ppm: 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 3 3 3 3 0 0 7 7 7 7 0 0 11 11 11 11 0 0 15 15 15 15 0 4 4 0 3 0 0 0 0 0 7 0 0 0 0 0 11 0 0 0 0 0 15 0 0 15 0 15 0 3 3 3 0 0 0 7 7 7 0 0 0 11 11 11 0 0 0 15 15 15 15 0 0 0 0 0 0 0 0 0 0 0 0 15 0 3 0 0 0 0 0 7 0 0 0 0 0 11 0 0 0 0 0 15 0 0 0 0 0 0 0 0 15 0 0 0 0 0 0 0 0 3 0 0 0 0 0 7 7 7 7 0 0 11 11 11 11 0 0 15 0 0 0 0 0 0 0 0 0 0 0 15 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 15 0 0 0 0 0 0 0 0 0

Spring 2015 © 74 Spring 2015 © 75 University of Stirling University of Stirling

BMP BMP Format

• Standard bitmap storage format for Microsoft Windows (also supported by some other non-Microsoft applications) ) – not especially designed for portability – not especially designed for data interchange format across different operating systems – 1 image per file with RLE (run-length encoding) • therefore uses lossless compression • original bitmap did not support Compression – huge file sizes, e.g. this photo is 40.3Kb as JPEG, 963Kb as BMP:

Spring 2015 © 76 Spring 2015 © 77 University of Stirling University of Stirling GIF GIF Format

• Graphics Interchange Format (1987 & 1989 versions): – pronounced ‘jiff’ • Uses a palette of up to 256 colours: – good for text/diagrams, not good for photos • Uses LZW (Lempel, Ziv, Welch) compression: – possible copyright problems (Unisys patent) – reasonably easy to read and decompress • Supports multiple images (for animation) • GIF 1989 supports transparency & interlacing – At most one colour in the palette may be declared transparent – Interlacing for progressive download Spring 2015 © 78 Spring 2015 © 79 University of Stirling University of Stirling

Interlacing Pixel Data Interlacing

Row Number Interlace Pass

0 ------1 1 ------4 2 ------3 3 ------4 4 ------2 5 ------4 6 ------3 7 ------4 8 ------1 9 ------4 10 ------3 11 ------4 12 ------2 13 ------4 14 ------3 15 ------4 16 ------1 17 ------4 18 ------3 19 ------4

Spring 2015 © 80 Spring 2015 © 81 University of Stirling University of Stirling PNG JFIF • Portable Network Graphics: – informally stands for ‘PNG Not GIF’ • JPEG File Interchange Format – pronounced ‘ping’ • There is no (single) JPEG format… • Successor to GIF as a lossless but patent-free • Basically a data stream with a few restrictions solution! and identifying markers • Unrestricted palette - up to 48-bit true colour

• Transparency, interlacing, but not animation: • JPEG (Joint Photographic Experts Group) – animation available in a related format, MNG properly refers to the compression algorithms • Transparency through an alpha channel used – also supports anti-aliasing – typically between 10:1 - 20:1 for photographs • Compression marginally better than GIF (based on – Details of the compression algorithm: see Wikipedia LZ77 – earlier than LZW) JPEG entry

Spring 2015 © 82 Spring 2015 © 83 University of Stirling University of Stirling

TIFF FIG

• Tagged Image File Format • Facility for Interactive Generation (of • Designed mainly for desktop publishing and figures): related applications – proprietary vector format • Contains lots of tags in the file, identifying – used with jfig and xfig drawing programs different types of content – text file – makes it easier to add new features – Rationale behind using tags is that it is easier to incorporate new features in future versions of the format without confusing old software, or making old TIFF images useless • Very complex since may contain multiple internal image formats Spring 2015 © 84 Spring 2015 © 85 University of Stirling University of Stirling SVG SVG Example • Scalable Vector Graphics • XML language for vector graphics in web pages: – plug-ins available for common browsers – separate text file or embedded in HTML

CGM POVRay

• Computer Graphics Metafile • POVRay is a 3-D computer graphics ray-tracing • An international standard rendering program: • Three different encodings: – it has its own proprietary 3D scene-based format, looks like program code – One for minimal size/ease of transmission – binary encoded for speed of access – example – clear text for human readability/editing • Primarily vector graphics, but also bitmap data – An ISO standard

• Virtual Reality Modelling Language: • Fractal Image Format – pronounced ‘virmal’ • Barnsley (and later, Jacquin) developed the • Interactive 3-D worlds with browser plug-ins compression technique • Commercial format by Iterated System Inc • Somewhat over-hyped: – e.g. claims of 1000s:1 compression – compression ratios more typically 4:1 - 100:1 • Good for most pictures, particularly photographs and scenes with some self- similarity (which is common)

Comparison Table

Raw Data 100% 100% 100% PPM 407% 406% 406% BMP 100% 33% 33% GIF 19% 18% 1% PNG 32% 16% 1% TIFF (LZW) 111% 18% 1% JPEG 5% 5% 10% FIF 5% 6% 3%