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 <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg"> <g style="fill-opacity:0.7; stroke:black; stroke-width:0.1cm;"> <circle cx="6cm" cy="2cm" r="100" style="fill:red;" transform="translate(0,50)"/> </g> </svg> Spring 2015 © 86 Spring 2015 © 87 University of Stirling University of Stirling 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 Spring 2015 © 88 Spring 2015 © 89 University of Stirling University of Stirling VRML / X3D FIF • 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) Spring 2015 © 90 Spring 2015 © 91 University of Stirling University of Stirling 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% Spring 2015 © 92 University of Stirling .